2017-11-17 31 views
1

例のページhttp://c3js.org/samples/simple_multiple.htmlでは、複数行のチャートを列や行として簡単に作成できます。c3でxy折れ線グラフを作成するにはどうすればよいですか?

[ 
    {x:1, y:2}, 
    {x:2, y:3} 
    ... 
] 

私はNVD3でこれを行うことができます。

けれども、私はこのように、私はx-y座標の配列から、折れ線グラフを構築したい単純なケースカバーを見つけることができません。

ポイントごとにxy座標の折れ線グラフを作成することはできますか?

答えて

0

はい、ちょうどhttp://c3js.org/samples/data_json.htmlの例に若干の微調整は、実際には、これを示して「X」の値でこれらの変数のC3を(我々はそれがXの知っているが、ちょうどC3に伝える必要があります)

を伝える必要があります:上記の

var chart = c3.generate({ 
    data: { 
     json: [ 
      {name: 'www.site1.com', upload: 200, download: 200, total: 400, x: 2}, 
      {name: 'www.site2.com', upload: 100, download: 300, total: 400, x: 3}, 
      {name: 'www.site3.com', upload: 300, download: 200, total: 500, x: 4}, 
      {name: 'www.site4.com', upload: 400, download: 100, total: 500, x: 5}, 
     ], 
     keys: { 
      x: 'x', 
      value: ['upload', 'download'], 
     } 
    }, 
}); 

JSFiddleバージョン:http://jsfiddle.net/dj27wwef/

関連する問題