Temperature

DynamoDB, AWS IoT, Lambda, API Gateway, React, SVG

My workstation is in a loft room and it's become very clear through numerous lockdowns quite how hot it gets up there. Back in 2020 I started tracking the temperature with a Raspberry PI and a small temperature sensor plugged into a breadboard.

This reports to a DynamoDB table using AWS IoT. API Gateway & Lambda make this data available via an API. Christmas at the folks then gave me a couple of spare days to have this data surfaced using a semi-interactive SVG.

The SVG displays the average temperature each day as recorded in the room for the last 30+ days.

I wanted the SVG to clearly convey a comfortable/normal temperature band, and to show quite a contrast when temperatures stray outside of these values. To do this there's no visible change in position for "normal" values (20°-24°). Values outside of this range contrast in their physical position as well as colour.

A good result is a set of grey bars with very few outliers. The reality of the summer period however is many uncomfortably hot days, even with aircon to help.

Whilst this is an SVG, it's actually a React component. The next iteration would want it being a stand-alone SVG with inline JS.

Why is it on my website? No good reason.