Напиши web интерфейс с графиком изменения температуры, для ESP8266 и датчиком температуры BME280
#include <ESP8266WiFi.h>
const char* ssid = "ssid"; // название Wi-Fi сети
const char* password = "password"; // пароль для доступа к Wi-Fi сети
WiFiServer server(80); // указываем номер порта
void setup() {
pinMode(LED_BUILTIN, OUTPUT); // настройка светодиода
Serial.begin(9600); // настройка Serial порта
delay(10);
digitalWrite(LED_BUILTIN, LOW);
Serial.println();
Serial.print("Connecting to ");
Serial.println(ssid);
WiFi.begin(ssid, password);
while (WiFi.status() != WL_CONNECTED) {
delay(500);
Serial.print(".");
}
Serial.println("");
Serial.println("WiFi connected");
server.begin();
Serial.println("Server started");
Serial.println(WiFi.localIP());
}
#include <Adafruit_Sensor.h>
#include <Adafruit_BME280.h>
#define SEALEVELPRESSURE_HPA (1013.25)
Adafruit_BME280 bme;
void setup() {
digitalWrite(LED_BUILTIN, LOW);
Serial.begin(9600);
if (!bme.begin(0x76)) {
Serial.println("Could not find a valid BME280 sensor, check wiring!");
while (1);
}
}
float getTemperature() {
float temperature = bme.readTemperature();
return temperature;
}
<!DOCTYPE html>
<html>
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.8.0/Chart.min.js"></script>
<script>
var labels = [];
var data = [];
var chart;
function addData(label, value) {
if (labels.length >= 10) {
labels.shift();
data.shift();
}
labels.push(label);
data.push(value);
chart.update();
}
function connect() {
var ws = new WebSocket("ws://" + location.hostname + ":81/");
ws.onmessage = function(evt) {
var msg = JSON.parse(evt.data);
addData(msg.t, msg.v);
};
ws.onopen = function(evt) {
ws.send("get");
};
}
function initChart() {
var ctx = document.getElementById("chart").getContext('2d');
chart = new Chart(ctx, {
type: 'line',
data: {
labels: labels,
datasets: [{
label: "Temperature",
data: data,
borderColor: "#3e95cd",
fill: false
}]
},
options: {
responsive: true,
title: {
display: true,
text: 'Temperature Graph'
},
scales: {
xAxes: [{
display: true
}],
yAxes: [{
display: true,
ticks: {
beginAtZero:true,
steps: 10,
stepValue: 1,
max: 40
}
}]
}
}
});
}
document.addEventListener("DOMContentLoaded", function(event) {
initChart();
connect();
});
</script>
</head>
<body>
<canvas id="chart" width="400" height="200"></canvas>
</body>
</html>
#include <WebSocketsServer.h>
WebSocketsServer webSocket = WebSocketsServer(81);
void webSocketEvent(uint8_t num, WStype_t type, uint8_t * payload, size_t length) {
switch(type) {
case WStype_TEXT:
if (strcmp((const char *) payload, "get") == 0) {
char response[64];
sprintf(response, "{"t":%d,"v":%.2f}", millis(), getTemperature());
webSocket.sendTXT(num, response);
}
break;
}
}
void setup() {
digitalWrite(LED_BUILTIN, LOW);
Serial.begin(9600);
if (!bme.begin(0x76)) {
Serial.println("Could not find a valid BME280 sensor, check wiring!");
while (1);
}
WiFi.begin(ssid, password);
while (WiFi.status() != WL_CONNECTED) {
delay(500);
Serial.print(".");
}
webSocket.begin();
webSocket.onEvent(webSocketEvent);
}
void loop() {
webSocket.loop();
delay(100);
}
Нажимая «Регистрация» или «Войти через Google», вы соглашаетесь с Публичной офертой, даете Согласие на обработку персональных данных, а также подтверждаете что вам есть 18 лет
Нажимая «Регистрация» или «Войти через Google», вы соглашаетесь с Публичной офертой, даете Согласие на обработку персональных данных, а также подтверждаете что вам есть 18 лет