I actually was planning to cover a dataset on Mental Health and I was half way into visualizing it. But the data just wasn’t diverse enough to have plot a proper scatter plot. So I settled on the Airport Flight data for all US Airports from 2017 – 2022.
The actual data set is over 18000 data entries. I did not want to risk my code crash when it parsed this huge amount of data. I filtered the data to only show the 7 months of 2022 for Boston’s Logan Airport.
I preferred using the scattered plot graph as we did in class as I felt that works the best for diverse datasets. With D3 especially, you can customize your visualization as much as you want. Another reason is that the click and hover functions are best showcased in this graph form.
Once I had parsed the data and coded for the click function, I wanted to code the hover function to show the percentage delay when you are on the dots. I tried multiple different codes, specifically the tooltip function in D3 to try and achieve it. But every approach broke my code. I even tried an if else statement with color scales to try and differentiate. The last thing I tried was to have the tooltip appear at least below the graph. It partially worked as the data didn’t parse as the text from the dataset but as undefined.
Firstly, I have learned that you must spend a good amount of time to thoroughly review your data and clean it up to suit your needs. If you don’t do so, you might realize halfway through your code that it is not the best showcase piece. Second thing is that always leave time to try alternate approaches to the code. I still didn’t have enough time to try every method to make my code work the way I visualized it. Lastly, always check and recheck your links. Many a time, html/css/js links work in your system, but might not, for some odd reason, in another computer. All I had to do is refresh my code and maybe once, repasted the link in my code.