2016-03-30 49 views
0

私は願われる問題があります。私はここでいくつかのチュートリアルといくつかの質問を読んだが、誰も私の質問に答えていないようです。私はこれを取ることができるようにしたいと上にそれを描画しますChart.jsを使用してチャートにJSONデータをプロットする

{ Email addresses: 4, IP addresses: 2, Names: 1 } 

:私は、例えばJSONレスポンスとバックのようなものを来ている私のPHPファイル(コンソール出力をログに記録)にAJAXリクエストを作ってるんですChart.jsを使用してグラフは、しかし、私が試してみました:

$.each(res, function(i, item) { 
    data = { 
     label: i, 
     value: item 
    } 
} 
var myDoughnutChart = new Chart(ctx).Pie(data); 

問題はそれだけで1つの値を持つ1つの色と1つのラベルで埋めていますです。

{ "Label":"Email addresses","Value":"4" } 

変更はJavascript/jQueryのを使用して行わなければならない:それは読むかもしれないので、私はJSON出力のフォーマットを変更することができますどのような方法があります。私はラベルが常に時々JSON出力のような異なる場合がありますと同じではありません指摘している必要があります

{ Usernames: 3, Passwords: 3, Names: 1 } 

再び上記コンソールに出力するとき、私は取得しています唯一のものです。

JQueryなどで$ .each()を使用してこれをチャート化する方法もありますか?どんな助けでも、この質問の長さには申し訳ありません。

+0

ループの各繰り返しで 'data'を上書きします。代わりに 'data.push({label:i、value:item});'を試してください。そして、 'data'が最初に配列であることを確認してください。 – Daedalus

答えて

2

現在のアイテムと同じにするときは常にdataを上書きし、サイクル後の最後のエレメントと同じになります。要素を追加する必要があるため、チャートに要素が追加されます。

$.each(res, function(i, item) { 
    if (!Array.isArray(data)) { 
     data = []; 
    } 
    data.push({ 
     label: i, 
     value: item 
    }); 
} 
var myDoughnutChart = new Chart(ctx).Pie(data); 
+1

ありがとう、それは私のためにうまくいった。私は助けに感謝します。 – Dave

+1

あなたは歓迎です、歓声 –

0

その非常に簡単

は が最初にそれはラベルと値と色とのすべてのようないくつかのオプションのプロパティを受け入れた。..スクリプトをchart.jsと電子メールアドレスとIPアドレスを持つラベルと値を置き換えるために行きます。 ..

希望するvlヘルプ

関連する問題