Custom markers in mapbox map, is it possible?

Hi everyone, hope you’re doing fine. I know this is a question that has already been asked in the past, but two things happen:

  1. In some cases the libraries “suffer” updates
  2. It’s still not clear enough (or at least for me)

I’ve been working on a personal project that consists on a map of coffee places in my city. I managed to create it and host it with azure.


I’m still defining the format, colors, etc. but the main problem I have is that I don’t want the default circles, neither de maki icons from mapbox. I want to add my custom markers, and I can’t understand in which cases that can be done and when it can’t. (I already have the token in case you ask).

As my code is already written using go.scattermapbox I would like to find a way to use my custom Icons markers. If not, I will try other ways. I’ve seen that using “fig.add_layout_image” there’s no problem at all, or even using dash leaflet but well, I want to figure it out.

Thanks!

1 Like

If you want to use a plotly figure, @RenaudLN curated an elegant example on how this can be done,

As you note, another option would be to use dash-leaflet. If you go down that path, you can use the Marker component with custom icon(s),

Marker (dash-leaflet.com)

or the GeoJSON component for more performant rendering (best when you have > 100 markers),

GeojsonTutorial (dash-leaflet.com)

2 Likes

Id recomend using dash leaflet or dash deck, go.scattermapbox isnt my preferred choice when building apps that have a big focus on the map.

Personally with how many coffee shops you are dealing with I’d go the route of @Emil Geojson

ezgif.com-optimize

2 Likes

yeah, it definetly seems that dash leaflet is the best option, so goodbye to mapbox, thanks!

yes I’ve seen the one from RenaudLN, I think I will end up using dash leaflet, thanks!