node-red教程7.3 常见的显示型仪表板控件应用

180 篇文章 127 订阅

上一小节使用了输入性的仪表板控件,此小节使用输出型,或者说显示型的仪表板控件。其实7.2.7小节已经使用了一个最常见的显示型控件了,那就是text控件,显示了“几年能结果子”。仪表板的显示型控件功能强大,界面美观,个人认为,这些控件特别适合来表示数据的变化情况。
##7.3.1 仪表gauge的使用
  向用户界面添加一个仪表类型小部件。
  输入的msg.payload应该是数值,且格式要与Value Format一致。Value Format是gauge中的一个选项,具体情况参考https://scotch.io/tutorials/all-about-the-built-in-angularjs-filters
  可以指定3个扇区的颜色,并将其混合在一起,颜色也可以由#RRGGBB来表示,这个表示方法前边已经用过了。
  仪表板有四种模式,常规的,甜甜圈,指南针和波浪。
  Label可以用消息的属性来设置。
  我们直接拖入4个gauge,来看看不同的“Type”有什么区别。为了方便比较,直接让Type与Label的名字一样。
这里写图片描述
  然后拖入一个滑块作为输入,为仪表提供数据。
  为了方便显示,需要给仪表设置不同的group,例如display1和display2。部署以后拖动slider,可以看到仪表上有实时的变化。

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

拿我格子衫来

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值