我对Node red和HTML都很陌生，我希望能在这个论坛上得到帮助。我在核心模板节点中有一个HTML脚本。在收到GET请求后，脚本会从数据数组中呈现一个折线图。数据由另一个节点保存在流上下文数组var中，我需要HTML脚本节点来读取这些数据并绘制它；内部"；HTML脚本，但我不知道如何从流上下文var中获取实际数据(请查看TODO在哪里(。提前感谢您的帮助。
<!DOCTYPE HTML>
<html>
<head>
<script>
window.onload = function () {
var options = {
exportEnabled: true,
animationEnabled: true,
animationDuration: 200,
theme: "light2",
title :{
text: "Simple Line Chart"
},
axisY: {
includeZero: false
},
data: [{
type: "spline",
indexLabelFontSize: 16,
dataPoints: []
}]
};
var xVal = 0;
var yVal = 100;
var updateInterval = 2000;
var WaveData = [];
// TODO temporary random data
var createWaveData = function () {
var srcData = flow.get('Pressure') || [];
WaveData = srcData;
/* WaveData = [];
var count = 50;
for ( var j = 0; j <count; j++) {
yVal = yVal + Math.round(5 + Math.random() *(-5-5));
WaveData.push(yVal);
}*/
}
// when plotting next WaveData, let it start from x = 0
var updateChart = function (cnt) {
createWaveData();
options.data[0].dataPoints = [];
for (var j = 0; j < cnt; j++) {
yVal = WaveData[j];
options.data[0].dataPoints.push({y: yVal});
}
(new CanvasJS.Chart("chartContainer", options)).render();
};
setInterval(function(){ updateChart(WaveData.length) }, updateInterval);
}
</script>
</head>
<body>
<div id="chartContainer" style="height: 370px; width:100%;"></div>
<script src="https://canvasjs.com/assets/script/canvasjs.min.js"></script>
</body>
简单的答案是，你没有。无法从页面中直接访问Node RED上下文。
但你可以间接访问它，你有两个选择：
-
当通过http in/http响应节点加载页面时，使用模板节点将上下文变量的当前状态包括在页面中。这将为您提供数据的快照，但不会随着时间的推移而更新。
-
设置回Node RED的连接以刷新值。有两种不同的方法可以解决这个问题。
i。在http响应流中添加第二个http，返回上下文变量的内容，并在每次刷新图表时对其进行AJAX风格的调用。
ii。使用websocket-out节点设置到页面的websocket连接，然后在更新上下文变量时，该连接可以向页面发送实时更新。这意味着页面将始终使用最新的数据。
这两种方法的结合意味着您将在页面首次加载和实时更新时获得历史数据。
您还应该查看节点的红色面板节点集合，它可能会为您完成此操作。