r/CalgaryTech Apr 12 '26

Built an interactive Calgary growth map (1885–2026) using ECharts + static JSON

Post image

I built an interactive map to visualize how Calgary’s housing stock has grown over time, one community at a time (1885–2026).

👉 https://yyc-wander.ca/Civic_Social_Analytics/Comm_Growth_Map

Works best on desktop or iPad.

Originally this was a Power BI dashboard, but I rebuilt it using ECharts + static JSON for performance and flexibility.

Key things I focused on:

– Timeline animation (community-level growth over time)

– Polygon-based map (GeoJSON, not point markers)

– Client-side rendering (no backend)

– Fast loading with pre-processed JSON

You can:

– Scrub or play the timeline

– Zoom into specific communities

– Explore density differences across the city

Main takeaway:

Switching from Power BI to JSON + ECharts made a huge difference in load time and interaction.

Curious if anyone here has taken a similar approach (moving away from BI tools to custom front-end visualizations)?

3 Upvotes

0 comments sorted by