Blog Post

Visualizing data - Manitoba Rainfall

AI created data visualiztaions for Manitoba rainfall data

The dataset here

Source of the dataset here

Been a long day, so I'll summarize how I approached prompting Qwen (note - the chat Qwen model, not the coding specific model)

  1. Gave it the data, asked it to explain it to me
  2. Asked it brainstorm cool (note, this is not the exact wording) ways to visualize the data.
  3. Out of the suggestions, told it to implement 2 of them

This is a bar chart visualization here
https://www.siliconspark.ca/ai-demos/demos/Qwen-MB-Precipitation-barchart.html

This is a sunburst visualization here
https://www.siliconspark.ca/ai-demos/demos/Qwen-MB-Precipitation-sunburst.html

NOTE
I haven't verified that the visualizations are correct. This was more of a field test to see if I could get the AI to do something close to what I had in mind

It took several (think +3) iterations to get the bar chart looking the way it is. If I'm less lazy, I'll post the iterations as an update.

Here's a summary (order is likely wrong, I'm going from memory, cut me some slack) of the iteration loop we went through to get the bar charts graph the way it is:

  1. Originally, it was supposed to break down the bars into individual units, each representing a set unit of pools.
  2. Then, we went down the route where it created SVGs looking like a pool to represent the units, but it was not performant because of how many SVGs were needed
  3. Tried grouping SVGs into buckets, but that made the visualization look wrong - all bars were the same length due to grouping rounding
  4. Switched back to bars, added a legend which puts numbers on the right of the bars
  5. Further visualization issues, alignment, scaling, etc

Just to be clear, I told Qwen to use D3.js to visualize the data - Qwen just wrote the code to use the library with the data.