即便不會node.js，拖拽就可完成數據的可視化展現

摘要：node-red是一款基於Node.js的開源可視化界面開發工具，不須要掌握node.js而經過拖拽便可完成數據的可視化展現。

1.首先看一下node-red對數據的渲染效果

你可能認爲，必須熟練掌握前端知識才能作出這樣的頁面，實際上它只須要一下幾步拖拽操做便可

node-red自己就是爲MQTT而誕生，所以很適合進行物聯網數據展現，支持數據庫操做、mqtt協議,同時用戶也能夠在它的基礎上，使用html等進行前端界面修改。若是你想快速而完美的展現你的數據，不妨試一試NODE-RED。固然，你想安裝它，也很簡單的~~

2.安裝

首先須要安裝nodejs（百度上有不少示例，也挺簡單的，就不講解啦）,而後 在控制檯輸入 npm install -g --unsafe-perm node-red 便可；

爲了讓node-red在後臺保持運行，咱們使用此命令：nohup node-red &

完整的安裝步驟以下

• 安裝nodejs環境

sudo apt-get install nodejs

• 安裝node-red

sudo apt-get install npm
sudo npm install -g node-red

• 普通運行

node-red

• 後臺持續運行

nohup node-red &

3.使用示例

展現一下我本身展現溫溼度的頁面

nede-red這款工具，好用並且簡單，很適合初學者。給你們分享一下個人數據展現，附源碼（頁面交醜，僅供交流學習）其中包括鏈接mqtt服務器、數據插入mysql數據庫

數據展現頁面

在下面這個界面中，我進行了兩個溫度、兩個溼度數據的展現；當訂閱的主題接受到消息後，解析json數據格式，獲得溫溼度數據並展現在前端

佈局：

注意，在此佈局中，有使用到數據庫。我使用的是mysql，只是簡單的插入數據，僅供參考。

• 紫色的方塊爲訂閱的MQTT消息，須要配置相應的參數
• 綠色爲調試信息；
• 藍色方塊爲佈局的展現，不一樣部件，展現的效果不一樣
• 黃色方塊爲信息格式轉化，主要是爲了方便折線圖的展現；
• 橙色方塊爲數據庫操做，須要鏈接本身的數據庫；

其實實現很簡單，就是經過拖拉、而後設置相應的參數，基本上不要求編程能力。並且，只要有數據，就能夠經過nodered去展現。

點擊關注，第一時間瞭解華爲雲新鮮技術~