Node-red学习第8篇--关于模块dashboard中chart节点多数据统计显示的实现
阅读原文时间:2021年04月20日阅读:1

       这一段时间是毕业季,作为一名毕业的应届生,这两天事情也是比较多。前一段时候在学校的时候帮导师做一个关于node-red的项目,顺便带一下大三的学弟们,这两天学弟问了我一个关于node-red-dashboard模块中关于chart节点如何实现多数据统计的问题,昨天晚上花了点时间研究了一下,今天赶紧写一下博客记录分享一下,好了,废话不多说,进入正题。

(错误的思路我就不做过多赘述了,这里只讲回头思考整理的)

        我们们点击chart节点,会在node-red的侧边栏上的Info中显示chart的详细介绍,点击这里就可以看到github中对chart节点的介绍(遇到新的技术或者不懂的知识点去看全英文的官方介绍是正确的选择,强调英语阅读能力的重要性)。其中有这么一句话。

         从上面这段话我们可以知道的是,为了在一个chart中显示两个或者更多的折线,那么每个msg对象必须包含一个能够辨别它属于哪个系列的topic属性,比如:

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

        也就是说,返回的msg对象应该至少包含这两个属性。OK,既然分析完毕,那么我们来进行具体的实现。

        创建一个flow,拖入一个function节点。双击这个节点,写代码。

        

var value1 = Math.random();
var value2 = Math.random();

var topic1 = "temperature";
var topic2 = "humidity";

var msg = [{topic:topic1,payload:value1},
{topic:topic2, payload:value2}];

return msg;

        同时设置Outputs的数量值为2。

        接下来,再拖入一个Inject节点和一个chart节点,将流程进行连接,连接效果如下图所示。

        连接完毕后,点击右上角的deploy,进行部署(其中deploy也是有三个选项的,分别是部署全部,部署改变的流以及部署改变的节点,看个人需要以及使用习惯)。点击侧边栏中的dashboard中的转到按钮(个人说法,如下图标红所示)或者重新打开一个网页,在搜索栏中键入localhost:1880/ui;就可以看到多输除的折线统计图(如下图所示)。

        到这里利用chart节点实现的多数据统计表就OK了,当然除了折线统计图还有其他的图 ,可以根据自己的布局来选举,希望大家多多评论讨论。