Abstract Painting visualizes regional COVID-19 infections in real time
Combining the relevance of real-time data with the realness of an acrylic painting on the wall.
Why?
Interactive digital dashboards and reports are great for understanding relationships and gaining insights. Still, they are visually locked behind bar charts and stuffed with pie charts. Wouldn’t it be great to visualize abstract data in your living room, pleasant to look at, yet informative?
I am using open COVID-19 data for Austria to paint the number of infections, beds of intensive care and recoveries for the regions most relevant to me. The data is updated daily for the preceding day.
How?
- The color of the cloud segments and the drops represent a region: Vienna, Lower Austria and Upper Austria
- The widths of the cloud segments are relative to the number of inhabitants
- The frequency of the drops visualize the infection rate of the corresponding region
- The polygons represent the rate of occupied intensive care beds
- The bursts of polygons refer to recoveries
How exactly?
Acrylic paint and Javascript on canvas, 140x100 cm. There are 2 additional layers projected on top of the painted canvas:
- attractive layer: shapes and colors drawn by p5.js code
- physical layer: animations due to gravity and collisions using matter.js
Find the source code here: https://gitlab.com/sektionschef/data_painting
The heavy lifting behind the project comes from:
- p5.js: a JavaScript library and a community for creative coding.
- Daniel Shiffman and his Coding Train for teaching p5.js and life in general.
- matter.js: the 2D physics engine for the web.
- maptastic.js: projection mapping utility.
- Austrian COVID-19 open data information portal: an initiative of the Bundesministeriums für Soziales, Gesundheit, Pflege und Konsumentenschutz. Thanks for the open data contribution and your affinity to long names.
- Alex for the soundtrack in the video.
- ambuzzador for the methodologies and mindset lessons.
No Python, no Pandas, no SQL, just .CSV in Javascript.