Team name: YYJS
Team members:
- Yiwei Yu yiweiyu@usc.edu
- Yang Qian yqian442@usc.edu
- Jiayi Lin jiayilin@usc.edu
- Shihao Lin shihaol@usc.edu
- Project proposal
- Final presentation: Transcript | slides
- Paper: Overleaf read-only link | PDF
- Demo link
- Video Transcript | YouTube link
In 2019, a new coronavirus was identified and had changed humanity's society tremendously. How should we face the “After-COVID-19” era becomes the top issue among almost all people. To respond to the issue, we design a dashboard presenting the trend and degree of the impacts of COVID-19 in three main aspects: public health, education, and economy. Instead of showing the impacts on a single perspective as what has been done by others on the same topic, we made our dashboard original by combining the impact of the COVID-19 crisis on various aspects as a whole. This project is useful for audiences from various countries who would like to know how the pandemic influences their life, and our work enables them to simultaneously compare the burden of COVID-19 in different countries on multiple dimensions.
| Requirement | Label | Done |
|---|---|---|
| responsive d3 chart | responsive | ✅ |
| interactive d3 chart | interactive | ✅ |
| d3 chart with an animated transition | animated | ✅ |
| d3 layout | layout | ✅ |
| d3 map | map | ✅ |
| Mapbox map | mapbox | ✅ |
| Page name | Chart description | Libraries used | Requirement label |
|---|---|---|---|
| Home page | main map | d3, leaflet | Mapbox map,responsive, interactive |
| Home page | scatter plot | d3, bootstrap-vue | d3 chart (responsive, interactive) |
| Health page | Proportional Symbol Map | d3 | d3 map (interactive) |
| Health page | Bar Chart | d3 | interactive d3 chart with an animated transition |
| Health page | Choropleth Map | d3 | d3 map (responsive, interactive) |
| Health page | Pie Chart | d3 | d3 chart (responsive, interactive) |
| Health page | Line Chart | d3 | responsive d3 chart |
| Education page | Dendrogram | d3 | d3 layout（interactive） |
| Education page | Choropleth Map | d3 | d3 map（interactive） |
| Education page | Bar Chart | d3 | interactive d3 chart with an animated transition |
| Education page | Donut Chart | d3 | interactive d3 chart |
| Economy page | Treemap | d3 | d3 layout (interactive) |
| Economy page | Choropleth Map | d3 | d3 map（responsive, interactive) |
| Economy page | Chord Diagram | d3 | d3 layout（responsive, interactive) |
| Type | Count |
|---|---|
| interactive maps | 3 |
| Mapbox | 1 |
| responsive maps | 2 |
| interactive d3 charts | 4 |
| interactive d3 layouts | 2 |
| responsive d3 charts | 3 |
| responsive d3 layouts | 1 |
| d3 layout | 3 |