Scattermapbox line colors based on value

Hi all,
I’m trying to set the color of the lines based on values from a list.
Because my lines are made by points connected they are also placed as a list and separated by ‘none’ as shown in the example below:

latList = [-1.407788065999966, -1.407767729999932, 'none', -1.407064031999937, -1.407082752999941, -1.406829880999965, 'none', -1.286245225999949, -1.286227953999969, 'none']
lonList = [51.68445894500008, 51.68445831200006, 'none', 51.68407429800004, 51.68422757100007, 51.68424889600004, 'none', 51.68556368200007, 51.68555818300007, 'none']
values = [5, 7, 'none',12, 9, 21, 'none', 2, 22, 'none' ]
fig_map.add_trace(
    go.Scattermapbox(
            lat = latList,
            lon =  lonList,
            mode = 'lines',
            opacity= 1,
            line = dict(
                width = 1,
                color = values,
            ),
    )
)

I have also trying replacing the value for color names, but it doesn’t work either.

Thanks for the help!

It is necessary to make a list of latitude and longitude for each line segment you want to draw, as it will not be automatically detected if you separate them with ‘none’. Also, the color must be set in the marker’s attributes. The color must be specified by default color name or rgb value, not by numerical value. Is your latitude and longitude data correct? In yours, the data showed the sea of Africa, so I reversed it. My apologies if this is incorrect. This is my first post in this community so please forgive me if I am not up to speed.

import plotly.graph_objects as go
import numpy as np

lonList1 = [-1.407788065999966, -1.407767729999932]
lonList2 = [-1.407064031999937, -1.407082752999941, -1.406829880999965]
lonList3 = [-1.286245225999949, -1.286227953999969]
latList1 = [51.68445894500008, 51.68445831200006]
latList2 = [51.68407429800004, 51.68422757100007, 51.68424889600004]
latList3 = [51.68556368200007, 51.68555818300007]
#values = [5, 7, 'none',12, 9, 21, 'none', 2, 22, 'none' ]
colors = ['red','blue','green']

fig_map = go.Figure()
for (lon, lat, c) in [[lonList1,latList1,colors[0]],[lonList2,latList2,colors[1]],[lonList3,latList3,colors[2]]]:
    print(c)
    fig_map.add_trace(
        go.Scattermapbox(
            lat = lat,
            lon = lon,
            mode = 'lines',
            opacity= 1,
            marker=go.scattermapbox.Marker(
                #line=dict(width = 1),
                color = c,
            ),
        )
    )

fig_map.update_layout(mapbox={'style': "stamen-terrain",
                              'center':{'lon': np.mean(lonList2),'lat': np.mean(latList2)},
                              'zoom':18
                             },
                      margin = {'l':0, 'r':0, 'b':0, 't':0})
fig_map.show()

1 Like

Thanks! I’m going to try this and give as a solution!

@r-beginners Thanks so much for your help on this.
I found a workaround for now, but it doesn’t work quite good.

I should explained that this graph is part of a Dash, where the user triggers a location, and as a result the list of lines sometimes are thousands of lines.
So having a loop to create a lot of traces is not the best performance.
The idea should be to have only one trace with all the lines (polyline, that is why I used the ‘none’ in the list) and different colours.

In the meantime, this is the code that I have (it doesn’t work with a lot of lines):

import plotly.graph_objects as go
import numpy as np
import pandas as pd

latList = [[-1.407788065999966, -1.407767729999932], [-1.407064031999937, -1.407082752999941, -1.406829880999965], [-1.286245225999949, -1.286227953999969]]
lonList = [[51.68445894500008, 51.68445831200006], [51.68407429800004, 51.68422757100007, 51.68424889600004], [51.68556368200007, 51.68555818300007]]
values = [5, 9, 3]
colorList = ['red', 'green', 'blue']

linesDF = pd.DataFrame()
linesDF['latList'] = latList
linesDF['lonList'] = lonList
linesDF['colorList'] = colorList


allLines = []

for i in range(len(linesDF)):
    value = linesDF.iloc[i].values.tolist()
    allLines.append(value)


fig_map = go.Figure()
for (lon, lat, c) in allLines:
    fig_map.add_trace(
        go.Scattermapbox(
            lat = lat,
            lon = lon,
            mode = 'lines',
            opacity= 1,
            marker=go.scattermapbox.Marker(
                color = c,
            ),
        )
    )

fig_map.update_layout(mapbox={'style': "stamen-terrain",
                              'center':{'lon': -1.407788065999966,'lat':51.68445894500008},
                              'zoom':18
                             },
                      margin = {'l':0, 'r':0, 'b':0, 't':0})
fig_map.show()

Thanks so much for you help!