Utilizing web development to produce a more dynamic data visualization experience
As the CEO of a small machine-learning startup, my day job is to create attractive data visualizations for my pastime.
I normally use Matplotlib for that, but this time I wanted to make it more interactive.
I made a React application using the World Bank’s Population Estimates and Projections dataset since I adore web development and design.
You can look at population pyramids for all nations and regions from 1960 to 2022, including forecasts to 2050, in this fascinating dataset. It has a Creative Commons Attribution 4.0 International License.
Additionally, the dataset is well suited for an interactive user interface that allows quick changes to years and geographical locations.
I’ll share observations from my work and lessons I learned in this story.
You can access the solution here: https://datawonder.io/population-pyramids if you want to try it out.
Let’s get going.
Part 1: Preparing the data
In order to offer data to the front end quickly and simply, I wanted to avoid any time-consuming preprocessing.
Instead, I thought it would be better to prepare all the data in advance and put it into RAM as soon as the applications launch.
There is usually a collection of indicators in the World Bank data, and the ones I want look like this:
Population by gender and age group
There are 17 age categories, ranging from 0 to 80 years old. As seen in the pandas data frame below, each indicator has a different column for each year.
