-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathindex.html
108 lines (98 loc) · 4.17 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
<!DOCTYPE html>
<html lang="en">
<head>
<!--meta-->
<meta charset="utf-8">
<title>SARS Outbreak in 2003</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!--style-->
<link href="libs/bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css">
<link href="libs/bootstrap/css/bootstrap-theme.min.css" rel="stylesheet" type="text/css">
<link href="style/theme.css" rel="stylesheet" type="text/css">
<!--script-->
<script src="libs/d3/d3.min.js"></script>
<script src="libs/topojson/topojson.min.js"></script>
<script src="libs/datamaps/datamaps.world.hires.min.js"></script>
<script src="libs/underscore/underscore-min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="libs/bootstrap/js/bootstrap.min.js"></script>
</head>
<body>
<nav class="navbar navbar-inverse navbar-fixed-top">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">SARS Global Outbreak in 2003</a>
</div>
<div id="navbar" class="navbar-collapse collapse">
<ul class="nav navbar-nav navbar-right">
<li><a href="https://en.wikipedia.org/wiki/Timeline_of_the_SARS_outbreak">Timeline</a></li>
<li><a href="http://www.guokr.com/article/436812/">Real Story</a></li>
<li><a href="https://en.wikipedia.org/wiki/Severe_acute_respiratory_syndrome">Wiki</a></li>
<li><a href="http://www.who.int/csr/sars/country/en/">Data Source</a></li>
</ul>
</div>
</div>
</nav>
<div class="container-fluid">
<div class="sidebar">
<div class="top">
<!-- <h3>SARS</h3>
<h5>Severe Acute Respiratory Syndrome</h5> -->
<p>
<b>Severe Acute Respiratory Syndrome (SARS)</b><br>is a potentially fatal airborne viral disease that caused a global epidemic in 2003. SARS first appeared in Canton, China during the winter of 2002. In early 2003, SARS spread worldwide when guests at the Metropark Hotel Kowloon in Hong Kong contracted the virus and travelled abroad. No known transmission has occurred since 2004.
<!-- <br>
SARS is a virus transmitted in droplets that enter the air when someone disease coughs, sneezes, or talks. Fever, dry cough, headache, muscle aches, and difficulty breathing are symptoms. No treatment exists except supportive care. -->
</p>
<p>
The World Health Organization provides data on the number of incidences of SARS during this outbreak. <i>(Note: Cases resulting in death or recovery were not denoted until April 10, 2003)</i>
</p>
<p>
<br><b>Use the date slider</b> to explore the global spread of active cases during the outbreak.
<br><b>Mouseover a country</b> to view the number of cases in that country on the given date.
<br><b>Click on a country</b> to chart its cases over the duration of the epidemic.
</p>
</div>
<!-- <div class="bottom">
<div id="slider"></div>
</div> -->
</div>
<div class="main">
<div class="top">
<div id="datamap"></div>
</div>
<div class="bottom">
<div id="newslider"></div>
</div>
</div>
<div class="left">
<div class="chart">
<div id="worldarea">
</div>
</div>
</div>
<div class="right">
<div class="chart">
<div id="countryarea">
</div>
</div>
</div>
</div>
<!--script-->
<script src="src/slider.js" type="text/javascript"></script>
<script src="src/countryCodeLookup.js" type="text/javascript"></script>
<script src="src/countryNameLookup.js" type="text/javascript"></script>
<script src="src/datamap.js" type="text/javascript"></script>
<script src="src/worldarea.js" type="text/javascript"></script>
<script src="src/countryarea.js" type="text/javascript"></script>
<script src="src/main.js" type="text/javascript"></script>
</body>
</html>