Does the C3 bar chart support JSON data? I am trying to get a simple example working but could not find any documentation or examples on how to achieve something like this:
var chart = c3.generate({
data: {
type: 'bar',
json: [
{ 'indicator': 'X', 'total': 100 },
{ 'indicator': 'Y', 'total': 200 },
{ 'indicator': 'Z', 'total': 300 }
],
keys: {
x: 'indicator',
value: ['total']
}
},
bar: {
width: {
ratio: 0.5
}
}
});
C3 support the json data.
Example on json :- https://github.com/masayuki0812/c3/blob/master/htdocs/samples/data_json.html
And here: http://c3js.org/samples/data_json.html
Thanks for the links. I saw those examples before. I actually have line charts working with JSON.
However I could not get it to work with bar charts, even a simple example.
Here's a fiddle: http://jsfiddle.net/z2erLqgx/1/
It seems that you are missing 'axis' section. Try this:
var chart = c3.generate({
data: {
type: 'bar',
json: [
{ 'indicator': 'X', 'total': 100 },
{ 'indicator': 'Y', 'total': 200 },
{ 'indicator': 'Z', 'total': 300 }
],
keys: {
x: 'indicator',
value: ['total']
}
},
axis: {
x: {
type: 'category'
}
},
bar: {
width: {
ratio: 0.5
}
}
});
Thanks for the pointer! That was the problem.
Here's a working fiddle if anyone else runs into this:
http://jsfiddle.net/z2erLqgx/2/
Most helpful comment
It seems that you are missing 'axis' section. Try this: