After going through multiple ideas we fixed on the idea of creating visualisations using data from the professions/occupations Barbie dolls have had over the years.

Part 1 - Building a Simple Bar Graph

We decided to focus on creating one graph with one data set. We decided to use the data set we created, and for the graph, we were inspired by an article (Link) of the pudding.

We spent 2 hours learning about D3, using these tutorials.

Then we took this example, and started playing around with it.

We separated the large HTML code into Javascript and CSS using Glitch. Glitch was also great for coding together and seeing the changes we made in real-time. We went through the code and searched all the functions we did not know in D3 API to understand what each of them was doing.

Then we replaced the tsv file without data, that we created in a google sheet.

Our data was much longer than the example code. We learned that the mapping for the Y axis was fixed, and that's why all our text was squashed. So we made the Y and the X larger, adjusted the padding and text size, and got it to show our data in a bit more decent way.