add trace `legendItem` styles

[etpinard]

I'm thinking of adding a new trace attribute container: legenditem

{
  x: [/* */],
  y: [/* */],
  legenditem: {
    textfont: {
       color: 'red'
       size: 12
     },
     marker: {
       size: 20,
       symbol: 'circle',
       line: {width: 2, color: '#444'}
     }
  }
}

to the scatter*, bar* and pie traces to make their legend item styling configurable. This would be an easy (easier than @alexcjohnson 's legend 2.0 idea :smirk: ) solution to https://github.com/plotly/plotly.js/issues/2967, https://github.com/plotly/plotly.js/issues/2080, https://github.com/plotly/plotly.js/issues/1701 and https://github.com/plotly/plotly.js/issues/1560

---

By the way, I'm thinking a naming this new container legenditem and not legend as I'm thinking legend could eventually be used when we implement multiple legends where e.g. legend: 'legend2' would mean "put this trace's legend item in the second legend".

One more note on @alexcjohnson 's legend 2.0 idea: having legenditem in traces wouldn't make it obsolete. We could still add a way to turn annotations into legend items later.

Thoughts?

[alexcjohnson]

Oh sure, if legends 2.0 ever happens it would play just fine with this. Great idea 💯

[alexcjohnson]

Would this idea replace #3732 or would we still continue with that?

[etpinard]

Would this idea replace #3732 or would we still continue with that?

This ticket will augment (not replace) #3732

[kris16034]

I know I am a random nobody Intruding on this conversation but I have a team of data analysts that want to switch to plotly but struggle with the legend versatility (we have a variety of complicated custom plots) 3732 would greatly help. Any plans to put this in ?

[brian428]

@etpinard I know this is an older ticket but it's still a limitation for us. In our case, we have traces with multiple symbols. Right now, the legend symbol is always whatever symbol is used for the first point, which is quite confusing to our users. It would be great to have the option to specify the legend marker as you outlined in your initial comment. Any chance this will get implemented in the near future?

[brian428]

Honestly even an option to just always use a standard circle would work for us, if exposing all the other style options would be significant work. Maybe just an itemsymbol: "constant" option to go along with the itemsizing option?

[jleape]

This was an issue for a plot where I put a border around the bar with the highest value. To avoid getting a border around the legend item when the first bar is the winner, I just added buffers ([' '] and [0]) to the x and y vectors and set the xaxis range to [1:len(y)]. Not ideal, but it let me keep my square legend items, consistent with other plots.

[PlatosTwin]

Any developments on this question? I can offer the following as a use case:

Within each trace I color markers and marker borders according to various criteria—but this means that when the legend is generated, marker colors and borders come out in odd combinations. It would be ideal to be able to set the legend marker color and border manually.

(I should mention that the above is with plotly.py.)

[rom3k]

Any updates on this issue?

[mhangaard]

Would be great to be able to remove legenditem marker transparency for a case like this

[janjongboom]

One workaround is to update the DOM after the graph is rendered, e.g. this sets all icons to a circle (even if the first item in the trace is e.g. a square):

for (let el of document.querySelectorAll('.legendpoints .scatterpts')) { 
    el.setAttribute('d', 'M5,0A5,5 0 1,1 0,-5A5,5 0 0,1 5,0Z'); 
}