-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
74 lines (69 loc) · 2.78 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<div>
<h1 style="text-align:center;color:black;font-family:sans-serif;font-size:300%">Gun Violence Stats in USA in Last 3 Years</h1>
</div>
<link rel="stylesheet" type="text/css" href="index.css">
<script src="GunDashboard.js"></script>
<script src="MonthlyCase.js"></script>
<script src="CountyDetail.js"></script>
<script src='https://d3js.org/d3.v5.min.js'></script>
<script>
var data1 = null;
</script>
</head>
<body>
<div class="tab">
<button class="tablinks" onclick="ShowPage(event, 'Overview')">Gun Violence highlight across the Country</button>
<button class="tablinks" onclick="ShowPage(event, 'MonthlyCase')">Gun Violence cases by Month/State</button>
<button class="tablinks" onclick="ShowPage(event, 'CountyDetail')">Gun Violence cases by County/State</button>
</div>
<div id="Overview" class="tabcontent">
<div id="tooltip" >Hello</div>
<p>Gun violence in the United States results in tens of thousands of deaths and injuries annually and was the leading cause of death for children 19 and younger in 2020. More information can be found <a href="https://en.wikipedia.org/wiki/Gun_violence_in_the_United_States">here</a>. Below map of the USA shows an overview of the spread of the cases across the country.
</p>
<hr>
</div>
<div id="MonthlyCase" class="tabcontent">
<div id="tooltip"></div>
<p>This page will give you the ability to analyze the Gun Violence cases in the selected state, month by month, for the last 3 years.
</p>
<hr>
</div>
<div id="CountyDetail" class="tabcontent">
<p>This page will give you the ability to have more granular level of Gun Violence related information for a selected state in the USA. Once you select a state it will list down all the counties that had any cases in last 3 years. If you hover over a specific
county you can see the total number of cases and deaths that county had so far.
</p>
<hr>
</div>
<script>
function ShowPage(evt, visName) {
var i, tabcontent, tablinks;
d3.select("svg").remove();
tabcontent = document.getElementsByClassName("tabcontent");
for (i = 0; i < tabcontent.length; i++) {
tabcontent[i].style.display = "none";
}
tablinks = document.getElementsByClassName("tablinks");
for (i = 0; i < tablinks.length; i++) {
tablinks[i].className = tablinks[i].className.replace(" active", "");
tablinks[i].className = tablinks[i].className.replace(" active", "");
}
document.getElementById(visName).style.display = "block";
if(evt!==0)
evt.currentTarget.className += " active";
if(visName==='CountyDetail')
CountyDetail.display();
if(visName==='MonthlyCase')
MonthlyCase.display();
if(visName==='Overview')
{
overview.display();
tablinks[0].className += " active";}
}
ShowPage(0,'Overview');
</script>
</body>
</html>