我想按时间间隔顺序更新jqPlot绘制的图表.
- 1st AJAX call: 20
- 2nd AJAX call: 30
- 3rd AJAX call: 40
- 4th AJAX call: 32
所以我想把图形绘制成:
- First: only 20
- Second: 20,30
- Third: 20,30,40
- Fourth: 20,40,32
我们可以在JQPlot中提取已绘制的数据,然后附加这个新数据集并重绘图形吗?
任何人都可以帮忙吗?
解决方法
您需要将数据存储在一个数组中,然后在每个ajax调用中将新数据推送到该数组.
这是一个简单的演示,使用按钮以3秒的间隔启动AJAX更新:
- /* store empty array or array of original data to plot on page load */
- var storedData = [3,7];
- /* initialize plot*/
- var plot1;
- renderGraph();
- $('button').click( function(){
- doUpdate();
- $(this).hide();
- });
- function renderGraph() {
- if (plot1) {
- plot1.destroy();
- }
- plot1 = $.jqplot('chart1',[storedData]);
- }
- /* sample data for demo*/
- var newData = [9,1,4,6,8,2,5];
- function doUpdate() {
- if (newData.length) {
- /* used to pull new number from sample data for demo*/
- var val = newData.shift();
- $.post('/echo/html/',{
- html: val
- },function(response) {
- var newVal = new Number(response); /* update storedData array*/
- storedData.push(newVal);
- renderGraph();
- setTimeout(doUpdate,3000)
- })
- } else {
- alert("All Done")
- }
- }