This dashboard displays operational taxonomic units (OTU) data for microbes that grow in people's belly buttons.
A GitHub Pages site has been set up for this project here. See above for a screenshot of the site.
The page will load with data for the first Test Subject ID. Data displays include:
- Test subject demographic data (blue card)
- Top 10 OTU present in test subject's navel. (horizontal bar chart)
- A gauge that shows the number of times per week the test subject washes their navel (gauge)
- All OTU present in the test subject's navel (bubble chart)
Hover your cursor over different bars or bubbles on the charts to see the names/labels of the OTUs.
A dropdown menu is provided which will show Test Subject ID Numbers for all test subjects in the dataset. Click the dropdown menu to select a new test subject ID number. Once the number is selected, all graphs, gauges, and demographic data will update to reflect relevant information to that test subject ID number.
This dashboard consists of a horizontal bar chart, a bubble chart, and a gauge chart which are all based on Plotly.
JavaScript D3 is used to make an initial load of a sample data JSON and populate the dropdown menu to show options for every available test subject ID number. D3 is also used to run event handlers so that the page updates whenever a new test subject ID number is selected from the dropdown menu.