javascript - Flot 折线图和一个未按照 Flot API 规范格式化的大型 JSON 数据 block

Question

我正在使用 Flot 绘制折线图，​​我的数据集是一个相当大的 JSON blob 数组，看起来像(为简洁起见被 chop ):

    [{"load_data": 5047, "url": "http://this.com", "timestamp": "2010-12-03 17:06:45", "formatted_timestamp": 1291396005000, "load_time": 4359}, 
{"load_data": 8658, "url": "https://that.com", "timestamp": "2010-12-03 17:06:24", "formatted_timestamp": 1291395984000, "load_time": 7516}, 
{"load_data": 7372, "url": "https://theother.com, "timestamp": "2010-12-03 17:06:22", "formatted_timestamp": 1291395982000, "load_time": 7372}]

因此，根据他们在 API 文档中的示例，Flot 喜欢他们的 JSON 格式如下:

  {
    label: "y = 3",
    data: [[0, 3], [10, 3]]
  }

他们希望将数据放入元组中以根据 x、y 轴绘制，这是可以理解的。

我的问题是如何解析上述 JSON blob 以获得“formatted_timestamp”来表示 x 轴，然后“load_data”来表示 y 轴？意思是创建一个类似于FLOT json结构的系列，并将系列值放入图中？

Answer 1

当给定一个如您描述的数组时，此函数可以解决问题:

function format(source) {
    var i, l,
        dest = [],
        row;

    for(i = 0, l = source.length; i < l; i++) { 
        row = source[i];
        dest.push([row.formatted_timestamp, row.load_data]);
    }
    return dest;
}