Scatter Plot with Menu for ILINet Flu Surveillance Data
This interactive scatter plot visualizes ILINet flu surveillance data, showing each state as a point positioned by week of the year and a user-selected field (ILI percentage, total patients, or providers), with color encoding year and circle size representing ILI total. A dropdown menu lets viewers switch between data fields for the y-axis. Built with React and D3 v5, the visualization uses `scaleLinear` for axes and sizing, `scaleOrdinal` for colors, and SVG rendering with custom axis components, reading data from a CSV file of CDC FluView records since 2015.
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.