Javascript 为什么Java脚本自更新图不更新绘图?
我已经编写了一段代码,使用JavaScript和Ajax绘制一个自我更新的绘图,我将遵循这个示例()并尝试在我的项目中实现。 我使用的代码是:Javascript 为什么Java脚本自更新图不更新绘图?,javascript,django,ajax,fusioncharts,Javascript,Django,Ajax,Fusioncharts,我已经编写了一段代码,使用JavaScript和Ajax绘制一个自我更新的绘图,我将遵循这个示例()并尝试在我的项目中实现。 我使用的代码是: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <link rel="stylesheet" href="
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<link
rel="stylesheet"
href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"
/>
<link
rel="stylesheet"
href="https://epochjs.github.io/epoch/css/epoch.css"
/>
<link
rel="stylesheet"
href="https://epochjs.github.io/epoch/css/epoch.css"
/>
</head>
<body>
<div class="container">
<div id="chart-container"></div>
</div>
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<!-- Latest compiled and minified CSS -->
<!-- Latest compiled and minified JavaScript -->
<script src="https://cdn.fusioncharts.com/fusioncharts/3.15.2/fusioncharts.js"></script>
<script src="https://cdn.fusioncharts.com/fusioncharts/3.15.2/themes/fusioncharts.theme.fusion.js"></script>
<script src="https://epochjs.github.io/epoch/js/epoch.js"></script>
<script src="https://canvasjs.com/assets/script/canvasjs.min.js"></script>
<script>
FusionCharts.ready(function() {
new FusionCharts({
type: "angulargauge",
renderAt: "chart-container",
width: "400",
height: "300",
dataFormat: "json",
dataSource: {
chart: {
caption: "Fly Ash Generation Rate",
subCaption: "Belews Creek Power Station<br>In Metric Tonnes",
theme: "fusion",
showValue: "1"
},
colorRange: {
color: [
{
minValue: "0",
maxValue: "0.4",
code: "#62B58F"
},
{
minValue: ".40",
maxValue: ".60",
code: "#FFC533"
},
{
minValue: ".60",
maxValue: "1",
code: "#F2726F"
}
]
},
dials: {
dial: [
{
value: "0.6",
toolText: "<b>$dataValue metric tonnes</b>"
}
]
}
},
events: {
initialized: function(evt, args) {
var chartRef = evt.sender;
function addLeadingZero(num) {
return num <= 0.6 ? "0" + num : num;
}
function updateData() {
$.ajax({
url:"{% url 'fetch_sensor_values_ajax' %}",
success: function (response) {
const data = response;
const time = data['time'];
const ppm = parseFloat(data["y"]);
chartRef.feedData(ppm);
}
})
}
chartRef.intervalUpdateId = setInterval(updateData, 10);
},
disposed: function(evt, args) {
clearInterval(evt.sender.intervalUpdateId);
}
}
}).render();
});
</script>
</body>
</html>
如何正确拟合数据,使其能够动态更新图形
{"time": "202010-05 02:02:20", "y": 0.5366612110490295}