I want when I clicked on particular part of line so I'll get the data of particular line.
example I have list of dat ['JAN', 'FEB', 'MAR'],
so I want to get the data of FEB when I clicked on Feb line point
here is my code
<VictoryChart
domainPadding={22}
padding={{top: 10, bottom: 120, left: -10, right: 90}}>
<VictoryAxis
tickFormat={['JAN', 'FEB', 'MAR', 'APR', 'MAY', 'JUN']}
style={{
axis: {
stroke: 'none',
},
tickLabels: {textAnchor: 'middle', fontSize: 10},
}}
/>
<Defs>
<LinearGradient
id="gradient"
x1="0%"
y1="0%"
x2="0%"
y2="100%">
<Stop offset="0%" stopColor="#b3ebe45e" />
<Stop offset="100%" stopColor="white" />
</LinearGradient>
</Defs>
<VictoryArea
data={[
{x: 'JAN', y: 500},
{x: 'FEB', y: 150},
{x: 'MAR', y: 612},
{x: 'APR', y: 245},
{x: 'MAY', y: 456},
{x: 'JUN', y: 56},
]}
interpolation={'natural'}
style={{
data: {fill: 'url(#gradient)'},
}}
animate
/>
<VictoryLine
data={[
{x: 'JAN', y: 500},
{x: 'FEB', y: 150},
{x: 'MAR', y: 612},
{x: 'APR', y: 245},
{x: 'MAY', y: 456},
{x: 'JUN', y: 56},
]}
interpolation={'natural'}
style={{
data: {stroke: Color.primary},
}}
animate
/>
</VictoryChart>
I passed event prop but able to get result
VictoryLine uses VictoryClipContainer as its default groupComponent VictoryClipContainer renders a tag with a clipPath def. This allows continuous data components to transition smoothly when new data points enter and exit. Supplying a completely custom group component to VictoryLine may result in broken animations.
default: < VictoryClipContainer />