Graphical Climate: Touchscreen Thermometer

While a simple LCD outputs text, the TFT Graphing Monitor takes datalogging to the next level. This project involves storing historical sensor data in an array and actively drawing a line chart on a color display to visualize trends.

Array History Math

To draw a graph that sweeps from left to right:

1. The Array: You create an array with a size matching the pixel width of your screen (e.g., int tempHistory[320]).
2. The Shift: Every minute, you read the DHT22 sensor. Before saving it, you use a for loop to shift every existing data point in the array one slot to the left, deleting the oldest reading at slot 0.
3. The Current Data: You save the new temperature into the final slot of the array.

The Draw Loop

In the display routine, you loop through the array. Using the tft.drawLine() function, you connect point 0 to point 1, point 1 to point 2, and so on. You must use the map() function to convert the temperature (20°C to 40°C) to the screen's Y-pixel coordinates (e.g., 200 pixels down to 10 pixels), flipping the axis so higher temperatures draw higher on the screen!

Components Needed

• Arduino Mega or ESP32: High RAM is required to hold large history arrays.
• 2.8" or 3.5" TFT Touchscreen Shield: The canvas.
• DHT22 / BME280 Sensor: The climate probe.
• Lithium-Ion Battery + Protection Circuit: For portability.

This is a fantastic introduction to Data Visualization on microcontrollers.