How can I make the legend items bigger with react-plotly.js?

Question

I'm using react-plotly.js and I have a graph with some dots with a color and a border. I want the border to be thick, the problem is that it looks bad in the legend, because the legend is so small.

Is there a way to either remove the border from the legend, or increase the size of the dots on the legend?

viewed on the graph:

how it shows on the legend:

Similar issue someone had, can't resize items only text

Answer 1

You can try this :

fig.update_layout(legend_itemsizing="constant")

itemsizing - Determines if the legend items symbols scale with their corresponding "trace" attributes or remain "constant" independent of the symbol size on the graph.

In general, we set itemsizing="constant" if the marker size is a variable and itemsizing="trace" if the marker size is fixed, but in your situation when the marker size is fixed to a small value which is too small for the legend, the "constant" sizing probably remains the best option.

However, this constant is hardcoded somewhere and we can't override it, so the resulting size in the legend might not suffice. The only other way ("trace") sadly requires to increase the marker size on the traces.