Basic information
Platform: Web
Version: 40.1
System/Browser: windows 10 / google chrome
I'm working on this project where i need to implement search function. for that i'm using 'lodash' to filter my geojson data and than create new layer using 'map.addLayer()' , its working fine. once i finish from the layer i use 'map.removeLayer()' to remove that layer.
my issue is: if i needed to do the same search and show the same layer again, i can't after removing it.
to sum up:
map.addLayer(google)
map.removeLayer(google)
map.addLayer(google) <----- doesn't work. this error show up ('There is already a source with this ID')
I need them to be with the same ID.
Thanks for using Mapbox, and sorry to hear you're running into an issue. In order for us to diagnose this issue, we'll need to be able to reproduce it ourselves. Could you please create a minimal self-contained JSFiddle that demonstrates the issue?
My guess is you used a source when you added the layer and once you wanted to remove the old one and add a new one, you didn't do the same thing for the source.
if (map.getLayer(layerName)){
map.removeLayer(layerName);
}
if (map.getSource(sourceName)){
map.removeSource(sourceName);
}
map.addSource(sourceName, {
type: 'geojson',
data: data
});
map.addLayer({...});
yes, i didn't remove the source. do i need to do that ?
regardless, I got over my issue by moving the data that i needed to search into the properties, using map.setFilter() i was able to implement the search function.
love what you guys are doing in mapbox, keep it up ;)
Closing, sounds like the issue is resolved.
Most helpful comment
My guess is you used a source when you added the layer and once you wanted to remove the old one and add a new one, you didn't do the same thing for the source.