diff --git a/packages/bump/src/bump/Point.js b/packages/bump/src/bump/Point.js index 23b56c12d..f7b7ce70c 100644 --- a/packages/bump/src/bump/Point.js +++ b/packages/bump/src/bump/Point.js @@ -26,6 +26,7 @@ const Point = ({ x, y, size, color, borderColor, borderWidth }) => { } Point.propTypes = { + data: PropTypes.object.isRequired, x: PropTypes.number.isRequired, y: PropTypes.number.isRequired, size: PropTypes.number.isRequired, diff --git a/packages/bump/src/bump/Points.js b/packages/bump/src/bump/Points.js index 61ed77e5d..6b7d8f7af 100644 --- a/packages/bump/src/bump/Points.js +++ b/packages/bump/src/bump/Points.js @@ -11,8 +11,6 @@ import PropTypes from 'prop-types' import { TransitionMotion, spring } from 'react-motion' import { useMotionConfig } from '@nivo/core' -const pointStyle = { pointerEvents: 'none' } - const Points = ({ pointComponent, points }) => { const { animate, springConfig } = useMotionConfig() @@ -20,6 +18,7 @@ const Points = ({ pointComponent, points }) => { return points.map(point => { return React.createElement(pointComponent, { key: point.id, + data: point.data, x: point.x, y: point.y, size: point.style.size, @@ -48,6 +47,7 @@ const Points = ({ pointComponent, points }) => { {interpolated.map(({ key, style, data: point }) => { return React.createElement(pointComponent, { key, + data: point.data, x: style.x, y: point.y, size: Math.max(style.size, 0), @@ -67,6 +67,7 @@ Points.propTypes = { points: PropTypes.arrayOf( PropTypes.shape({ id: PropTypes.string.isRequired, + data: PropTypes.object.isRequired, x: PropTypes.number.isRequired, y: PropTypes.number.isRequired, color: PropTypes.string.isRequired, diff --git a/packages/bump/src/bump/compute.js b/packages/bump/src/bump/compute.js index d8231cd35..9bfae33c4 100644 --- a/packages/bump/src/bump/compute.js +++ b/packages/bump/src/bump/compute.js @@ -39,11 +39,11 @@ export const computeSeries = ({ width, height, data, xPadding, xOuterPadding, yO rawSerie.data.forEach((datum, i) => { const point = { - ...datum, id: `${rawSerie.id}.${datum.x}`, x: xScale(datum.x), y: yScale(datum.y), serie: rawSerie, + data: datum, } serie.points.push(point) diff --git a/packages/bump/stories/bump.stories.js b/packages/bump/stories/bump.stories.js index 5d0c58bfb..6fec0f735 100644 --- a/packages/bump/stories/bump.stories.js +++ b/packages/bump/stories/bump.stories.js @@ -20,6 +20,7 @@ const generateData = () => { series[i].data.push({ x: year, y: rank, + extra: Math.random(), }) }) })