Главная » Форумы » Программирование

bme280 и красивые графики в браузере

Нет ответов
Чт, 10/11/2016 - 15:40
gulin176
Offline
Зарегистрирован: 03.09.2016 
#include <ESP8266WiFi.h>
#include <WiFiClient.h>
#include <ESP8266WebServer.h>
#include <stdint.h>
#include "SparkFunBME280.h"
#include "Wire.h"
BME280 mySensor;
const char* ssid     = "вашаSSID";
const char* password = "ваш пароль";
ESP8266WebServer server(80);
String webString = "";   // String to display
void handle_root() {
  server.send(200, "text/html", "Hello from the weather esp8266, read from /temp or /humidity");
  delay(100);
}
void setstringtoweb() {
  webString = "";
  webString += "<!DOCTYPE HTML> \n";
  //  webString += "HTTP/1.1 200 OK \n";
  //  webString += "Content-Type: text/html \n";
  //  webString += "Connection: close \n";  // the connection will be closed after completion of the response
  //  webString += "Refresh: 10 \n";  // refresh the page automatically every 10 sec
  //  webString += "<!DOCTYPE HTML> \n";

  webString += "<html><head> \n";
  webString += "<script src='https://www.google.com/jsapi'></script><script> \n";
  webString += "google.load('visualization','1',{packages:['gauge']});\n";
  webString += "google.setOnLoadCallback(drawChart);\n";
  webString += "google.setOnLoadCallback(drawChart2);\n";
  webString += "function drawChart() {\n";
  webString += "var data = google.visualization.arrayToDataTable([";
  webString += "['Label','Value']";
  webString += ",['Temperature, C'," + String(mySensor.readTempC()) + "]]); \n";
  webString += "var options = {max:40,width:800,height:240,redFrom:35,redTo:40,";
  webString += "yellowFrom:28,yellowTo:35,greenFrom:18,greenTo:28,minorTicks:5}; \n";
  webString += "var chart = new google.visualization.Gauge(document.getElementById('oil')); \n";
  webString += "chart.draw(data,options);}\n";

  webString += "function drawChart2() {\n";
  webString += "var data = google.visualization.arrayToDataTable([";
  webString += "['Label','Value']";
  webString += ",['Humidity, %'," + String(mySensor.readFloatHumidity()) + "]]); \n";
  webString += "var options = {width:800,height:240,redFrom:0,redTo:15,";
  webString += "yellowFrom:15,yellowTo:30,greenFrom:30,greenTo:60,minorTicks:5}; \n";
  webString += "var chart = new google.visualization.Gauge(document.getElementById('oil2')); \n";
  webString += "chart.draw(data,options);} \n </script></head><body> \n";
  webString += "<div id='oil' style='width:800px;height:240px;'></div>\n";
  webString += "<div id='oil2' style='width:800px;height:240px;'></div></body></html>\n";

  server.send(200, "text/html", webString);            // send to someones browser when asked
}
void setup(void)
{
mySensor.settings.commInterface = I2C_MODE;
  mySensor.settings.I2CAddress = 0x76;
  mySensor.settings.runMode = 3; //Normal mode
  mySensor.settings.tStandby = 0;
  mySensor.settings.filter = 4;
  mySensor.settings.tempOverSample = 1;
  mySensor.settings.pressOverSample = 1;
  mySensor.settings.humidOverSample = 1;
  (mySensor.begin(), HEX);
  WiFi.begin(ssid, password);
  while (WiFi.status() != WL_CONNECTED) {
    delay(500);
  }
  server.on("/", handle_root);
  server.on("/p", [](){  // if you add this subdirectory to your webserver call, you get text below :)
    (mySensor.begin(), HEX);       // read sensor
    webString = "Temperature: " + String(mySensor.readTempC()) + " C"; // Arduino has a hard time with float to string
    webString += "       Pressure: " + String(mySensor.readFloatPressure()/100+16) + " HPa";
    webString += "       Humidity: " + String(mySensor.readFloatHumidity()) + " %";
    server.send(200, "text/plain", webString);            // send to someones browser when asked
  });

  server.on("/g", []() { // ключик для вывода графической информации
    (mySensor.begin(), HEX);       // read sensor
    setstringtoweb();       //выводим картинку
  });
  server.begin();
}
void loop(void)
{
  server.handleClient();
}
Здравствуйте. Создал(ну не то чтобы создал, слепил скорее) рабочую программу для того чтобы посмотреть за климатом за окном не отрываясь от браузера.
Просьба не ругаться на 8266, это всего лишь частный случай и если бы был шилд для соединения ардуино с локальной сетью, пользовался бы им
 Смотрим какой локальный адрес получила ваша 8266 и по адресу ***.***.***.***/p смотрим температуру, давление и влажность за окном.
