Question

我使用Flot在页面上显示时间序列数据的图表。该图表适用于单个数据集，但我想添加按标签分组的多个数据集的功能。

我将JSON输出格式化为他们正常工作所需的内容，我在绘制之前组合多个数据集时遇到问题。

我想将数据集放入seriesArray数组中，但是当我绘制图形时，下面的代码没有填充数组。

函数末尾的tagsList数组中有数据，所以我设置了seriesArray以相同的方式填充无效。

我错过了什么？

var plotarea = $("#placeholder");
var data;   
var plot;
var tagsList=[];
var seriesArray = [];
$.getJSON("/items/getTags.json", function(tagsJSON) {
  $.each(tagsJSON, function(key, val) {
    tagsList.push(val.name);
    $.getJSON("/data/"+val.name+".json", function(json) {
      data = [{label:val.name, data:format(json)}];
      seriesArray.push(data);
    });  
  });
  plot = $.plot(plotarea , seriesArray, {series:{ lines: {show: true},points: {show:true}},
      xaxis: {
          mode: "time",
          timeformat: "%m/%d/%y",
          tickDecimals: 0,
          minTickSize: [2,"day"]
      },
      yaxis: {
          minTickSize: 1,
          tickDecimals: 0
      }
  });
});

Answer 1

您需要等到所有对/data/tag.json的AJAX调用都完成。您可以使用$.when().then()来执行此操作。

var plotarea = $("#placeholder");
var data;
var plot;
var tagsList=[];
var seriesArray = [];
$.getJSON("/items/getTags.json", function(tagsJSON) {
    var deferreds = [];
    $.each(tagsJSON, function(key, val) {
        tagsList.push(val.name);
        deferreds.push($.getJSON("/data/"+val.name+".json", function(json) {
            data = [{label:val.name, data:format(json)}];
            seriesArray.push(data);
        }));
    });
    $.when(deferreds).then(function(){
        plot = $.plot(plotarea , seriesArray, {series:{ lines: {show: true},points: {show:true}},
            xaxis: {
                mode: "time",
                timeformat: "%m/%d/%y",
                tickDecimals: 0,
                minTickSize: [2,"day"]
            },
            yaxis: {
                minTickSize: 1,
                tickDecimals: 0
            }
        });
    });
});

Javascript数组没有正确填充

1 个答案: