探索和尝试C3 / D3。
目标:将来自.JSON文件的外部数据呈现在c3 / d3js条形图中。如何提取x和y数据并将其应用于轴?
当前:我目前有一个JSON数据字符串,就像这样一堆x和y值:
[{
"x: 1540983600, y:16, x: 1541070000 y:25, x: 1541329200 y:20, x: 1541415600 y:21, x: 1541588400 y:10, x: 1541934000 y:15, x: 1542020400 y:9, x: 1541156400 y:4, x: 1541242800 y:7, x: 1541502000 y:6, x: 1541761200 y:1, x: 1541674800 y:6, x: 1541847600 y:1"
}]
当前正在提取数据:
const Url='/linktoJSON/data.json';
$.ajax({
url: Url,
type: "GET",
success: function (result) {
console.log(result)
},
error:function (error) {
console.log('Error ${error}')
}
});
图形渲染:
var chart = c3.generate({
bindto: '#chartBar',
data: {
url: Url,
type: 'bar'
},
axis: {
x: {
type: 'category',
},
y: {
label: {
text: 'Count',
position: 'outer-middle'
},
max: 10,
min: 0,
padding: {
top: 10,
bottom: 0
}
}
},