如何解决React Recharts - 如何为折线图添加过滤器?
在 nextjs 应用程序中,我尝试添加 recharts
https://recharts.org/en-US/examples/SimpleLineChart。现在我想为 1 天、1 周、1 个月等图表添加过滤器选项。如何自定义图表?或者我可以使用不同的插件来支持我的要求吗?请建议我。另外,如何将时间和日期 02:30pm 10 01,2021
添加到数据中?当鼠标悬停在图形上时应该显示(边缘)。
现在我已经尝试过使用静态数据的示例图,例如
const data = [
{
name: 'Page A',uv: 4000,pv: 2400,amt: 2400,},{
name: 'Page B',uv: 3000,pv: 1398,amt: 2210,{
name: 'Page C',uv: 2000,pv: 9800,amt: 2290,]
return(
<LineChart
width={900}
height={250}
data={data}
margin={{
top: 35,right: 30,left: 20,bottom: 5,}}
>
<Tooltip />
<Legend />
<Line type="monotone" dataKey="uv" stroke="#4ec6f4" activeDot={{ r: 8 }} />
</LineChart>
)
解决方法
关于工具提示的问题,
${n} months
}/>
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。