NASCAR Winners Plot with Menu
This interactive scatter plot displays NASCAR race statistics, comparing race years against selectable metrics such as start position, payout, track length, or caution flags. A dropdown menu updates the y-axis attribute dynamically, while circle color encodes track name and size encodes race length. Built with React and D3 v5, it uses scaleLinear, scaleOrdinal, and CSV-loaded race data with SVG rendering for marks and axes.
AI-generated descriptionThis visual use D3.js and React to display a scatter plot using multiple channels and add a menu to choose different fields in the dataset for visualization. The Data used here is the ILINet Flu Surveillance Dataset.
In this ILINet Flu Surveillance dataset, we have ILITOTAL to indicate the number of patients recorded by the network. The %UNWEIGHTED ILI is actually the ratio to total number of patients served. Clearly this value could be large if the base numbers are small. In the single plot, we show all data by the week of the year since 2015. Each data point represent a state on the same week, different color indicates different years. We also assigned the ILITOTAL number to the size channel, which maps the bigger size to larger number of patients. From the plot we can see that the big size mostly happens at the end of the year till at the beginning of the year, which is the flu season. Although the %ILI data indicates similar results, the size gives more sharper results. Also the points at the bottom of the weeks are all smaller, which allows us to visualize the bigger patients’ number more easily on the plot, it happens on both end of each week’s line because the data with smaller number of patient are generally ignorable.
This plot is comparable with original visualization that uses the vega-lite-api.
The original data comes from the webpage: CDC FluView Interactive.