Gráficas de Datos en Tiempo Real en Arduino Mega: Historial TFT LCD con Sensor DHT11

Componentes y materiales

Componente	Cantidad
Arduino Mega 2560	1
Sensor temperatura/humedad DHT11 (4 pines)	1
Shield TFT LCD 2.8" Elegoo	1
Cables jumpers	1 set
Protoboard	1

Aplicaciones y servicios online

• Arduino Web Editor

Sobre el proyecto

Resumen

¿Querías graficar datos profesionalmente en un TFT LCD? El problema es que crear gráficas es difícil por los cálculos involucrados. Este proyecto elimina esa dificultad: crea tu propia gráfica de historial personalizada en segundos. Solo editas 5 variables.

Funcionalidad

El proyecto hace que graficar sea fácil y divertido. Todos los cálculos complejos están hechos; el usuario solo edita 2 variables y elige colores. La gráfica traza temperatura en vivo cada 6 segundos, mostrando puntos conectados por líneas. El eje X muestra segundos transcurridos; el eje Y, el rango de valores.

El Arduino Mega lee el DHT11, almacena la temperatura y la grafica. Diagrama de funcionalidad:

• Read Temperature: Lee temperatura del sensor
• Process Data: Procesa lectura y la mapea a la gráfica
• Graph Data: Muestra valores mapeados en la gráfica

Solo necesitas entender cómo se posicionan elementos en el TFT LCD. Me refiero a toda la pantalla como "canvas". Las librerías TFT funcionan similarmente, así que el código sirve para otras librerías.

Ejemplo: tft.fillRect(originX, originY, sizeX, sizeY, Colour);

• originX: distancia desde la derecha
• originY: distancia desde arriba
• sizeX: ancho (eje X)
• sizeY: alto (eje Y)

Beneficios

• Graficar datos de sensores en TFT LCD
• Hacerlo en segundos

Construcción del proyecto

Paso 1: Materiales

• 1 Arduino Mega
• 1 Elegoo 2.8" TFT LCD
• 1 Sensor DHT11
• 1 Protoboard
• Cables jumpers

Cualquier sensor puede usarse; cambiar de sensor se explica abajo.

Paso 2: Conexión del circuito

Conecta el DHT11 al Arduino Mega según el esquemático. ¡Listo!

Paso 3: Entender el código

Tres partes principales:

• Set Up Graph: Dibuja ejes, marcas, etiquetas y valores del eje Y
• Read Temperature: chk = DHT.read11(22); temp = (DHT.temperature);
• Draw Graph: Dibuja puntos, los une con líneas, y gestiona desplazamiento cuando el canvas se llena (elimina el dato más antiguo y desplaza los demás)

Personalizar la gráfica

La gráfica es 100% editable: tamaño, posición, color, y cualquier dato de sensor. Variables clave:

bool proDebug = 0;           // Debug: imprime temperatura en Monitor Serie (requiere Monitor abierto)
uint16_t graphColor = BLUE;  // Color ejes, marcas, etiquetas
uint16_t pointColor = BLACK; // Color puntos de valor
uint16_t lineColor = GREEN;  // Color líneas que unen puntos
String graphName = "Time Graph"; // Título
int graphRange = 50;         // **CRÍTICO**: Valor máximo graficable. Para temp 50°C; para analógico 1024
int markSize = 3;            // Tamaño del punto (lado del cuadrado)

El resto de variables se calculan automáticamente.

Cambiar el valor graficado

Puedes graficar cualquier sensor (humedad suelo, luz, etc.) editando pocas líneas. Guía visual incluida en imágenes.

Ir más allá

Experimenta editando originX, originY, sizeX, sizeY para cambiar tamaño/posición. Archivo header adjunto con códigos de color. ¡Tu gráfica personalizada lista!

Librerías

• Elegoo Libraries (Copyright 2012 Adafruit Industries, licencia BSD)
• DHT (Autor Rob Tillaart, dominio público)

Contexto

Publicé antes un proyecto de gráficas de barras (1-4 valores). Decidí publicar otra plantilla para gráficas de historial (líneas), sin líneas confusas. Hice las matemáticas de nuevo para que todos puedan graficar datos en vivo fácilmente.