D3-动态更新折线图

时间:2017-06-23 21:06:02

标签: javascript angularjs d3.js

我是d3的新手,正在根据间隔动态更新折线图,我希望旧数据移出/退出并使用新数据更新,我被困在一个可以看到新数据加入的位置图表但旧数据没有移出/退出。有人可以帮我解决这个问题,非常感谢任何帮助。

d3noob'slink复制,注入数据的变化很小

Plunker link

此外,我正在尝试为每个点添加圆圈,目前由于某种原因,单个圆圈被添加到Y轴的顶部。

1 个答案:

答案 0 :(得分:1)

在检查d3noob's link时,我意识到他将2个数据集用作data.csvdata-alt.csv。在updateData函数的第二次运行期间,它总是获得data-alt.csv

所以,为了回答你的问题,

  1. 首先,您需要使数据生成逻辑正确。由于您要生成随机数,因此需要确保randomPoints()函数生成D3可理解的正确日期

  2. 然后将随机生成的数据集绑定到data变量。

  3. 最后,在data函数的每次运行中清除updateData变量。

  4. 我为你做了Plunker。如果您需要更多解释,请告诉我。

    希望这会有所帮助:)