I've plotted multiple Line series chart and enabled tooltip. When I do it, it's giving me the value of the last plot. How do I get the Crosshair
values for multiple line series at the same time.
Here is the code for the reference:
const [tooltip, setTooltip] = useState([])
return (
<XYPlot
xType='time'
height={500}
width={2000}
margin={{ left: 80, right: 200, bottom: 100, top: 20 }}
onMouseLeave={() => setTooltip([])}
>
<VerticalGridLines />
<HorizontalGridLines />
{series.map((entry, idx) => {
const id = `${entry.title}`
return (
<LineSeries
key={id}
strokeWidth={1}
data={entry.data}
onNearestX={(d) => setTooltip([ d ])}
/>
)
})}
<Crosshair values={tooltip} />
<XAxis
tickFormat={(d) => d.toLocaleDateString('default', { month: 'short' })}
tickValues={selectedDates}
/>
<YAxis />
</XYPlot>
)