Marker opacity changes before it's behind the mountain

[jashanbhullar]

maplibre-gl-js version: latest/main branch

browser: Mozilla Firefox 114.0 20230605223242 20230605223242

Steps to Trigger Behavior

1.On your local branch npm start
2.Open 3d-Terrain.html
3.Add the following marker

        const marker = new maplibregl.Marker()
            .setLngLat([11.39067, 47.305513])
            .addTo(map);

4. Change the angle so are somewhat looking at horizon, move close the mountain
5. The opacity of the marker changes even before it's behind the mountains

Link to Demonstration

https://output.jsbin.com/vatekax#11.9/47.28354/11.40553/0/52
https://jsbin.com/vatekax/2/edit?html,output

Expected Behavior

The marker visibility should only change when completely behind the mountain

Actual Behavior

The opacity of the marker changes even before it's behind the mountains

Screencast.from.16-07-23.04.37.27.PM.IST.webm

Found when working on this: #1134
Might be related

[SnailBones]

@HarelM I'm interested in this

[HarelM]

Good luck!

[prozessor13]

Hi, i think the depthbuffer-check instead of coords-match-check will not solve this issue. This issue is caused, because only the marker-anchor is checked for visibility. There has to be done more visibility checks inside the Marker-Icon, and then decide if it is needed to hide the marker.
Same issue is at shader code for the symbol visibility check. I first checked the anchor, and if not visible, another check some pixels above:

maplibre-gl-js/src/shaders/_prelude.vertex.glsl

Line 109 in 6e8dbc0

float calculate_visibility(vec4 pos) {

[SnailBones]

Thanks @prozessor13! I've implemented a second visibility check as you suggest in #3431.

[SnailBones]

https://opencollective.com/maplibre/expenses/176000