Node-RED如何在模板HTML中接收msg.payload

Question

“流图像”

注意：按照@hardillb的回答，我修复了上面的流程，并在下面发布了正确的流程。在此先感谢您的帮助。我是HTML的初学者，必须在Node-RED中使用它。我有一个简单的流程（如上面的图像链接所示）。我在有效负载中注入了带有示例折线图点的消息。我想在模板节点的HTML脚本中接收消息，然后将其在浏览器的折线图上呈现接收到的msg.payload数据。如果我从脚本内部生成随机图，则HTML脚本可以正常工作，但是我无法使该脚本接收msg.payload。我尝试了类似How to send msg.payload from function node to template node的内容>

下面是波形HTML中的HTML脚本。我向TODO表示了我尝试过的但没有起作用的内容。

<!DOCTYPE HTML>
<html>
<head>
<script>
window.onload = function () {

//define line graph options for CanvasJS line graph
var options =  {
	exportEnabled: true,
	animationEnabled: true,
	animationDuration: 200,
	theme: "light2",
	title :{
		text: "Simple Line Chart"
	},
	axisY: {
		includeZero: false
	},
	data: [{
		type: "spline",
		indexLabelFontSize: 16,
		dataPoints: []  //this will be loaded with "y" values from msg.payload
	}]
};

//TODO not working ---------------------
//load WaveData from msg.payload 
var WaveData = [];
var createWaveData = function () {
	document.getElementById("graphPoints").innerHTML = {{payload}};
	var yVal = 0;
	for ( var j = 0; j < graphPoints.length; j++) {
		yVal = graphPoints[j];
		WaveData.push(yVal);
	}
}
//--------------------------------------

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();

};

var updateInterval = 2000;
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> 

//TODO not working
//This is supposed to receieve msg.payload into graphPoints
<h1 id="graphPoints">{{payload}}</h1>

</body>
</html>

这是每个@hardillb答案的正确流程。The corrected flow per hardillb answer

注意：按照@hardillb的回答，我修复了上面的流程，并在下面发布了正确的流程。在此先感谢您的帮助。我是HTML的初学者，必须在Node-RED中使用它。我的流程很简单（显示为...

Answer 1

Node-RED节点一次仅作用于一条消息。

http-in节点将产生一条消息，该消息将由模板节点更新，然后由http-out节点返回。 http节点必须成对使用，一条输入消息直接导致对发出请求的浏览器的http响应。

Node-RED如何在模板HTML中接收msg.payload

问题描述投票：0回答：1

1个回答

最新问题

Node-RED如何在模板HTML中接收msg.payload

问题描述 投票：0回答：1

1个回答

最新问题

问题描述投票：0回答：1