網頁 MqTT Iot 儀表板整合

NDIR SCD30 二氧化碳濃度三合一感測套件感測器數據格式解析與應用網頁 MqTT Iot 儀表板整合

在開始本課程前，請先確認好你已經完成 EasySense 燒錄韌體, 設定好 WIFI , 並請已經設定好MQTT伺服器，且已經驗證完成，設備已正常運作，有把相關數據發送到 MQTT 伺服器上。

此外記得記下你的設備名稱，例如 esense_XXXXXX 開始新增儀表時會用到。這裡的 XXXXXX 一般就是六個字母或數字組成的。

再引言一次相關提取變數與其功能，稍後再新增儀表板時比較方便你的輸入與設定。

狀態數據點 Topic: tele/你的設備名稱/STATE

Time：時間，提取變數 => $.Time
Uptime：運行時間，提取變數 => $.Uptime
UptimeSec：運行秒數，提取變數 => $.UptimeSec
Heap：堆疊記憶體，提取變數 => $.Heap
SleepMode：睡眠模式，提取變數 => $.SleepMode
Sleep：睡眠狀態，提取變數 => $.Sleep
LoadAvg：平均負載，提取變數 => $.LoadAvg
MqttCount：MQTT 連接次數，提取變數 => $.MqttCount
Wifi.AP：Wi-Fi 接入點，提取變數 => $.Wifi.AP
Wifi.SSId：Wi-Fi SSID ，提取變數 => $.Wifi.SSId
Wifi.BSSId：Wi-Fi BSSID ，提取變數 => $.Wifi.BSSId
Wifi.Channel：Wi-Fi 頻道，提取變數 => $.Wifi.Channel
Wifi.Mode：Wi-Fi 模式，提取變數 => $.Wifi.Mode
Wifi.RSSI：Wi-Fi 信號強度（RSSI），提取變數 => $.Wifi.RSSI
Wifi.Signal：Wi-Fi 信號品質，提取變數 => $.Wifi.Signal
Wifi.LinkCount：Wi-Fi 連線次數，提取變數 => $.Wifi.LinkCount
Wifi.Downtime：Wi-Fi 停機時間，提取變數 => $.Wifi.Downtime

感測器數據點 Topic: tele/你的設備名稱/SENSOR

二氧化碳濃度 (單位:ppm) 提取變數: $.SCD30.CarbonDioxide
等效二氧化碳濃度 (單位:ppm) 提取變數: $.SCD30.eCO2
溫度 (單位: °C) 提取變數: $.SCD30.Temperature
濕度 (單位: %) 提取變數: $.SCD30.Humidity
露點溫度 (單位: °C) 提取變數: $.SCD30.DewPoint

一、開啟網頁版 MqTT Iot 儀表板

詳細連線教學請參考【教學】, 請先連線 MQTT 伺服器。後直接新增幾個儀表。

網頁版 MqTT Iot 儀表板

一、新增折線圖

這裡我們拿二氧化碳濃度顯示這個折線圖，點擊 Add Subscription(新增訂閱主題) 按鈕

感測器數據點 Topic: tele/你的設備名稱/SENSOR 提取變數: $.SCD30.CarbonDioxide

看到下圖，這裡訂閱的 Topic 主題輸入 tele/你的設備名稱/SENSOR ，資料是 Json 需打勾。JsonPath 輸入提取變數。儀錶板下拉式選單，選擇【折線圖】。這裡有需要注意的地方，就是【名稱 ID】這個欄位，就是不能與其他儀表板重複，它必須是唯一獨立個一個識別字串。區間值在折線圖可以忽略，最後單位就是這個數值的單位是什嗎，例如二氧化碳的濃度單位為 ppm 。完成設定後點擊【訂閱主題】這個按鈕送出，你就會在儀表板的區塊看到你所建立的折線圖了。