fix(axis): time series rendering (#1408)

Signed-off-by: András Tóth <andrast@cisco.com>
plouc · Apr 21, 2021 · d80dafd · d80dafd
1 parent ce7c755
commit d80dafd
Show file tree

Hide file tree

Showing 2 changed files with 3 additions and 6 deletions.
diff --git a/packages/axes/src/components/Axis.js b/packages/axes/src/components/Axis.js
@@ -14,8 +14,6 @@ import { computeCartesianTicks, getFormatter } from '../compute'
 import { axisPropTypes } from '../props'
 import AxisTick from './AxisTick'
 
-const defaultTickRenderer = props => <AxisTick {...props} />
-
 const Axis = ({
     axis,
     scale,
@@ -146,7 +144,6 @@ const Axis = ({
                     animatedProps: transitionProps,
                     ...tick,
                     ...(onClick ? { onClick } : {}),
-                    key: tick.key,
                 })
             })}
             <animated.line
@@ -173,7 +170,7 @@ Axis.propTypes = {
     tickPadding: PropTypes.number.isRequired,
     tickRotation: PropTypes.number.isRequired,
     format: PropTypes.oneOfType([PropTypes.func, PropTypes.string]),
-    renderTick: PropTypes.func.isRequired,
+    renderTick: PropTypes.elementType,
     legend: PropTypes.node,
     legendPosition: PropTypes.oneOf(['start', 'middle', 'end']).isRequired,
     legendOffset: PropTypes.number.isRequired,
@@ -186,7 +183,7 @@ Axis.defaultProps = {
     tickSize: 5,
     tickPadding: 5,
     tickRotation: 0,
-    renderTick: defaultTickRenderer,
+    renderTick: AxisTick,
     legendPosition: 'end',
     legendOffset: 0,
 }

diff --git a/packages/axes/src/compute.js b/packages/axes/src/compute.js
@@ -184,7 +184,7 @@ export const computeCartesianTicks = ({
     }
 
     const ticks = values.map(value => ({
-        key: value,
+        key: typeof value === 'number' || typeof value === 'string' ? value : `${value}`,
         value,
         ...translate(value),
         ...line,