我要感谢您创建了这个伟大的开源库。
我想使用外部 JSON 文件创建动态图表,其中图表每次解析 json 数据。
我当前的代码:
var chart = c3.generate({
bindto: '#chart',
size: {
height: 240,
width: 480
},
data: {
url: 'static/data/trainp.json',
mimeType: 'json',
keys: {
x: 'Series',
value: ['Setting1']
},
type: 'line'
},
subchart: {
show: true
}
});
所需图表示例: https :
请让我知道我必须在https://jsfiddle.net/cy2owjva/ 中进行哪些更改。
谢谢你
@AskSaikatSinha试试这个
`
$(函数(){
$.getJSON('./linejson.json', function (externaldata) {
var chart = c3.generate({
title: {
text:'External JSON loading via C3.js'
},
bindto: '#chart',
data: {
json: externaldata,
type: 'area-spline',
}
})
setInterval(function(){
chart.flow({
columns:
[
['data1',Math.round(Math.random()*200)]
],
type:'area-spline'
})
}, 1500)
});
})
`
并拥有像这样的外部 JSON 文件
linejson.json 文件
{
"data1": [30, 20, 50, 40, 60, 50]
}
我遇到了同样的问题。 尝试使用实时数据流为图表制作动画。
试过这个:
var xhr = new XMLHttpRequest();
function reload(){
//each call on this url changes the json
xhr.open('GET', "http://127.0.0.1:5000/json/", true).send();
chart.flow('http://127.0.0.1:5000/json/');
chart.flush()
}
setInterval(reload, 500);
尝试了流程、生成、加载,而这些都无需重新加载浏览器即可重新加载图表。
有小费吗?
@HawiCaesar谢谢,您的代码有效。
最有用的评论
@AskSaikatSinha试试这个
`
$(函数(){
});
})
`
并拥有像这样的外部 JSON 文件
linejson.json 文件
{ "data1": [30, 20, 50, 40, 60, 50] }