jquery - jqplot で json データをレンダリングする方法

Question

jqplot ウィジェットを動的 JSON でレンダリングしようとしていますが、その方法が見つかりません。

私が見た唯一の例には、ファイルからの JSON の読み取りが含まれていましたが、たとえば、JSON を文字列として使用したいと考えています。

{"oranges":"10","apples":"20","bananas":"6"}

何か案が？

Answer 1

質問のデータは文字列ではなく、javascript オブジェクト リテラルです。

オレンジ、リンゴ、バナナがあれば、おそらく棒グラフを描きたくなるでしょう。オブジェクトからラベルと値を抽出し、グラフをプロットする必要があります。

var chart_data = {"oranges":"10", "apples":"20", "bananas":"6"};
var line1 = [];
for (var prop_name in chart_data) {
    line1.push([prop_name, chart_data[prop_name]])
}
// line1 should be [["oranges", 10], ["apples", 20], ["bananas", 6]]


// code snippet from http://www.jqplot.com/tests/rotated-tick-labels.php
// please change it as you need
var plot1 = $.jqplot('chart1', [line1], {
    title: 'Fruits',
    series: [{renderer:$.jqplot.BarRenderer}],
    axesDefaults: {
        tickRenderer: $.jqplot.CanvasAxisTickRenderer 
    },
    axes: {
      xaxis: {
        renderer: $.jqplot.CategoryAxisRenderer
      }
    }
});

Answer 2

$.getJSON(url,"json").success(function(data) {
var line1 = [];
var content = $.parseJSON( data);
$.each(content, function(index, item) {
        line1.push([item.date, item.value])
});

var plot1 = $.jqplot("chart1",[line1], { .....

これは、jsonデータをjqplotが使用できる配列に変換する方法の良い例です...