diff --git a/debug/query-raster.html b/debug/query-raster.html new file mode 100644 index 00000000000..6b6354161db --- /dev/null +++ b/debug/query-raster.html @@ -0,0 +1,61 @@ + + + + Mapbox GL JS debug page + + + + + + + +
+
+ + + + + + diff --git a/src/render/painter.js b/src/render/painter.js index 3cc4f178995..41d9751d180 100644 --- a/src/render/painter.js +++ b/src/render/painter.js @@ -718,6 +718,61 @@ class Painter { } } + colorForLayerPoint(layerId: string, point: PointLike) { + + const layer = this.style._layers[layerId]; + if (layer.type !== 'raster') { return } + + const sourceCache = this.style._getLayerSourceCache(layer); + + sourceCache.prepare(this.context); + + const coordsAscending: Array = sourceCache.getVisibleCoordinates(); + const coordsDescending: Array = coordsAscending.slice().reverse(); + + // Rebind the main framebuffer now that all offscreen layers have been rendered: + // this.context.bindFramebuffer.set(null); + this.context.viewport.set([0, 0, this.width, this.height]); + + this.context.clear({ + color: 'rgba(0,0,0,0)', //options.showOverdrawInspector ? Color.black : clearColor, + depth: 1, + }); + this.clearStencil(); + + this._showOverdrawInspector = false; //options.showOverdrawInspector; + + this.renderPass = "translucent"; + + // For symbol layers in the translucent pass, we add extra tiles to the renderable set + // for cross-tile symbol fading. Symbol layers don't use tile clipping, so no need to render + // separate clipping masks + const coords = sourceCache + ? coordsDescending + : undefined; + + this._renderTileClippingMasks( + layer, + sourceCache, + sourceCache ? coordsAscending : undefined + ); + this.renderLayer(this, sourceCache, layer, coords); + + const gl = this.context.gl; + var pixel = new Uint8Array(4); + gl.readPixels( + point.x * window.devicePixelRatio, + this.height - point.y * window.devicePixelRatio, + 1, + 1, + gl.RGBA, + gl.UNSIGNED_BYTE, + pixel + ); + + return pixel; + } + renderLayer(painter: Painter, sourceCache?: SourceCache, layer: StyleLayer, coords?: Array) { if (layer.isHidden(this.transform.zoom)) return; if (layer.type !== 'background' && layer.type !== 'sky' && layer.type !== 'custom' && !(coords && coords.length)) return; diff --git a/src/ui/map.js b/src/ui/map.js index 9af38147d47..e49c86595b4 100755 --- a/src/ui/map.js +++ b/src/ui/map.js @@ -1504,6 +1504,10 @@ class Map extends Camera { /** @section {Querying features} */ + colorForLayerPoint(layerId: string, point: PointLike) { + return this.painter.colorForLayerPoint(layerId, point) + } + /** * Returns an array of [GeoJSON](http://geojson.org/) * [Feature objects](https://tools.ietf.org/html/rfc7946#section-3.2)