Black Lives Matter. Please consider donating to Black Girls Code today.
Dash HoloViews is now available! Check out the docs.

Grouped traces on maps with lines

Graphing Library Plotly.js
#1

Hi!

I’m using Plotly to generate a map with a lines in three different colours:

I’d like to be able to use the legend to toggle each of the groups on and off, but when I add a legend, it shows all the individual traces, so I’d have to click dozens of times to achieve the desired effect.

Is there a way to group these traces so that the legend will just show (e.g.) “blue”, “green”, and “orange”, so that I can toggle them all at once?

Also, a separate question: is it possible to specify different size nodes (markers) at each end of an edge (line)? So far I have only been able to set one size.

Thanks in advance! :slight_smile:

#2

Try using legendgroup:

1 Like
#3

You, sir, are a legend (pun intended).

Thank you very much indeed! :grinning:

#4

@etienne So I have just got round to giving this a try, but it doesn’t seem to work:

Here’s the code: https://jsfiddle.net/26jfjueg/5/

Any idea what I’m doing wrong?

Thanks in advance!

#5

Oh. You’ll need to add showlegend: false to all the traces you don’t want to show in the legend. In your case that would all but the first trace of each legendgroup value.

#6

Ah, got it. So I think I’m almost there…

https://jsfiddle.net/26jfjueg/6/

Now the grouping works (woohoo!), but the traces are all still visible in the legend. It could be my logic, though… would you mind double-checking to see what I’ve done wrong? :slight_smile:

#7

Hey @etienne, any idea what I’m doing wrong here?

#8

Fixed it. Problem between computer and chair.

https://jsfiddle.net/26jfjueg/8/

Incidentally, setting traceorder: 'reversed+grouped' doesn’t work (despite https://plot.ly/python/reference/#layout-legend-traceorder), although traceorder: 'reversed' works fine.

Thanks again for all your help! :slight_smile: