Recharts:如何格式化垂直实线(将鼠标悬停在数据点上时)?
Recharts: How to format the solid vertical line (when hovering over a data point)?
Recharts 文档描述了如何在悬停期间格式化数据点的样式以及工具提示。
然而,在悬停期间,文档中似乎没有描述出现的垂直实线(除非我遗漏了它)。
是否有允许格式化该行的道具?
(如果你不知道我在说什么,在我的示例图片中就是 "Nov-14" 上方的垂直实线)
这是我的折线图和结果:
<ResponsiveContainer>
<LineChart data={this.props.data} margin={{ top: 5, right: 30, left: 20, bottom: 5 }}>
<CartesianGrid strokeDasharray="3 3" />
<XAxis dataKey="date" tickFormatter={xFormatter}/>
<YAxis dataKey="value" tickFormatter={yFormatter}/>
<Tooltip />
<Line type="monotone" dataKey="value" stroke="#4F80E4" strokeWidth={2}/>
</LineChart>
</ResponsiveContainer>
您需要编辑光标:)
<Tooltip cursor={false}/>
// 题外话:既然你用的是recharts,能不能也看看我的问题Is there a way to set Background Color of XAxis
Recharts 文档描述了如何在悬停期间格式化数据点的样式以及工具提示。
然而,在悬停期间,文档中似乎没有描述出现的垂直实线(除非我遗漏了它)。
是否有允许格式化该行的道具?
(如果你不知道我在说什么,在我的示例图片中就是 "Nov-14" 上方的垂直实线)
这是我的折线图和结果:
<ResponsiveContainer>
<LineChart data={this.props.data} margin={{ top: 5, right: 30, left: 20, bottom: 5 }}>
<CartesianGrid strokeDasharray="3 3" />
<XAxis dataKey="date" tickFormatter={xFormatter}/>
<YAxis dataKey="value" tickFormatter={yFormatter}/>
<Tooltip />
<Line type="monotone" dataKey="value" stroke="#4F80E4" strokeWidth={2}/>
</LineChart>
</ResponsiveContainer>
您需要编辑光标:)
<Tooltip cursor={false}/>
// 题外话:既然你用的是recharts,能不能也看看我的问题Is there a way to set Background Color of XAxis