Add support for custom tooltip

[plouc]

Allowing custom tooltips has been requested several times:

#117 | #186 | #120

This issue is used to track down the ongoing implementation of custom tooltips on all nivo packages/components:

• @nivo/bar ResponsiveBar >=0.36.0
• @nivo/bar ResponsiveBarCanvas >=0.36.0
• @nivo/bullet ResponsiveBullet - feat(bullet): add custom tooltip #1694
• @nivo/calendar ResponsiveCalendar - Improve @nivo/calendar package #223
• @nivo/chord ResponsiveChord
• @nivo/chord ResponsiveChordCanvas
• @nivo/circle-packing ResponsiveBubble - feat(tooltips): add support for custom tooltips for bubble charts and treemaps #200
• @nivo/circle-packing ResponsiveBubbleHtml - feat(tooltips): add support for custom tooltips for bubble charts and treemaps #200
• @nivo/circle-packing ResponsiveBubbleCanvas - feat(tooltips): add support for custom tooltips for bubble charts and treemaps #200
• @nivo/heatmap ResponsiveHeatMap
• @nivo/heatmap ResponsiveHeatMapCanvas
• @nivo/line ResponsiveLine - Add support for custom tooltip in line #258
• @nivo/pie ResponsivePie - feat(pie): add support for custom tooltip #208
• @nivo/pie ResponsivePieCanvas
• @nivo/radar ResponsiveRadar - @nivo/radar TypeScript migration #1761
• @nivo/sankey ResponsiveSankey
• @nivo/scatterplot ResponsiveScatterPlot - Custom tooltips on ScatterPlot + optionally pass a function to the 'symbolSize' prop #255
• @nivo/scatterplot ResponsiveScatterPlotCanvas
• @nivo/stream ResponsiveStream - Migrate stream package to TypeScript #1721
• @nivo/sunburst ResponsiveSunburst
• @nivo/treemap ResponsiveTreeMap - feat(tooltips): add support for custom tooltips for bubble charts and treemaps #200
• @nivo/treemap ResponsiveTreeMapHtml - feat(tooltips): add support for custom tooltips for bubble charts and treemaps #200
• @nivo/treemap ResponsiveTreeMapCanvas - feat(tooltips): add support for custom tooltips for bubble charts and treemaps #200
• @nivo/waffle ResponsiveWaffle - feat(waffle): add waffle package #202
• @nivo/waffle ResponsiveWaffleHtml - feat(waffle): add waffle package #202
• @nivo/waffle ResponsiveWaffleCanvas - feat(waffle): add waffle package #202

[vinayshah1998]

bump

[wyze]

Thanks for the bump @vinayshah1998. I put a label on so it won't go stale again.

[mvdobrinin]

Would be good to have this for Stream. 👍

[markopaju]

Would be good to have this for Bullet. 👍

[nathsou]

Would be awesome to have this for Radar too 😅

[jlaguma]

I have a Scatterplot chart where I need a tooltip to only appear when mouse is over the particular "dot" on the chart. On "ScatterPlot", I'm able to achieve this by using "useMesh=false". On "ScatterPlotCanvas" that option has no effect on tooltip, and tooltip is visible no matter where the mouse is on the chart. Can someone suggest if this is possible on "ScatterPlotCanvas" or "ResponsiveScatterPlotCanvas"? Posting it here, as it seems to be related to unsupported tooltip behaviour.

[BrawlingBear]

It would be great to have this for the Radar. It would allow users to work around the single maxValue property. In my case, I scaled down relevant metrics so that they are always between 0 and 1, but I cannot display unscaled values on tooltips.

[jquintozamora]

@wyze @plouc wondering what are the plans for next release, as I'd be interested on using custom tooltip for Bullet.

Thanks!

[ChuckJonas]

I'm also in need for the bullet custom tooltip. TY

[plouc]

Support added for @nivo/stream via #1721.

[plouc]

@jquintozamora, @ChuckJonas, I'll try to release this week, sorry for the delay.

[plouc]

Support added for @nivo/radar, the list is now complete.

[ericanaughton]

@nivo/scatterplot ResponsiveScatterPlotCanvas is missing the support for custom tooltip.

[mauro-mascia]

also @nivo/radialbar ResponsiveRadialBar is missing the support for custom tooltip