javascript - How to animate diagrams with jQuery and jQplot (updating data)

Question

I am "animating" diagrams over time by changing the data and redrawing them.

// initialization
var data = ...
var targetPlot = $.jqplot('#diagram', data, diagramOptions);

Now after some time I will change the data in some way and want to update the diagram. The following solution works:

// update Data
targetPlot.data = ...;
// remove old diagram
$('#<%= "diagram" + diagram.id.to_s %>container').empty();
// redraw
targetPlot = $.jqplot('#diagram', data, diagramOptions);

Bit this is a complete redraw. With lots of data and a short intervall jQPlot takes much memory and the diagram is flickering.

How to do this correct?

The solution using the redraw-function for me only draws the old diagram:

// update Data
targetPlot.data = ...;
targetPlot.redraw();

Answer 1

这是我经过大量调查后发现的方式。我写下来是为了帮​​助阅读这个问题的人。

更新数据的正确位置是在 series 属性中，更新数据后您可以重新绘制绘图：

targetPlot.series[0].data = myData;
targetPlot.redraw();

如果您的轴发生了变化，那么您可以使用replot()而不是重新缩放它们redraw()：

targetPlot.replot({resetAxes:true});

这比每次都重新绘制一个新图要快得多。