search

mapbox / mapbox-gl-js

Interactive, thoroughly customizable maps in the browser, powered by vector tiles and WebGL
https://docs.mapbox.com/mapbox-gl-js/
Other
11.23k stars 2.23k forks source link

Opaque pass layers do not render correctly over heatmap + fill-extrusion layers #5831

Open lbud opened 6 years ago

lbud commented 6 years ago

Layers drawn during the opaque pass (opaque background + opaque fill layers) cannot render correctly above offscreen texture-based layers (heatmap + fill-extrusion layers): they expect layers "under" them in the layer stack, drawn after them, to use depth testing. When rendering heatmap and fill-extrusion textures back to the map, depth testing is turned off, but it's not as simple as turning depth testing on because projections are done in the offscreen pass, so in the translucent pass the texture copies use a very simple viewport matrix, not the same projection matrices as the rest of the layers, so their depth comparison values wouldn't be relevant anyway. As in https://github.com/mapbox/mapbox-gl-js/issues/2074, a workaround is to set the opaque layers' opacity to 0.99 so as to render them in the translucent pass, but the better fix would be to eliminate the opaque pass (https://github.com/mapbox/mapbox-gl-js/issues/2074#issuecomment-293433951).

chaseacton commented 6 years ago

+1

willrbc commented 4 years ago

This is still an issue. Workaround by setting opacity of the layer that supposed to be in front of the heatmap to 0.99.

chaseacton commented 4 years ago

This is still an issue. Workaround by setting opacity of the layer that supposed to be in front of the heatmap to 0.99.

Thanks @willrbc, will give this a try