Arduino网络编程实战-ADC数据可视化（仪表）

ADC数据可视化（仪表）

Arduino Ethernet Shield V1 允许 Arduino 板连接到互联网。它基于 Wiznet W5100ethernet 芯片（数据表）。 Wiznet W5100 提供支持 TCP 和 UDP 的网络 (IP) 堆栈。它最多支持四个同时套接字连接。

将物联设备采集的数据进行可视化，有助于对数据的理解以便对决策做出相应的支持。本次实例将结合Electron、echarts、JQuery、MQTT数据传输协议实现对ADC设备采集的数据仪表方式可视化处理。

1、硬件准备

Arduino Mega 2560
Arduino Ethernet Shield
路由器（推荐可以上网、开启DHCP）
网线一条
电脑一台
电位计模块一个

2、软件准备

Arduino IDE
VSCode IDE
MQTT服务器：https://mosquitto.org
JSON支持库：ArduinoJson
Electron开发环境：electron，本次使用的版本为17.0.1
Nodejs：https://nodejs.org，本次使用的版本为 16.13.0，建议与electron使用的版本一致
Python2.7

在Nodejs安装完成后，需要安装一些支持库，在命令行中运行
npm -g install node-gyp nan debug

3、Electron端代码实现

Electron代码与前面文章：

Arduino网络编程实战-ADC数据采集可视化(基于Electron+echarts+JQuery+MQTT)

下面只给主要代码(renderer.js)：

const host = '127.0.0.1'
const port = 1883
const clientId = 'mqtt\_arduino\_client'

const connectUrl = `mqtt://${host}:${port}`

const topic = '/arduino/temperature'

const client = mqtt.connect(connectUrl,{
    clientId,
    clean:true,
    connectTimeout:4000,
    reconnectPeriod:1000
})

var myChart = echarts.init($('#adc-main')[0]);
var counts = 0;
var datas = []
// 指定图表的配置项和数据
chart_option = {
  title: {
    text: 'ADC数据采集-压力'
  },
  tooltip: {
    formatter: '{a} <br/>{b} : {c}%'
  },
  series: [
    {
      name: 'Pressure',
      type: 'gauge',
      detail: {
        formatter: '{value}'
      },
      data: [
        {
          value: 50,
          name: '压力'
        }
      ]
    }
  ]
};

// 使用刚指定的配置项和数据显示图表。
myChart.setOption(chart_option);

function refreshChart(payload){
    let datas = [{
        name:'Score',
        value:payload.toString()
    }]
     // 更新表格数据
     //chart\_option.series.data = datas
     myChart.setOption({
         series:[{
         name:'压力',
         data:datas}]
     }) 
   }


client.on('connect',()=>{
    console.log('Connected')
    client.subscribe([topic],()=>{
        console.log(`Subscribe to topic ${topic}`)
    });
});

client.on('message',(topic,payload)=>{
    console.log('Received Message:',topic,payload.toString())
    refreshChart(payload)
});

4、Aruduino数据采集实现代码

#include <SPI.h>
#include <Ethernet.h>
#include <PubSubClient.h>

#define ADC\_PIN 2

#define USE\_STATIC 0
byte mac[] = {
  0xDE, 0xAD, 0xBE, 0xEF, 0xFE, 0xED
};
#if USE\_STATIC
IPAddress ip(192, 168, 2, 177);
#endif

void callback(char\* topic, byte\* payload, unsigned int length) {
  Serial.print("Message arrived [");
  Serial.print(topic);
  Serial.print("] ");
  for (int i=0;i<length;i++) {
    Serial.print((char)payload[i]);
  }
  Serial.println();
}

EthernetClient ethClient;
PubSubClient client(ethClient);
IPAddress serverIP(192, 168, 2, 190);

void reconnect() {
  // Loop until we're reconnected
  while (!client.connected()) {
    Serial.print("Attempting MQTT connection...");
    // Attempt to connect
    if (client.connect("arduinoClient")) {
      Serial.println("connected");
    } else {
      Serial.print("failed, rc=");
      Serial.print(client.state());
      Serial.println(" try again in 5 seconds");
      // Wait 5 seconds before retrying
      delay(5000);
    }
  }
}

void setup() {
  
   Serial.begin(9600);
   Serial.println("Ethernet MQTT Client Example");
   pinMode(ADC_PIN,INPUT);
#if USE\_STATIC
   Ethernet.begin(mac,ip);
#else
  Ethernet.begin(mac);
#endif

   if (Ethernet.hardwareStatus() == EthernetNoHardware) {
    Serial.println("Ethernet shield was not found. Sorry, can't run without hardware. :(");
    while (true) {
      delay(1); 
    }
  }
  if (Ethernet.linkStatus() == LinkOFF) {
    Serial.println("Ethernet cable is not connected.");
    while(true){
      delay(1);  
    }
  }

  Serial.print("IP:");
  Serial.println(Ethernet.localIP());
  Serial.print("Subnet Mask:");
  Serial.println(Ethernet.subnetMask());
  Serial.print("Gateway:");
  Serial.println(Ethernet.gatewayIP());
  Serial.print("DNS Server:");
  Serial.println(Ethernet.dnsServerIP());

  client.setServer(serverIP, 1883);
  client.setCallback(callback);
}

void loop() {
  if (!client.connected()) {
    reconnect();
  }
  client.loop();
  
   // 读取ADC值
  int value = analogRead(ADC_PIN);
  String datas = String("") + value;
  // 发送ADC数据
  client.publish("/arduino/temperature",datas.c\_str());
  Serial.print("send:");
  Serial.println(datas);
  delay(1000);
}

5、运行结果

文章来源: https://iotsmart.blog.csdn.net/article/details/123121427