[Solved] Symbol changes not showing up with Scattermapbox

[qdumont]

Does anyone experience the same?

I have been plotting location on a map using go.Scattermapbox. Everything works perfectly fine except the Scatter points are vanishing if I change their shape using ‘symbol’.

Weird fact, the change does appear in the legend but is not being plotted. I tried with different symbol (diamond, cross, etc…)

indent preformatted text by 4 spaces

data = go.Scattermapbox(
        lon = df.LON,
        lat = df.LAT,
        mode = 'markers',
        marker=dict(size=15,
                    color= 'red',
                    opacity = 0.7)

This piece of code does make all points appearing.

data = go.Scattermapbox(
        lon = df.LON,
        lat = df.LAT,
        mode = 'markers',
        marker=dict(size=15,
                    symbol = 'diamond'
                    color= 'red',
                    opacity = 0.7)

and is this one, the points are ‘disappearing’.

Many thanks for your time and reply guys !

PS : I tried on Jupyter Notebook + Dash App on local host. Both did not work.

[jmmease]

Hi @qdumont,

The trouble you’re running into is that marker symbols for the scattermapbox trace work a bit differently than scatter traces because the marker rendering is actually performed by the Mapbox library. Here’s the docstring for the scattermapbox.marker.symbol property.

Sets the marker symbol. Full list: https://www.mapbox.com/maki-
icons/ Note that the array `marker.color` and `marker.size` are
only available for "circle" symbols.

If you visit https://www.mapbox.com/maki-icons/ you can hover over the icons to see the name of each symbol. The name you specify should include everything up until the hyphen. For example, if you hover over an air plain icon and the tooltip says that it’s called airfield-11.svg, you use 'airfield' as the symbol.

Hope that helps!
-Jon

[qdumont]

Hi @jmmease,

Thanks a lot for the explanation and the solution. I see how it will work. For the moment I moved to another part of the Dashboard but will update and provide the code when I will have changed it.

Many thanks,

Quentin.

[sladkovm]

Does not seem to work me. Here is a code snippet:

        go.Scattermapbox(
            name='Home',
            lat=[home.latitude],
            lon=[home.longitude],
            mode='markers+text',
            textposition="bottom center",
            marker=go.scattermapbox.Marker(
                size=10,
                color='red',
                symbol="home"
            ),
            text=['Home'],
            hoverinfo='text',
            textfont=dict(color='red')
        )

They also have 11 and 15 version of each marker, I’ve tried all with hyphens and with .svg - non of those is rendering.

[sladkovm]

Got it, 'home" does not work, but “castle” does. Will take it

[qdumont]

Hi @jmmease,

quick question, is is normal that some of the symbol do plot, and some don’t. For example, @sladkovm 's situation.

"castle" works but not "home",
"airfield" / "airport" works but not "city" or "commercial"

Do you guys know anything about that?

Quentin

[jmmease]

Hi @qdumont,

I’m not sure, where are you getting the names “home”, “city”, “commercial”?

-Jon

[qdumont]

Hi @jmmease from the link you posted earlier :

If you visit https://www.mapbox.com/maki-icons/ you can hover over the icons to see the name of each symbol.

These are random names i picked up, it seems some icon does not seems to be working, or am I mistaken?

[cufflink]

@jmmease - Is there an open case regarding the missing symbols? I’m trying to use “wheelchair”, which is part of the mapbox icons at https://labs.mapbox.com/maki-icons/, but this particular symbol is not working for me. Other symbols (e.g., bus, embassy) are working just fine though.

[pengchuzhang]

Related to the threat, I am trying to have a map with temperature on it. If I enlarge the temperature measurements to cover the area, the circles overlapping each other and do not look good:

I recalled that plotly has an example of heatmap that shows color change continuously, but unable to find it.

[pengchuzhang]

The code I used:
mode=‘markers’,
hoverinfo=‘text’,
marker=go.scattermapbox.Marker(
showscale=True,
size=40,
color=df_sub[‘air_f’].values,
colorscale=colorscale,
opacity=0.3,
)

[zoohair]

I think the issue is whether the icons are included in the style you are using or not. For example, wheelchair doesn’t seem to be included in the default monochrome theme

(screenshot from mapbox studio)

[cufflink]

Interesting. I noticed that the icons have different colors though. For example, “bus” is blue and “embassy” is brown. Does that mean that different icons have different themes/palettes? I think we need an official response from Plotly on this. I’ll try to bring it up once I have enterprise support.

[haneul214]

Thanks for the help, however symbol does not seem to work when I am using different style map.

fig.update_layout(
    hovermode='closest',
    mapbox_style = 'open-street-map',
    mapbox=dict(
        accesstoken=MAPBOX_API_KEY,
        bearing=0,
        center=go.layout.mapbox.Center(
            lat=67.494014,
            lon=17.073251
        ),
        pitch=0,
        zoom=11
    )
)

When I remove mapbox_style, it works.

Also can we add color to symbols? I would like to add different colors for each category.

[joansart16]

I have a question. How I can put maki -icons in my scattermapbox in dash?
I’ve downloaded the library Maki Icons | By Mapbox but I don’t know what I have to do with the .zip.

(i’ve tried the same example in Dash Documentation: Scatter plots on mapbox in Python

But in the plot, I only see the lines, not the symbols:

Have you any idea?

Thank you very much!

[dancassin]

I know this is over a year later, but I had the same issue and found my solution. You have the wrong mapbox style selected. The mapbox symbols do not work with the “carto-positron” style.

In order for symbols to work, you need to use the following mapbox styles (in addition to having a free Mapbox account with a public key):

• basic
• streets
• outdoors
• light
• dark
• satellite
• satellite-streets

Reference

Scatter