Прошу вашей помощи, я слабоват в написании программы с нуля. Попытался сделать график, считаю это более наглядная вещь. смог по адресу ***.***.***.***/g вывести круглый прибор со стрелкой. однако хочу линейный график. Можно ли поправить код пожалуйста. Так как у меня впн подключение к домашнему роутеру, просматривать погоду можно с любой точки где есть интернет. 
нашел код но встроить его мне сложновато.  
//вывод данных с помощью web-сервера в виде графиков
// автор А. Коновалов 2015 г.
//#include <UIPEthernet.h>
#include <Ethernet.h>
#include <SPI.h>
// Enter a MAC address and IP address for your controller below.
// The IP address will be dependent on your local network:
byte mac[] = { 0xDE, 0xAD, 0xBE, 0xEF, 0xFE, 0xED };
IPAddress ip(192,168,26,15);

// Initialize the Ethernet server library
// with the IP address and port you want to use
// (port 80 is default for HTTP):
EthernetServer server(80);
const char str1[] PROGMEM = "<!DOCTYPE html><script src=";
const char str2[] PROGMEM = "\«www.google.com/jsapi?autoload={'modules':[{'name':»;
const char str3[] PROGMEM = "'visualization','version':'1','packages':['corechart']}]}\">";
const char str4[] PROGMEM = " »;
const char str12[] PROGMEM = " ";

const char* const string_table[] PROGMEM = {str1, str2, str3, str4, str5, str6, str7};
const char* const string_table2[] PROGMEM = {str8, str9, str10, str11, str12};
char myChar;
char buffer[80];

unsigned long previousMillis1 = 0;// посл момент времени
unsigned long previousMillis2 = 1;// посл момент времени
unsigned long previousMillis3 = 1;// посл момент времени

long OnTime2 = 60000; // минута
long OnTime3 = 600000; // полчаса
int In_sec = 0; // отсчет за сек
int In_min = 0; // отсчет за мин
int In_half = 0; // отсчет за полчаса

long Sum_min = 0; // сумма за мин
long Sum_half = 0; // сумма за полчаса
float Sum_base_min = 0;
float Sum_base_half = 0;
int i,j,k =0;

void setup()
{
// start the Ethernet connection and the server:
Ethernet.begin(mac, ip);
server.begin();

}
//unsigned long begMillis = millis();// тек время в мс
void loop()
{
unsigned long currentMillis = millis();// тек время в мс

In_sec = analogRead(0);
Sum_min = Sum_min + (currentMillis — previousMillis1) * In_sec;
In_min = (Sum_min + Sum_base_min ) / (OnTime2 * i + currentMillis — previousMillis2);
Sum_half = Sum_half + (currentMillis — previousMillis1) * In_sec;
In_half = (Sum_half + Sum_base_half) / (OnTime3 * j + currentMillis — previousMillis3);
previousMillis1 = currentMillis; // запоминаем момент времени

if(currentMillis — previousMillis2 >= OnTime2)
{ i=1;
Sum_base_min = Sum_min;
previousMillis2 = currentMillis; // запоминаем момент времени
Sum_min = 0;
}
if(currentMillis — previousMillis3 >= OnTime3)
{ j=1;
Sum_base_half = Sum_half;
previousMillis3 = currentMillis; // запоминаем момент времени
Sum_half = 0;
}

/*
In_sec = 990;
In_min = 500;
In_half = 90;

*/
// listen for incoming clients
EthernetClient client = server.available();
if (client) {
// an http request ends with a blank line
boolean currentLineIsBlank = true;
while (client.connected()) {
if (client.available()) {
char c = client.read();
if (c == '\n' && currentLineIsBlank) {

for (int i = 0; i < 7; i++)
{
strcpy_P(buffer, (char*)pgm_read_word(&(string_table[i]))); // Necessary casts and dereferencing, just copy.
client.print(buffer);
delay( 500 );
}

client.print("['Сейчас', ");
client.print(660);
client.print(", ");
client.print(1120);
client.print( "],]);");


for (int i = 0; i < 5; i++)
{
strcpy_P(buffer, (char*)pgm_read_word(&(string_table2[i]))); // Necessary casts and dereferencing, just copy.
client.print(buffer);
delay( 500 );
}

break;
}
if (c == '\n') {
// you're starting a new line
currentLineIsBlank = true;
}
else if (c != '\r') {
// you've gotten a character on the current line
currentLineIsBlank = false;
}
}
}
// give the web browser time to receive the data
delay(1);
// close the connection:
client.stop();
}
}

 

 

Верх