1

我在制作更高级的实时图表时遇到问题。我在 PC 上使用 node-red 从 PLC 收集数据并使用标准 node-red 仪表板图表节点将其显示在折线图中。PLC 从 30 个传感器读取值：20 个压力、3 个温度、3 个流量、1 个速度。读取频率为 4Hz。并非所有值在时间上都是可见的，因为我希望图表清晰。为此，我还需要根据传感器拆分 y 轴。因此，一种用于压力，一种用于温度，一种用于流量，一种用于速度。目前数据以数组 msg.payload[] 的形式出现，但这并不重要，因为我会将数据格式化为正确的格式。我知道实时图表工作的格式数据是

{topic:"temperature", payload:22}
{topic:"humidity", payload:66}

对于静态图表

msg.payload =[{
"series": ["A", "B", "C"],
"data": [
    [{ "x": 1504029632890, "y": 5 },
     { "x": 1504029636001, "y": 4 },
     { "x": 1504029638656, "y": 2 }
    ],
    [{ "x": 1504029633514, "y": 6 },
     { "x": 1504029636622, "y": 7 },
     { "x": 1504029639539, "y": 6 }
    ],
    [{ "x": 1504029634400, "y": 7 },
     { "x": 1504029637959, "y": 7 },
     { "x": 1504029640317, "y": 7 }
    ]
],
"labels": [""]
}]

. 带有来自上述代码的数据的标准图表 我知道节点红色仪表板图表类似于 chart.js。我可以发送 ui_control 消息来调整实际的 y 轴并添加另外两个 y 轴：

let msg2=
{
    ui_control :{ 
        options: {
            scales: {
                xAxes: [{
                    type: 'time',
                    time: {
                        unit: 'minute',
                        unitStepSize: 1,
                        displayFormats: {
                            minute: 'HH:mm'
                        }
                    }
                }],
                yAxes: [{
                    id: "1",
                    scaleLabel: {
                            display: true,
                            labelString: 'pressure [bar]'
                            },
                    ticks: {
                        min: -10,
                        max: 10,
                        stepSize: 2
                    }
                }, {
                    id: "2",
                    scaleLabel: {
                            display: true,
                            labelString: 'Temperature [°C]'
                            },
                    ticks: {
                        min: 0,
                        max: 20,
                        stepSize: 4
                    }
                    }, {
                    id: "3",
                    scaleLabel: {
                            display: true,
                            labelString: 'Flow [L/min]'
                            },
                    ticks: {
                        min: 0,
                        max: 20,
                        stepSize: 4
                    }
                }]
            }    ,        
                legend: {
                    display: true,
        position: 'top',
      },
      
      title: {
        display: true,
        text: 'Chart'
      }
    ,
            animation: {
                duration: 0
            }
        }},
};

return msg2;

结果是： 相同的数据，ui_control 消息结果

现在我想显示例如：

msg.payload = 5;
msg.topic="C";
msg.yAxis="3";
return msg;

而是在 ax 3（温度）上得到“C”，我在 ax 1（压力）上得到它，并且 Node-red 在发送上述消息后有时会冻结。 在 1 y 轴上有一个数据点的图表

所以现在正确的问题是：如何使用多个 y 轴？我可以使用标准的节点红色仪表板图表来做到这一点吗？数据结构应该如何寻找静态图表，以及如何寻找实时图表？也许我应该使用node-red模板节点并基于chart.js在HTML中编写代码？最后一个问题，我怎样才能最大限度地减少 PC 的使用，因为当我以 4Hz 运行 30 个传感器时，我在 10 秒内得到 1200 点？

我将不胜感激您的帮助：D

4

0 回答 0