generated from usf-cs360-spring2020/template-bulma
-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
143 lines (123 loc) · 6.13 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="styles.css">
<!-- TODO: Change title -->
<title>Final Project</title>
<!-- Load Bulma from CDN (consider saving it to repository instead) -->
<!-- https://bulma.io/ -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/css/bulma.min.css">
<!-- Load Font Awesome 5 (free) icons -->
<script defer src="https://use.fontawesome.com/releases/v5.3.1/js/all.js"></script>
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
<div id="nav-placeholder">
</div>
<script>
$(function () {
$("#nav-placeholder").load("nav.html");
});
</script>
<!---->
<section class="section">
<div class="container">
<!-- Begin page content -->
<div class="content">
<h1 id="home" class="title">
<!-- TODO: Change page title -->
Topic
</h1>
<!-- TODO: Change page subtitle -->
</p>
<p>For my final project topic, I choose to visualize Covid-19 data set. The reason that I choose this
because more than
4 million people got affected and more than 283 thousand people dead because of coronavirus, people
lost their
loves, daily life changes. I think we should learn our lesson from this epidemic. I will chose to
use a map,
which is the obvious way to show people how bad it is right now. Many maps of the pandemic have been
made,
but I want to incorporate the best features from each and add some of my own to tell the most
accurate story possible.
</a></p>
<hr />
<h4>My Questions</h4>
<ul style="list-style-type:circle">
<li><b>Are we winning the war against COVID-19?</b></li>
<li><b>Which countries have been most effective at bringing COVID-19 under control?</b></li>
<li><b>When can we start to relax social distincing restrictions?</b></li>
</ul>
<p>I want to show the situation on a world map so that anyone can get an intuition for where we
stand.</p>
<hr />
<h4>Answers that I Want to Explore</h4>
<p>As of April 2020, the total number COVID-19 cases worldwide is still increasing very fast. In
some of the worst-hit places the number of daily infections has peaked, while other countries
that avoided the first waves are just beginning to tick up.</p>
<p>A few areas such as Taiwan have done especially well at controlling the spread throughout the
whole crisis. Some, like Singapore, kept numbers under control initially but had an outbreak
later that forced it into a more aggressive lockdown. Others, like South Korea, saw one of the
earliest major outbreaks (outside China) but have successfully controlled it since then.</p>
<p>Some countries show they had second wave of cases, which means we should be err on the side of
caution when reopening. It will also be interesting based on the next month's data to see if
allowing back some activities is safe.</p>
<!--
<h1 id="theme">
Theme
</h1>
<p>The goal of the visualization is to figure out with respect to the number of incidents - the most active battalion, the most active station and response time for the neighboorhood with most number of incidents.</p>
-->
</div>
<!-- End page content -->
</div>
</section>
<!-- Page footer -->
<!-- https://bulma.io/documentation/layout/footer/ -->
<footer class="footer">
<div class="content has-text-centered is-size-7">
<p>
<a href="#top">
<span class="fas fa-arrow-up"></span>
<span class="has-text-weight-medium">Back to Top</span>
</a>
</p>
<p>
<!-- TODO: Change to link to your Github repository -->
<a href="https://github.com/usf-cs360-spring2020/midterm-dataviz" target="_blank"
class="button is-small" style="padding-left: 1em; padding-right: 1em;">
<i class="fab fa-github-alt"></i> <strong>Github</strong>
</a>
<a href="https://fontawesome.com/" class="button is-small"
style="padding-left: 1em; padding-right: 1em;">
<i class="fab fa-font-awesome"></i> <strong>FontAwesome</strong>
</a>
<a href="https://bulma.io" class="button is-small">
<img src="https://bulma.io/images/made-with-bulma--semiblack.png" alt="Made with Bulma" width="128"
height="24">
</a>
</p>
</div>
</footer>
<!-- End page footer -->
<!-- Mobile menu responsiveness -->
<!-- https://bulma.io/documentation/components/navbar/ -->
<script>
document.addEventListener('DOMContentLoaded', () => {
const $navbarBurgers = Array.prototype.slice.call(document.querySelectorAll('.navbar-burger'), 0);
if ($navbarBurgers.length > 0) {
$navbarBurgers.forEach(el => {
el.addEventListener('click', () => {
const target = el.dataset.target;
const $target = document.getElementById(target);
el.classList.toggle('is-active');
$target.classList.toggle('is-active');
});
});
}
});
</script>
<!-- End mobile menu responsiveness -->
</body>