Question

所以我想在自己的div中绘制多个flot图表。数据在json中，我已经解析为单个jsons。然后我想为每个单独的json做一个div并绘制单个json。

然而，这似乎不起作用！我得到（在这个例子中）3个div和绘图区域显示，但没有数据 - 我测试了一个json（没有循环），它就像一个魅力。

我错过了什么？

Answer 1

您可以使用jQuery（https://api.jquery.com/jquery.parsejson/）中的parseJson函数。这样您就不必进行字符串操作。

而不是：

var shorted_json = json.substring(2,json.length-2);     // Cut away leading and trailing characters from outer json-array
var replaced_json = shorted_json.replace(/},{/g,'o');   // Replace json-object seperator },{ with an 'o'
var splitted_json = replaced_json.split('o');           // Split the json-string for every occurence of the character o;
$.each( splitted_json, function( index, value ){
    var single_json = "{"+value+"}";
    var element = "<div id='placeholder_"+index+"'></div><br>";
    $(document.body).append(element);
    $('#placeholder_'+index).css('height', 500);
    $('#placeholder_'+index).css('width', '100%');
    var options = { ... };

    $.plot('#placeholder_'+index,[single_json],options);

});

这样做：

$.each( $.parseJSON(json), function( index, value ){
    var element = "<div id='placeholder_"+index+"'></div><br>";
    $(document.body).append(element);
    $('#placeholder_'+index).css('height', 500);
    $('#placeholder_'+index).css('width', '100%');
    var options = { ... };

    $.plot('#placeholder_'+index, [value['data']],options);

});

请参阅此工作示例：http://jsfiddle.net/L8fb72h5/

填充每个循环时，绘图图表为空

1 个答案: