Question

JS中如何动态添加数据并绘制在html上

html中定义了一个data.length=50的数组，初始值都为0
js中写了个随机数填充了data中的数据。
这些数据会在html上绘制成一个折线图。

现在想继续生成一个第51号数据，然后绘制到html中，各位有什么好的办法吗？

Answer 1

你如果将前50个数据都绘制出来了，再添加一个有什么问题吗？再者，你用什么绘制的折线图呢？

追问

再添加的更新之前的，比如，之前是1-50显示出来，现在显示2-51，我需要动态的呈现这一效果，计划没3s生成一个随机数，然后添加进去，这样每次都只显示50个，呈现一种动态效果。我用的是canvas。

追答

我没试过这种。不知这样行不行，配合定时器，每3秒对data数组进行操作，移除第一个元素然后添加一个新元素在尾部得到一个新数组，然后根据新数组在重新绘制canvas。

-----------------------------------------
百度前端提供echarts工具，在报表方面不错，折线图，圆饼图等等。里面有带变动时间轴的一类，你看看能否有用。网址“http://echarts.baidu.com/doc/example.html”

追问

麻烦给个code吧