javascript - Chart.js 数据不会更新

Question

我正在尝试使用ajax请求获取数据来更新chart.js。 ajax请求没问题。但响应不会更新图表。 这就是我获取数据的方式:

<script type="text/javascript">
$(document).ready(function(){
    $("#data-row").hide();
    $("#btnCari").click(function(){
        var periode = $("select[name='tahun']").val();
        $.ajax({
            url:"<?php echo site_url('laporan/get_keuntungan/')?>"+periode,
            success:function(data){
                var graph = data;
                    data: {
                        labels: ["Januari", "Februari", "Maret", "April", "Mei", "Juni", "Juli","Agustus",'September','Oktober','November','Desember'],
                        datasets: [
                            {
                                label: "Penjualan",
                                fill: true,
                                lineTension: 0.3,
                                backgroundColor: gradient1,
                                borderColor: gradient1,
                                borderCapStyle: 'butt',
                                borderDash: [],
                                borderDashOffset: 0.0,
                                borderJoinStyle: 'miter',
                                borderWidth: 1,
                                pointBorderColor: gradient1,
                                pointBackgroundColor: "#fff",
                                pointBorderWidth: 1,
                                pointHoverRadius: 5,
                                pointHoverBackgroundColor: gradient1,
                                pointHoverBorderColor: "rgba(220,220,220,1)",
                                pointHoverBorderWidth: 2,
                                pointRadius: 1,
                                pointHitRadius: 10,
                                data: [graph],
                                spanGaps: false
                            }
                        ]
                    }
                });
            $("#data-row").fadeOut("slow");
            $("#data-row").fadeIn("slow");

            }
        })
    });
    })

ajax 响应如下所示:

'10,20,30,40,50,10,20,30,30'

但它不会更新图表。

Answer 1

您可能忘记了两件事。

首先:您需要选择图表，如下所示:
var ctx = document.getElementById("myChart").getContext('2d');

使用:

var myChart = new Chart(ctx, {
type: 'bar',
data: {//your code to build chart}

第二:myChart.update();

chartjs.org/docs/latest/
chartjs.org/docs/latest/developers/updates.html