Javascript Flot折线图和未格式化为Flot API规范的大型JSON数据blob

我使用Flot绘制一个折线图，我的数据集是一个相当大的JSON blob数组，看起来像（为了简洁起见被截断）：

根据API文档中的示例，Flot喜欢JSON格式，如：

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

他们希望将数据转换成元组，以绘制x，y轴，这是可以理解的

---

我的问题是如何解析前面提到的JSON blob，以获得“格式化的时间戳”来表示x轴，然后“加载数据”来表示y轴？这意味着创建一个类似于FLOT json结构的序列，并将一系列值放入图形中？

当给定一个如您所述的数组时，此函数将起到作用：

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;
}

函数格式（源代码）{
变量i，l，
dest=[]，
一行
对于（i=0，l=source.length；i

不确定我是否正确回答了问题，但这就是我创建flot x-y图的方法：

数据：[[1,0]，[2,0]…]->1和2是x轴的值

<script language="javascript" type="text/javascript">
$(function () {
var data = [{label:'my funky label',data:[[1, 0],[2, 0],[3, 0],[4, 0],[5, 18.125],[6, 20.625],[7, 15.4375],[8, 18.5625],[9, 22.375],[10, 13.5625],[11, 20.1875],[12, 5.5]]}];
var options = {
    legend: {
        show: true,
        margin: 10,
        backgroundOpacity: 0.5
    },
    points: {
        show: true,
        radius: 4
    },
    lines: {
        show: true
    },
   grid: { hoverable: true, clickable: true , color: "#999"} 
};

var plotarea = $("#plotarea");
plotarea.css("height", "450px");
plotarea.css("width", "600px");
$.plot( plotarea , data, options );
});
</script>

$（函数（）{
var数据=[{label:'my funky label'，数据：[[1,0]，[2,0]，[3,0]，[4,0]，[5,18.125]，[6,20.625]，[7,15.4375]，[8,18.5625]，[9,22.375]，[10,13.5625]，[11,20.1875]，[12,5.5]；
变量选项={
图例：{
秀：没错，
差额：10，
背景不透明度：0.5
},
要点：{
秀：没错，
半径：4
},
线路：{
秀：真的
},
网格：{可悬停：真，可点击：真，颜色：#999“}
};
变量plotarea=$（“#plotarea”）；
plotarea.css（“高度”，“450px”）；
plotarea.css（“宽度”，“600px”）；
$.plot（绘图区域、数据、选项）；
});

这是有道理的，但我发现为了在Flot中显示，系列中必须包含一个标签。既然JSON中没有“标签：”我能用“URL”之类的东西来代替它吗？我提供的函数只是将数据重新格式化为flot想要的形状。在设置flot的数据时，可以调用此函数，即

var data=[{label:'whatever'，data:format（sourceData）}]
<script language="javascript" type="text/javascript">
$(function () {
var data = [{label:'my funky label',data:[[1, 0],[2, 0],[3, 0],[4, 0],[5, 18.125],[6, 20.625],[7, 15.4375],[8, 18.5625],[9, 22.375],[10, 13.5625],[11, 20.1875],[12, 5.5]]}];
var options = {
    legend: {
        show: true,
        margin: 10,
        backgroundOpacity: 0.5
    },
    points: {
        show: true,
        radius: 4
    },
    lines: {
        show: true
    },
   grid: { hoverable: true, clickable: true , color: "#999"} 
};

var plotarea = $("#plotarea");
plotarea.css("height", "450px");
plotarea.css("width", "600px");
$.plot( plotarea , data, options );
});
</script>