我已经建立了一个xy图,并且试图加载一个新的数据集,但是由于某些原因,该数据从未在图内生成:
<div id="graph"></div>
<script>
var chart = c3.generate({
bindto: '#graph',
data: {
xs: {
'data1': 'x1',
'data2': 'x2',
},
columns: [
['x1', 10, 30, 45, 50, 70, 100],
['x2', 30, 50, 75, 100, 120],
['data1', 30, 200, 100, 400, 150, 250],
['data2', 20, 180, 240, 100, 190]
]
}
});
setTimeout(function () {
chart.load({
bindto: '#graph',
data: {
xs: {
'data3': 'x3',
},
columns: [
['x3', 20, 40, 55, 60, 80, 110],
['data3', 30, 150, 260, 120, 90]
]
}
});
}, 2000);
</script>
有人知道为什么会这样吗?我知道chart.unload可以正常工作,并且我尝试过添加和删除bindto:“ graph”,但没有任何效果
最佳答案
根据the docs,load
函数不需要data参数,因此它应如下所示:
chart.load({
bindto: '#graph',
xs: {
'data3': 'x3',
},
columns: [
['x3', 20, 40, 55, 60, 80, 110],
['data3', 30, 150, 260, 120, 90]
]
});
演示片段:
var chart = c3.generate({
bindto: '#graph',
data: {
xs: {
'data1': 'x1',
'data2': 'x2',
},
columns: [
['x1', 10, 30, 45, 50, 70, 100],
['x2', 30, 50, 75, 100, 120],
['data1', 30, 200, 100, 400, 150, 250],
['data2', 20, 180, 240, 100, 190]
]
}
});
setTimeout(function () {
chart.load({
bindto: '#graph',
xs: {
'data3': 'x3',
},
columns: [
['x3', 20, 40, 55, 60, 80, 110],
['data3', 30, 150, 260, 120, 90]
]
});
}, 2000);
<link href="https://cdnjs.cloudflare.com/ajax/libs/c3/0.4.8/c3.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.4.11/d3.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/c3/0.4.8/c3.js"></script>
<div id="graph"></div>
关于javascript - C3.js chart.load不为x/y轴图加载,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/27726056/