Fix chart tooltip

This commit is contained in:
Thomas Nordquist
2019-07-13 14:22:33 +02:00
parent 0b6a1e42d6
commit e8e8926757

View File

@@ -89,6 +89,7 @@ export default withTheme((props: Props) => {
) )
const getAnchorElement = useCallback(() => tooltip && tooltip.element, [tooltip]) const getAnchorElement = useCallback(() => tooltip && tooltip.element, [tooltip])
const formatYAxis = useCallback((num: number) => abbreviate(num), [])
const xDomain = useCustomXDomain(props) const xDomain = useCustomXDomain(props)
@@ -114,8 +115,9 @@ export default withTheme((props: Props) => {
onMouseLeave={onMouseLeave} onMouseLeave={onMouseLeave}
> >
<HorizontalGridLines /> <HorizontalGridLines />
<YAxis width={45} tickFormat={(num: number) => abbreviate(num)} /> <YAxis width={45} tickFormat={formatYAxis} />
<LineMarkSeries <LineMarkSeries
color={color}
colorType="literal" colorType="literal"
getColor={highlightSelectedPoint} getColor={highlightSelectedPoint}
onValueMouseOver={showTooltip} onValueMouseOver={showTooltip}
@@ -129,7 +131,7 @@ export default withTheme((props: Props) => {
pointerEvents: 'none', pointerEvents: 'none',
}} }}
> >
<Popper open={Boolean(tooltip)} placement="top" anchorEl={getAnchorElement}> <Popper open={Boolean(tooltip)} placement="top" anchorEl={getAnchorElement()}>
<div <div
style={{ style={{
paddingBottom: '8px', paddingBottom: '8px',