582浏览
查看: 582|回复: 4

行空板之实时显示(折线图)

[复制链接]
本帖最后由 Nick-ccq 于 2022-6-29 11:01 编辑

行空板之实时显示数据(折线图)

创意起源

为了解决老师要查看传感器实时数据时,都要登录网页查看折线图的问题,因此利用行空板做出了一款实时显示数据和折线图显示。


效果预览


行空板介绍以及Mind+使用

https://makelog.dfrobot.com.cn/article-311576.html

大家可以先看看这篇帖子,大致了解什么是行空板,以及使用行空板的主要软件。然后再具体学习以下内容。

功能介绍

此项目主要功能为实时显示数据和图表绘制。

显示柱状图

实时显示温湿度、光线,柱状图形式呈现到行空板屏幕上。

部分代码如下:

import time
from unihiker import GUI   #导入包
from pinpong.board import Board,Pin,DHT11
from pinpong.extension.unihiker import *
gui=GUI()  #实例化GUI类

Board().begin()               #初始化

dht11 = DHT11(Pin(Pin.P21))

def numberMap(x, in_min, in_max, out_min, out_max):
  return (x - in_min) * (out_max - out_min) / (in_max - in_min) + out_min

temp_text = gui.draw_text(x=50, y=320, text='温度(℃)',color ='blue',origin='bottom',font_size=10)
temp_value = gui.draw_text(x=48, y=300, text='',color ='blue',origin='bottom',font_size=8)
temp1=gui.fill_rect(x=35, y=280, w=20, h=20,  color="green")

humi_text = gui.draw_text(x=120, y=320, text='湿度(%)',color ='blue',origin='bottom',font_size=10)
humi_value = gui.draw_text(x=118, y=300, text='',color ='blue',origin='bottom',font_size=8)
humi1=gui.fill_rect(x=105, y=280, w=20, h=20,  color="green")

light_text = gui.draw_text(x=190, y=320, text='光线',color ='blue',origin='bottom',font_size=10)
light1_value = gui.draw_text(x=188, y=300, text='',color ='blue',origin='bottom',font_size=8)
light1=gui.fill_rect(x=175, y=280, w=20, h=20,  color="green")

def temp_color(value):
    if value > 30:
        temp1.config(color='red')
    else:
        temp1.config(color='green')
def humi_color(value):
    if value > 85:
        humi1.config(color='red')
    else:
        humi1.config(color='green')
def light_color(value):
    if value > 2500:
        light1.config(color='red')
    else:
        light1.config(color='green')
while True:
        temp = dht11.temp_c() #读取摄氏温度
       # tempvalue.append(temp)

        humi = dht11.humidity() #读取湿度

        # print("dht11 temperature=",temp," humidity=",humi)
        temp_value.config(text=round(temp,1))
        temp1.config(h=-numberMap(round(temp,1),0,100,0,120))
        temp_color(temp)

        humi_value.config(text=humi)
        humi1.config(h=-numberMap(humi,0,100,0,120))
        humi_color(humi)

        light_value = light.read()

        light1_value.config(text=light_value)

        light1.config(h=-numberMap(light_value,0,4095,0,120))
        light_color(light_value)
        #print("光线强度:%d"%(light_value)) #终端打印信息

效果展示

折线图显示

主要根据列表数据,把温湿度、光线数据实时绘制到图表上。

部分代码:

import time
from unihiker import GUI   #导入包
from pinpong.board import Board,Pin,DHT11
from pinpong.extension.unihiker import *
import matplotlib.pyplot as plt

gui=GUI()  #实例化GUI类
Board().begin()               #初始化
dht11 = DHT11(Pin(Pin.P21))

tempvalue=[]
humivalue=[]
lightvalue=[]
xdata=[]
Flag=0
fig = plt.figure(figsize=(16, 6),dpi=20)#设置绘制窗口

while True:
        temp = dht11.temp_c() #读取摄氏温度
        humi = dht11.humidity() #读取湿度
        light_value = light.read()
        Flag += 1
        if len(tempvalue)>20 :
            Flag = 0
            tempvalue=[]
            humivalue=[]
            lightvalue=[]
            xdata=[]
        xdata.append(Flag)    
        tempvalue.append(round(temp,1))
        humivalue.append(humi)
        lightvalue.append(light_value)

        plt.clf()  
        plt.plot(xdata, tempvalue, 'yv-', alpha=1, linewidth=1)
        plt.plot(xdata, humivalue, 'ro:', alpha=1, linewidth=1)
        plt.plot(xdata, lightvalue, 'r>-', alpha=1, linewidth=1)
        plt.legend(['temp','humi','light'])
        plt.pause(0.1)  #显示秒数
        plt.ioff()

效果展示:

效果展示

电脑远程桌面

1、利用电脑自带的远程桌面连接行空板,操作如下:

2、输出行空板地址,默认地址:10.1.2.3

3、连接成功显示,行空板主页面

效果展示:

总结

目前只是做了最基础的效果,后续要丰富功能,例如:语音播报、触摸切换等。还要对外观进行美观,加个外壳看起来美观。大家对这个功能页面有什么更好的建议提出来,进行改进。



折线图.png
柱状图.png

行空板-实时显示数据(折线图).zip

167.57 KB, 下载次数: 30

Ski  高级技师

发表于 2022-6-29 12:50:44

回复

使用道具 举报

方老师好  学徒

发表于 2022-6-29 14:50:04

数组长度大于20,之后,现在楼主是清空数组。可不可以实现X轴跟随移动呢
回复

使用道具 举报

Nick-ccq  初级技匠
 楼主|
来自手机

发表于 2022-6-29 20:59:46

方老师好 发表于 2022-6-29 14:50
数组长度大于20,之后,现在楼主是清空数组。可不可以实现X轴跟随移动呢

这个本来是跟随x轴移动,你可以去掉那段清除代码。我是怕显示数据太多,显示不是很清楚,做了数据清除,清除之后还是会继续绘制图表的。
回复

使用道具 举报

hnyzcj  版主

发表于 2022-7-3 09:18:01

不错
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

为本项目制作心愿单
购买心愿单
心愿单 编辑
[[wsData.name]]

硬件清单

  • [[d.name]]
btnicon
我也要做!
点击进入购买页面
上海智位机器人股份有限公司 沪ICP备09038501号-4

© 2013-2022 Comsenz Inc. Powered by Discuz! X3.4 Licensed

mail