Example - copy and change it
A weather station that draws its own chart
- Source:
examples/weather_station.py- Widgets:
- Gauge, Chart
- Hardware:
- None to run it; a temperature, humidity and pressure sensor to make it real
- Status:
- Tested with a fake connection. The chart was checked in real Chrome with simulated readings, and the whole program not yet run against a real server.
A weather station that draws its own chart
The first example showed a value that never changed. Real sensors change, and most programs are a loop: read, publish, wait, repeat. This one is that loop.
One value, or several
temperature.set(readings["temperature"])
humidity.set(readings["humidity"])
pressure.set(readings["pressure"])
conditions.set_values(readings)
There are two ways to publish. .set(value) sends a single number, which is what a gauge wants. .set_values({...}) sends several named values in one update, which is what a chart wants: the whole set of readings arrives together, so the chart never shows a moment that did not exist.
What the chart shows
The chart draws one small panel for each value, not one crowded plot: temperature is around 20, humidity around 60 and pressure around 1,000, so on a single scale two of them would be flat lines. Each panel has its own scale, all three share the time axis, and hovering (or the arrow keys) draws a line through all of them with the readings at that moment. The table icon shows the same numbers as a table.
The platform only keeps the latest value, so the chart shows what your browser has seen since you opened the page: it starts empty and fills in as readings arrive.
The loop
while cycles is None or done < cycles:
readings = _read_conditions()
...
time.sleep(interval)
The program reads, publishes and sleeps two seconds, until you press Ctrl+C. (The cycles argument is there so a test can stop it after a few rounds; you can ignore it.)
About those numbers
The readings are random values in a plausible range: _read_conditions() stands in for real hardware, and that one function is the only thing you replace. Wire up a BME280 or any other sensor, return its readings in the same shape, and the gauges and the chart follow.
Running it
Copy weather_station.py anywhere and run it:
python weather_station.py
If this is the first time you have connected from this device, it prints a link and a code to approve in the browser; answer y when the terminal asks you to confirm the account. That makes the device yours and gives it an id. After that it simply connects.