mapbox-gl-js icon indicating copy to clipboard operation
mapbox-gl-js copied to clipboard

Incomplete lines: problem with mixing layers slot

Open ArmandBahi opened this issue 1 year ago • 3 comments

mapbox-gl-js version: v3.4.0 / v3.5.0-beta.1

browser: All chromium & Firefox

Steps to Trigger Behavior

  1. Use the standard mapbox style
  2. Create a line layer with slot: "top"
  3. Create a line layer with slot: "middle"

Screenshots

On the left is the slot=middle feature and the problem occurs on the right hand feature with slot=top

image

Link to Demonstration

Put your access token ;) https://jsfiddle.net/ArmandBahi/0afktyqv/5/

Description

I've added two layers, the first with slot=top and the second with slot=middle as below

map.addLayer({
    id: 'line1',
    source: 'line1',
    type: 'line',
    slot: 'top',
    paint: {
        "line-color": "blue",
        "line-width": 2,
        "line-translate-anchor": "viewport",
        "line-emissive-strength": 1,
        "line-occlusion-opacity": 1
    }
});

map.addLayer({
    id: 'line2',
    source: 'line2',
    type: 'line',
    slot: 'middle',
    paint: {
        "line-color": "blue",
        "line-width": 2,
        "line-translate-anchor": "viewport",
        "line-emissive-strength": 1,
        "line-occlusion-opacity": 1
    }
});

When doing this the slot=top layer is messing up with buildings.

I've also notice that if I add the slot=middle before slot=top then I do not have the problem

ArmandBahi avatar Jun 24 '24 10:06 ArmandBahi

Hey @ArmandBahi,

I'm a bit confused. Could you please explain a bit more what you mean by "is messing up with buildings"?

Just so you know, during 3D globe and terrain rendering, GL JS aims to batch multiple layers together for optimal performance. This process might lead to a rearrangement of layers. Layers draped over the globe and terrain, such as fill, line, background, hillshade, and raster, are rendered first. These layers are rendered underneath symbols, regardless of whether they are placed in the middle or top slots or without a designated slot

stepankuzmin avatar Jul 18 '24 11:07 stepankuzmin

By "is messing up with buildings" I mean this, it looks like the building shadow hides part of the linestring

image

ArmandBahi avatar Jul 18 '24 11:07 ArmandBahi

Got it, thanks!

stepankuzmin avatar Jul 24 '24 13:07 stepankuzmin

This is fixed in the latest version

ibesora avatar May 16 '25 10:05 ibesora