Problem
Currently, when adding features to Mapbox GL Draw using draw.add(), the draw layers are always added on top of all existing layers in the map. This causes visual flashing when layers need to be re positioned using map.moveLayer() after creation, as users briefly see the layers in the wrong position before they're moved.
Use Case
In our application, we need footprint draw layers to render below roof surface layers but above parcel layers.
Currently, we have to:
- Add the draw feature (appears on top)
- Use
map.on('idle', ...) to detect when layers are added
- Call
map.moveLayer() to reposition them
This causes a visible flash as the layers appear on top first, then get moved to their correct position.
Proposed Solution
Add support for a beforeId option when adding features, similar to Mapbox GL JS's map.addLayer():
draw.add({
type: "Feature",
geometry: footprintGeometry,
properties: { ... }
}, {
beforeId: 'roof-surface-layer-0' // Position draw layers before this layer
})