使用ajax从数据库收到新数据后更新chart.js不起作用

Question

这是我在脚本中初始化图表的脚本JavaScript$(document).ready( () => {    setInterval( () => {    var sensorUpdatedData = new XMLHttpRequest();    sensorUpdatedData.onreadystatechange = () => {      if(sensorUpdatedData.readyState === 4) {        if(sensorUpdatedData.status === 200) {          console.log("ready");                     var Data = JSON.parse(sensorUpdatedData.responseText);          console.log(Data);          valueTemp = Data.temperature;          valueHum = Data.humidity;          valueSmoke = Data.smoke;          reading_time = Data.reading_time;          reading_time_hour = Data.reading_time_hour;          myChartTemp.update();          myChartHum.update();          myChartSmoke.update();          myChartData.update();        } else {          alert('Error Code: ' +  sensorUpdatedData.status);          alert('Error Message: ' + sensorUpdatedData.statusText);        }      }    }      sensorUpdatedData.open('POST', 'data.php', true);      sensorUpdatedData.send();    }, 5000);  });所有值都正确更新（我用一些 console.log 进行了测试）这就是我创建其中一张图表的方式：var ctxTempChart = document.getElementById("chartLineTemp").getContext("2d");    var gradientStrokeTempChart = ctxTempChart.createLinearGradient(0, 230, 0, 50);    gradientStrokeTempChart.addColorStop(1, 'rgba(29,140,248,0.2)');    gradientStrokeTempChart.addColorStop(0.4, 'rgba(29,140,248,0.0)');    gradientStrokeTempChart.addColorStop(0, 'rgba(29,140,248,0)'); //blue colors    var dataTemp = {      labels: reading_time_hour,      datasets: [{        label: "Temperature",        fill: true,        backgroundColor: gradientStrokeTempChart,  });超文本标记语言 <canvas id="chartLineTemp"></canvas>一切似乎都工作正常，但我不知道如何显示更新的数据。vavalueTemp、valueHum...在脚本开头全局声明

Answer 1

问题是我正在传递一个对象，而它需要一个数组。Myvar Data是包含多个 JSON 对象的单个 JSON 对象。在我应用之后valueTemp = JSON.parse(Data.temperature);，它返回一个温度值数组，这正是我所需要的。

Answer 2

您是否尝试过以 DOM 对象的形式访问更新函数？

window.myChartTemp.update();或者 document.myChartTemp.update();