extension of legends

[tkonopka]

Is your feature request related to a problem? Please describe.

The @nivo/legends package creates basic legends, but they cannot be customized to the same extent as the dots/bars/lines in the charts.

Describe the solution you'd like

Extension of the 'legends' features so that all storybook examples of bar/line/scatterplot charts can display an appropriate legend, including

• custom node symbols
• explanations for variable node sizes
• explanations for variable line styles (line thickness and dots/dashes)
• similar features for canvas legends

Describe alternatives you've considered

Custom layers can display arbitrary content, but these features are likely to be reused more than once and it would be great to include these in the legends package.

Additional context

I can prepare a PR with a proposal, but posting this here first to ask for comments/suggestions

[Crystiliser]

I was just looking for a way to add a tooltip to a legend item for legends that had to long of a label to easily fit inside my legend and could not find anything for that, so that might be a cool idea/thing to include in this?

[tkonopka]

Thanks for suggesting, @Crystiliser. Something of sorts might be possible with the existing legends by setting onMouseEnter and onMouseLeave. You could create handlers to display/hide a tooltip. Again, this might be possible, although I haven't tried it.

For your scenario, an alternative approach could be to display a long-ish label in the tooltip that appears when hovering over the data chart. A full label there would perhaps provide explanation for any shortenings in the legend. (?)

[Crystiliser]

Thanks for suggesting, @Crystiliser. Something of sorts might be possible with the existing legends by setting onMouseEnter and onMouseLeave. You could create handlers to display/hide a tooltip. Again, this might be possible, although I haven't tried it.

For your scenario, an alternative approach could be to display a long-ish label in the tooltip that appears when hovering over the data chart. A full label there would perhaps provide explanation for any shortenings in the legend. (?)

Thank you @tkonopka I was trying something with the onMouse events but the issue was we need a tooltip specifically over the legend items, and there isn't really a way to get their location from what I can tell, so I can;t add something just to the absolute position of the legend for a tooltip. I would add something in the datachart itself but we already have a custom tooltip there with a different set of information(ranking things + showing the actual exact values of things on the xSlice). Currently just resolving to make the Legend labels shorter( and adding a '...') if they exceed a certain character limit so they don't cross into each other.

[stale[bot]]

This issue has been automatically marked as stale. If this issue is still affecting you, please leave any comment (for example, "bump"), and we'll keep it open. We are sorry that we haven't been able to prioritize it yet. If you have any new additional information, please include it with your comment!

[stale[bot]]

Closing this issue after a prolonged period of inactivity. If this issue is still present in the latest release, please create a new issue with up-to-date information. Thank you!