-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
143 lines (112 loc) · 8.15 KB
/
Copy pathindex.html
File metadata and controls
143 lines (112 loc) · 8.15 KB
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>
<title>Million Dollar Hoods Maproom v3.2</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- leaflet -->
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.3.1/dist/leaflet.css" integrity="sha512-Rksm5RenBEKSKFjgI3a41vrjkw4EVPlJ3+OiI65vTjIdo9brlAacEuKOiQ5OFh7cOI1bkDwLqdLw3Zg0cRJAAQ==" crossorigin=""/>
<script src="https://unpkg.com/leaflet@1.3.1/dist/leaflet.js" integrity="sha512-/Nsx9X4HebavoBvEBuyp3I7od5tA0UzAxs+j83KgC8PU0kgB4XiK4Lfe4y4cgBtaRJQEIFCW+oC506aPT2L1zw==" crossorigin=""></script>
<!-- jQuery -->
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
<script src="js/libraries/list.min.js"></script>
<!-- data table -->
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.19/css/jquery.dataTables.css">
<script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.js"></script>
<!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script> -->
<!-- bootstrap -->
<!-- <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous"> -->
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<!-- <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script> -->
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
<script src="js/rangeSlider/js/ion-rangeSlider/ion.rangeSlider.min.js" type="text/javascript"></script>
<link rel="stylesheet" href="js/rangeSlider/css/ion.rangeSlider.css">
<link rel="stylesheet" href="js/rangeSlider/css/ion.rangeSlider.skinFlat.css">
<link rel="stylesheet" href="styles/style.css">
</head>
<body>
<div class="container-fluid h-100">
<div class="row h-100">
<!-- left side: map -->
<div class="col-sm fill no-padding">
<div id="map"></div>
<div id="slider-container">
<input type="text" id="slider" name="millionDollarSlider" value="" />
</div><!-- <div class='nav-overlay'></div> -->
</div>
<!-- right side: data -->
<div class="col-sm " id="data-panel">
<br>
<div class='nav-overlay'></div>
<p class="lead" id="data-subtitle"></p>
<div class="">
<ul class="nav nav-tabs" id="myTab" role="tablist">
<li class="nav-item">
<a class="nav-link active" id="prison-tab" data-toggle="tab" href="#prison" role="tab" aria-controls="prison" aria-selected="true">Jail Data</a>
</li>
<!-- charges are turned off for now -->
<!--
<li class="nav-item">
<a class="nav-link" id="charges-tab" data-toggle="tab" href="#charges" role="tab" aria-controls="charges" aria-selected="false">Charges</a>
</li>
-->
<li class="nav-item">
<a class="nav-link" id="rankings-tab" data-toggle="tab" href="#rankings" role="tab" aria-controls="rankings" aria-selected="false">Rankings</a>
</li>
</ul>
<div class="tab-content" id="myTabContent">
<br>
<div class="tab-pane fade show active" id="prison" role="tabpanel" aria-labelledby="prison-tab">
<div style="clear:both" id="stats-content-prison1">
</div>
<div style="clear:both" id="stats-content-prison2"></div>
<h1 class="display-4" id="data-title"></h1>
<div class="container">
<div class="row" id="data-text1">
<div class="alert alert-dark">
On the map to the left, hover your mouse on neighborhoods to learn how much LASD and LAPD spent to incarcerate residents of that community between 2012 and 2017. With each click you will also access supplemental data, such as the leading causes of arrest within each neighborhood and the racial and gender demographics of arrested persons.
</div>
</div>
<div class="row" id="data-text2"></div>
</div>
</div>
<!-- charges turned off for now -->
<!--
<div class="tab-pane fade" id="charges" role="tabpanel" aria-labelledby="charges-tab">
</div>
-->
<div class="tab-pane fade" id="rankings" role="tabpanel" aria-labelledby="rankings-tab">
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Modal -->
<div class="modal fade" id="mdhModal" tabindex="-1" role="dialog" aria-labelledby="mdhModalTitle" aria-hidden="true">
<div class="modal-dialog modal-lg modal-dialog-scrollable" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="mdhModalTitle">Maproom</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<p>The Los Angeles Sheriff’s Department (LASD) operates the <a href="http://shq.lasdnews.net/pages/PageDetail.aspx?id=1716">Los Angeles County Jail system</a>. Comprised of one processing facility (Inmate Reception Center), three men’s jails (Men’s Central Jail, Twin Towers Correctional Facility, Pitchess Detention Center – East, North, South and North County Correctional Facility) and one women’s jail (Century Regional Detention Facility in Lynwood), the L.A. County Jail holds detained adults charged with criminal law violations while awaiting trial or sentenced adult criminal offenders (less than one year). Since the passage of AB 109 (Realignment), persons with prison sentences for non-serious, non-violent or non-sex offenses are also serving time in the L.A. County Jail system.</p>
<p><a href="http://www.lapdonline.org/inside_the_lapd/content_basic_view/6366">Los Angeles Police Department (LAPD)</a> incarcerate persons between arrest and arraignment. After arraignment, persons arrested by LAPD must be released or transferred. The majority of transfers are sent to the L.A. County Jail, which is the central jailing system for L.A. County and most municipalities within the County.</p>
<p>Million Dollar Hoods maps the neighborhoods where LASD and LAPD spent the most on incarceration between 2012 to 2017. The first layer of the map highlights in red all communities where the LASD spent <i>at least</i> $1 million annually to jail residents, amounting to a minimum $6 million investment in incarceration over the study’s six-year period. The second layer of the map highlights the communities where the LAPD spent <i>at least</i> $1 million annually on detention during these same years. The millions of dollars committed to incarceration in the highlighted neighborhoods makes them “Million Dollar Hoods.”</p>
<p>The neighborhood boundaries used on the Million Dollar Hoods Map are based upon the <a href="http://maps.latimes.com/neighborhoods/neighborhood/list/">Los Angeles Times Neighborhood List</a>. These boundaries do not align with LAPD and LASD patrol districts nor do they reflect the many ways residents define their own community. But the Los Angeles Times Neighborhood List covers all of L.A. County and is one of the most <a href="http://maps.latimes.com/about/#the-process">highly-researched, regularly updated, and widely-used</a> set of maps of L.A. neighborhoods.</p>
<p>Sign up for the <a href="https://twitter.com/milliondlrhoods">@milliondlrhoods</a> Twitter feed to receive updates from the Million Dollar Hoods Research Project.</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-primary" data-dismiss="modal">Start Mapping</button>
<!-- <button type="button" class="btn btn-primary">Save changes</button> -->
</div>
</div>
</div>
</div>
<script type="text/javascript" src="js/mdbla.config.js"></script>
<script type="text/javascript" src="js/mdbla.rankings.js"></script>
</body>
</html>