2

seriesオプションへのデータ入力をフォーマットするために、私はHighChartsとかなりの時間戦っていました。最後に、ここのリンクがデータのフォーマットと入力の問題を解決するのを見ました。

HighCharts円グラフで認識されるデータ形式は(format 1)、上記のリンクに示されているように次のようになります。

[["chrome",15],["firefox",20]]

私は実際に外部URLからの動的データ入力が必要であり、HighChartsが認識できるようにデータをフォーマットします。URLから取得したデータ形式は次の(format 2)とおりです。

[
    {
        "status": "Stopped \/ Idle",
        "val": 17.469444444444,
    }, {
        "status": "Working",
        "val": 0,
    }, {
        "status": "Headland Turning",
        "val": 0,
    }, {
        "status": "Transport",
        "val": 0.15333333333333,
    }
]

これはすでにJSON形式です。

format 2からへのデータのパーサーを作成するために必要なことを知りたいだけですformat 1。または、HighChartsがJSON形式のデータを認識でき、実際にパーサーを作成する必要がないものが不足していますか？

私はHighChartsを初めて使用するので、問題の説明の一部が意味をなさない場合は、遠慮なく指摘してください。ありがとうございます。

編集：私の質問に答えてくれたすべての人に感謝します！

4

5 に答える 5

6

スクリプトが特定の形式のデータを予期している場合、多くの場合、データを適切な形式にマップする必要があります。これは、サーバーコードまたはjavascriptを使用して変更できます

jQuery$.mapを使用して、オブジェクトまたは配列を別の配列に再構成できます。

デモ：http：//jsfiddle.net/qpsSe/1

サンプルJSONの末尾のコンマは、JSONを検証するために削除する必要があることに注意してください

/* "json" is your response object, modify variable names to match */
var chartData=$.map( json, function( obj,i){
        return [[ obj.status, obj.val]];                            
})

$.mapAPIドキュメント

ネイティブJavaScriptの代替メソッド

var chartData=[];
for( i=0; i<json.length; i++){
   chartData.push( [ json[i]['status'], json[i]['val'] ])
}
于 2012-06-28T20:53:05.663 に答える
1

HighCharts の前処理で説明されているように、オプションを割り当てるときにパーサーを作成する必要があります 。基本的には、データを解析してオプションに含めます。

var serie1 = json.map( function(e) {
    return [e.status, e.val];
});
options.series.push({data: serie1});

$.map と Fiddle のオプションを使用した実際の例を次に示します。

于 2012-06-28T21:25:01.350 に答える
1

私の知る限り、それがハイチャートがそのデータを望んでいる方法です。そうは言っても、パーサーは非常に簡単です。

var data;  // this is your received data
var highchartsData = []; // this is data for highcharts

$.each(data, function(i, e) {
    highchartsData.push([e.status, e.val]);
});

注意すべきことの 1 つは、受信しているデータがテキスト (たとえば、AJAX 呼び出しからの応答) の場合、次のように JavaScript オブジェクトに変換する必要があることです。

var data = $.parseJSON(textData);
于 2012-06-28T20:36:23.913 に答える
0

グラフを JSON データに直接バインドできます。json プロパティ名をハイチャート標準として設定するだけです。値は「Y」、ラベルは「名前」。

JSON は次のようになります。

[
    {
        name: "Stopped \/ Idle",
        y: 17.469444444444
    }, {
        name: "Working",
        y: 0
    }, {
        name: "Headland Turning",
        y: 0
    }, {
        name: "Transport",
        y: 0.15333333333333
    }
]
于 2014-01-20T09:32:28.783 に答える