A variation around the ScatterPlot component. Well suited for large data sets as it does not impact DOM tree depth, however you'll lose the isomorphic ability and transitions.
The responsive alternative of this component is
ResponsiveScatterPlotCanvas, it also offers another
implementation, see ScatterPlot.
Chart data.
X scale configuration.
Optional formatter for x values.
Y scale configuration.
Optional formatter for y values.
'(d) => `${d.serieId}.${d.index}`'ID accessor for the node.
9How to compute node size, static or dynamic.
Chart width.
Chart height.
'Depends on device'Adjust pixel ratio, useful for HiDPI screens.
Chart margin.
Define style for common elements such as labels, axes…
Define chart's colors.
'grid', 'axes', 'nodes', 'markers', 'mesh', 'legends', 'annotations']Defines the order of layers.
Override default node rendering for SVG implementation.
Override default node rendering for canvas implementation.
trueEnable/disable x grid.
Specify values to use for vertical grid lines.
trueEnable/disable y grid.
Specify values to use for horizontal grid lines.
Top axis configuration.
Right axis configuration.
Bottom axis configuration.
Left axis configuration.
trueEnable/disable interactivity.
trueUse a mesh to detect mouse interactions.
falseDisplay mesh used to detect mouse interactions (voronoi cells).
Custom tooltip component
onMouseEnter handler, it receives target node data and mouse event.
onMouseMove handler, it receives target node data and mouse event.
onMouseLeave handler, it receives target node data and mouse event.
onClick handler, it receives target node data and mouse event.
Optional chart's legends.
Defines legend anchor relative to chart's viewport.
Legend direction, must be one of 'column', 'row'.
Justify symbol and label.
Legend block x translation.
Legend block y translation.
Legend item width.
Legend item height.
Spacing between each item.
Item symbol size.
Item layout direction.
Extra annotations.
Extra markers.
trueEnable/disable transitions.
'default'Motion config for react-spring, either a preset or a custom configuration.