generated from CMU-Vis-2021/a3-template
-
Notifications
You must be signed in to change notification settings - Fork 1
/
index.html
51 lines (37 loc) · 2.25 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="favicon.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Visualizing Wildfires in the US</title>
<link rel="stylesheet" href="./style.css" />
</head>
<body>
<h1>How have human-made fires changed over the years?</h1>
<h2>Most fire incidents are concentrated to the west of the country. That hasn't changed in the past two decades.</h2>
<input type="range" min="2000" max="2018" value="2000" class="slider" id="myRange">
<span style = "text-align: left;width: 50%;display: inline-block;">2000</span><span style = "text-align: right;width: 50%;display: inline-block;">2018</span>
<p class = "yearLabel">Year shown: <span id="yearShown">2000</span></p>
<div id="my_dataviz"><p class= "hover-instruct"><img class="icon" alt = "search icon" src = "assets/search.svg">Hover for more information</p></div>
<hr class="state-separater">
<h2> <b> What are the most popular causes of fires that burned > 25,000 acres in your state between 2000 - 2018? </b> </h2>
<p class="choose">Choose a state from the dropdown box. </p>
<select id="stateSelect"></select>
<div id="state">
<svg id = "legend" width = "200" height = "370">
</svg>
</div>
<div id="">
<p class="choose"><img class="icon" alt = "search icon" src = "assets/search.svg">Hover for more information</p>
<div id="hover_Text"></div>
</div>
<hr class="state-separater">
<!-- This script takes the data and puts it through d3 -->
<script type="module" src="./main.js"></script>
<footer>
<p> Data for these visualizations from US Forest Service's <a href="https://www.fs.usda.gov/rds/archive/Catalog/RDS-2013-0009.5">Spatial Wildfire Occurence Data for The United States</a>. The dataset was filtered to showcase fires that burned more than 25,000 acres and that were caused by human activity. <br> <br> Interactive data visualizations designed by <b> Swetha Kannan </b> and <b> Katelyn Morrison </b> You can view our code on <a href="https://github.com/CMU-Vis-2021/assignment-3-environment-viz">GitHub</a>.
</p>
</footer>
</body>
</html>