如何解决如何让 rechart 的 lineChart DOT 像滑块的拇指一样移动?
目前,折线图的标签和点连接到 rc-slider,随着滑块的拇指移动标签和点移动并相应地显示相应的数据。
我还希望线条的 DOT 像滑块的拇指一样工作(DOT 应该可以在线拖动)
图表和滑块的数据长度相同
在 CustomizedLabel 和 CustomizedDot 函数中,如果图表的数据索引 === 滑块的数据索引,我只是渲染它们
折线图代码
<LineChart data={sliderChartData}>
<XAxis tick={false} dataKey="name" />
<YAxis tick={false} />
<ReferenceLine
y={0}
strokeWidth={2}
stroke={dashedLineColor}
strokeDasharray="3 3"
/>
<Line
type="monotone"
activeDot={false}
dot={<CustomizedDot />}
dataKey="tranchA"
stroke={lightBlueColor}
strokeWidth={4}
>
<LabelList
dataKey="tranchA"
content={renderCustomizedLabelTrancheA}
/>
</Line>
<Line
type="monotone"
activeDot={false}
dot={<CustomizedDot />}
dataKey="tranchB"
stroke={lightBlueColor}
strokeWidth={4}
>
<LabelList
dataKey="tranchB"
content={renderCustomizedLabelTrancheB}
/>
</Line>
</LineChart>
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。