Question

我正在使用chart.cs来尝试图表。它到目前为止工作正常。现在我想动态地更改数据，但update（）功能不起作用。我错了什么？

    <html>
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.1/Chart.bundle.min.js"></script>
</head>
<body>
<button onclick="changedata()">changedata</button> 
<canvas id="testChart"></canvas>
<script>
var testChart;
var test_labels = ['06:00', '06:10', '06:20', '06:30', '06:40', '06:50', '07:00'];
var test_data = ['1', '2', '3', '4', '3', '2', '1'];

var ctx = document.getElementById("testChart").getContext('2d');
testChart = new Chart(ctx, {
type: 'line',
data: {
    labels: test_labels,
    datasets: [{
        data: test_data,
        borderColor: "#ff0000",
        borderWidth: 1,
    }]
} 
});

function changedata(){
    test_data  = ['4', '3', '2', '1', '2', '3', '4'];
    testChart.update();
}
</script>
</body>
</html>

Answer 1

我认为你在changeata函数中缺少一点，比如

function changedata(){
    testChart.data.datasets[0].data = ['4', '3', '2', '1', '2', '3', '4'];
    testChart.update();
}

Chart.js：图表未更新

1 个答案: