Question

我想用c3图加载日期时间范围的动态数据这是我的代码：

$.ajax({
    [...]
    success: function(data) {
        chart.load({
            columns: data,
            unload: chart.columns,
        });
    }
});

Ajax响应是：

[['Friday', 1],['Friday', 3],['Sunday', 1],['Saturday', 2],['Friday', 3],['Friday', 3],['Friday', 5],['Friday', 3],['Monday', 1],['Friday', 1],['Tuesday', 1]]

成功时我的图表上没有看到任何内容。甚至我评论过“卸载” 但仍然相同。如果我静态放置，该功能可以正常工作。请帮帮我

Answer 1

你错了。它不是导出chart函数，而是导出c3函数。以下将生成一个图表（看起来不太好，但我不知道你期望的是什么）。

您也错过了定义输出div，因此我添加了#chart。

var data = [['Friday', 1],['Friday', 3],['Sunday', 1],['Saturday', 2],['Friday', 3],['Friday', 3],['Friday', 5],['Friday', 3],['Monday', 1],['Friday', 1],['Tuesday', 1]];

var data2 = [['Friday', 3],['Friday', 10],['Sunday', 50],['Saturday', 20],['Friday', 15],['Friday', 10],['Friday', 6],['Friday', 8],['Monday', 5],['Friday', 20],['Tuesday', 13]];

var chart = c3.generate({
    bindto: '#chart',
    data: {
      columns: data
    }
});

setTimeout(function() {
    chart.load({
        columns: data2 
    });
}, 2000)

<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.17/d3.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/c3/0.4.11/c3.js"></script>

<div id="chart"></div>

Answer 2

您是否在列周围尝试括号：chart.load函数参数中的数据？这是一段在我的应用程序中运行的代码

$(document).on("click", "#btnPDquant", function(event) {
$.ajax({ 
url: "PDQuantCalc",
type: "post",
data: $('#formPDquant').serialize(), 
success: function(response){
    var newdat = JSON.parse(response);
    chart.x(newdat.year);
        chart.load({
            columns: [ newdat.PDquant ]
    });
}
event.preventDefault(); // Important! Prevents submitting the form.
});

无法使用ajax加载c3图形数据

2 个答案: