Closed longxiutmm closed 2 years ago
I use MapboxLayer 、ArcLayer and maplibre 2.1.9, the 3d building layer always cover the arcLayer
No response
blow is my code.
<html> <head> <title>Interleaving deck.gl with Mapbox Layers</title> <script src="https://unpkg.com/deck.gl@^8.8.0/dist.min.js"></script> <script src='https://unpkg.com/maplibre-gl@2.1.9/dist/maplibre-gl.js'></script> <link href='https://unpkg.com/maplibre-gl@2.1.9/dist/maplibre-gl.css' rel='stylesheet' /> </head> <body style="margin:0"> </body> <script type="text/javascript"> const {MapboxLayer, ScatterplotLayer, ArcLayer} = deck; var map = new maplibregl.Map({ container: document.body, style: 'https://api.maptiler.com/maps/streets/style.json?key=get_your_own_OpIi9ZULNHzrESv6T2vL', // stylesheet location center: [-122.4, 37.79], zoom: 15, pitch: 60 }); map.on('load', () => { const firstLabelLayerId = map.getStyle().layers.find(layer => layer.type === 'symbol').id; map.setPaintProperty('building-3d','fill-extrusion-opacity',0.8); map.addLayer(new MapboxLayer({ id: 'deckgl-circle', type: ScatterplotLayer, data: [ {position: [-122.402, 37.79], color: [255, 0, 0], radius: 1000} ], getPosition: d => d.position, getFillColor: d => d.color, getRadius: d => d.radius, opacity: 0.3 }), firstLabelLayerId); map.addLayer(new MapboxLayer({ id: 'deckgl-arc', type: ArcLayer, data: [ {source: [-122.3998664, 37.7883697], target: [ -122.41460563510304, 37.79512692863844]} ], getSourcePosition: d => d.source, getTargetPosition: d => d.target, getSourceColor: [255, 208, 0], getTargetColor: [0, 128, 255], getWidth: 20 })) }); </script> </html>
This was working as expected in maplibre-gl up till v1.15.3. I suggest you make an inquiry in their repo on what breaking changes were made.
This is fixed by maplibre-gl 2.3.0.
Description
I use MapboxLayer 、ArcLayer and maplibre 2.1.9, the 3d building layer always cover the arcLayer
Flavors
Expected Behavior
No response
Steps to Reproduce
blow is my code.
Environment
Logs
No response