Pie chart from json using c3 js

The code is used as an example.

I need to create a pie chart having 4 divisions (site1, site2 ...), each division corresponds to its corresponding load value.

In the above code, I cannot achieve this (I specified the value: ['upload']) ...

What exact value should I indicate?

Thanks..

chart = c3.generate({ data: { json: [ {name: 'www.site1.com', upload: 200}, {name: 'www.site2.com', upload: 100}, {name: 'www.site3.com', upload: 300}, {name: 'www.site4.com', upload: 400}, ], keys: { // x: 'name', // it possible to specify 'x' when category axis value: ['upload'], }, type:'pie' }, axis: { x: { // type: 'category' } } }); 
+7
c3
source share
1 answer

A pie chart maps each property to a pie sector. You can reformat your JSON, for example

 var jsonData = [ {name: 'www.site1.com', upload: 200}, {name: 'www.site2.com', upload: 100}, {name: 'www.site3.com', upload: 300}, {name: 'www.site4.com', upload: 400} ] var data = {}; var sites = []; jsonData.forEach(function(e) { sites.push(e.name); data[e.name] = e.upload; }) chart = c3.generate({ data: { json: [ data ], keys: { value: sites, }, type:'pie' }, }); 

Working fiddle - http://jsfiddle.net/2nf9a7x4/

+11
source share

All Articles