1

我有一个有两条线的折线图。

对于其中一条线,我想使用自定义 svg 在图表中表示它。见截图。

我怎样才能做到这一点?

在此处输入图像描述

这是我的代码:

<LineChart
   // width={800}
   onClick={() => {}}
   height={300}
   data={this.state.data}
   // margin={{ top: 5, right: 30, left: 20, bottom: 5 }}
 >
   <XAxis dataKey="to_char" />
   <YAxis
      tickFormatter={value => {
      let val = value / 1000000;
           return `$${new Intl.NumberFormat("en").format(val)}m`;
       }}
    />
    <CartesianGrid strokeDasharray="3" vertical={false} />
    <Tooltip />
    <Legend />
    <Line
      dot={false}
      type="monotone"
      dataKey="predictedprice"
      stroke="#1C85E8"
      activeDot={{ r: 8 }}
      name="True Home Estimate™"
      strokeWidth={3}
    />
    <Line
      type="monotone"
      name="Sold Price"
      dataKey="soldprice"
      stroke="#82ca9d"
      shape="star"
     />
</LineChart>
4

1 回答 1

0

您应该能够将 shape 属性添加到 ReferenceDot 或 ReferenceArea - 我不确定是否可以在常规属性上正确使用该形状,但这是我找到的 GitHub 对话链接,其中更多地讨论了这一点:

https://github.com/recharts/recharts/issues/922

于 2019-04-18T14:51:02.693 回答