-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
64 lines (58 loc) · 4.02 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
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Patterns of Mass Shootings in the US</title>
<link rel="icon" type="image/x-icon" href="https://graphics/favicon.ico">
<meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no" />
<link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/leaflet.css"
integrity="sha256-kLaT2GOSpHechhsozzB+flnD+zUyjE2LlfWPgU04xyI=" crossorigin="" />
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Archivo&family=Archivo+Black&display=swap" rel="stylesheet">
<link href="css/styles.css" rel="stylesheet">
</head>
<body>
<h1 id="title">Shots Fired: Mapping the Patterns of Mass Shootings in the US | 1966 – 2020</h1>
<h2 id="modal-button">Info</h2>
<div id="map"></div>
<div id="ui-controls">
<label for="slider"></label>
<input id="slider" type="range" min="1966" max="2020" value="2020" step="1" class="year-slider">
</input>
<span id="current-year">2020</span>
<button id="all-shootings-toggle">All Shootings 1966-2020</button>
</div>
<div id="modal">
<div class="container">
<span>
×
</span>
<h3>A Data-Driven Approach to Understanding the Impacts of Gun Laws and Gun Ownership on Mass Shooting Incidents</h3>
<p>Public discourse around mass shootings and firearm legislation is rife with consternation. Yet this sensitive subject is of concern to all Americans that people common spaces.</p>
<p>In treading into the public arena to discuss such a complex subject, one ought to have an educated opinion. And in informing oneself, the benefit of cold, hard data is undeniable.</p>
<hr><br>
<p>I built this interactive map to allows users to explore patterns arising over time between gun law data, gun ownership data, and mass shooting data, so that they can come to their own conclusions.</p>
<p>The data visualized in this map is certainly not comprehensive, but rather offers a limited overview of a complex matter. I encourage users to do their own research, explore the data source listed herein, and be wary of jumping to conclusions.</p>
<p><a href="https://github.com/phillipashford/us-mass-shootings-1966-2022/blob/main/README.md">Click here</a> to learn more about this project on Github</p>
<h3>About the Data</h3>
<p>
The gun ownership* and gun law data visualized in this map was acquired from the <a href="https://www.rand.org/pubs/tools/TL354.html">Rand Corporation</a> | <a href="data/TL-354-State-Level%20Estimates%20of%20Household%20Firearm%20Ownership.csv">See the data</a></p><small>* Gun ownership rates as depicted in this map are <b>estimates</b> of the proportion of adult, non-institutionalized residents who live in a household with a firearm.</small>
<p>The mass shooting data visualized in this map was acquired from <a href="https://www.theviolenceproject.org/">The Violence Project</a> | <a href="https://www.theviolenceproject.org/contact-us/">See the Data</a></p>
<p>
The state polygons were created from shapefiles retrieved from <a
href="https://www.naturalearthdata.com/">Natural Earth</a>, an open repository offering free vector and raster
map data in the public domain.
</p>
<div class="footer"><p><a id="modal-footer" href="https://github.com/phillipashford"></a></p></div>
</div>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/PapaParse/5.3.1/papaparse.min.js"></script>
<script src="https://unpkg.com/[email protected]/dist/leaflet.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/chroma-js/2.1.2/chroma.min.js"
integrity="sha512-8TVPS0EFkkmtT6yPb5K4csnSt3tjbKRrs0F8gvTNKv2OxOcwDO7+Klkz86gMVrzfqtZos5N2a+k+r9D+hlccmQ=="
crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script src="data/violence-project-data.js"></script>
<script src="js/app.js"></script>
</body>
</html>