<!DOCTYPE html>
<html>
<head>
<link rel="preload" href="data/heatmap_2010.csv" as="fetch">
<link rel="preload" href="data/heatmap_2015.csv" as="fetch">
<link rel="preload" href="data/lapd-divisions.geojson" as="fetch">
<link rel="preload" href="data/slopegraph.csv" as="fetch">
<link rel="preload" href="data/types.json" as="fetch">
<link rel="preload" href="images/Assault and Battery.svg" as="image">
<link rel="preload" href="images/Destruction of Property.svg" as="image">
<link rel="preload" href="images/Domestic Disturbance.svg" as="image">
<link rel="preload" href="images/Fraud.svg" as="image">
<link rel="preload" href="images/Homicide.svg" as="image">
<link rel="preload" href="images/Human Trafficking.svg" as="image">
<link rel="preload" href="images/Kidnapping.svg" as="image">
<link rel="preload" href="images/LA_Police.png" as="image">
<link rel="preload" href="images/Other.svg" as="image">
<link rel="preload" href="images/Resisting Arrest.svg" as="image">
<link rel="preload" href="images/Theft.svg" as="image">
<link rel="preload" href="images/becca.png" as="image">
<link rel="preload" href="images/danny.png" as="image">
<link rel="preload" href="images/devin.jpg" as="image">
<link rel="preload" href="images/null.svg" as="image">
<link rel="stylesheet" href="index.css">
</head>
<body>
<svg width="0" height="0">
<linearGradient id="Rates-gradient" gradientUnits="userSpaceOnUse" x1="0" x2="0">
<stop></stop>
<stop></stop>
<stop></stop>
</linearGradient>
</svg>
<header>
<h1 class="text center"><span class="color-main text">Crime</span> in <span class="color-main underline">LA</span></h1>
<nav>
<a
href="#Intro">Intro</a>
<a
href="#Types">Types</a>
<a
href="#Rates">Rates</a>
<a
href="#Simulations">Simulations</a>
<a
href="#Comparison">Comparison</a>
</nav>
</header>
<section id="Intro">
<h2 class="text start">Why do we care about economic state and crime?</h2>
<div
class="flex
horizontal">
<h3>The US economy recently experienced a recession and recovery</h3>
<p>According
to
the
National
Bureau
of
Economic
Research,
the
US
economy
fell
into
the
most
recent
recession
in
2007,
which
ended
in
2009.
There
were
massive
increases
in
unemployment
and
decreases
in
consumer
spending.</p>
<h3>Crime rates are related to the economy</h3>
<h3>Explore this relationship in Los Angeles county</h3>
<p>The
relationship
between
crime
and
the
economy
is
not
linear
across
the
nation,
states,
or
cities.
Using
the
tools
below,
learn
about
crime
in
LA
County
between
2010,
immediately
following
the
recession,
and
2015,
after
the
economy
had
recovered.
Explore
crimes
reported
to
the
LA
Police
Department
(LAPD)
and
compare
crime
rates
in
different
areas
of
the
county.
Run
the
crime
simulator
to
simulate
crimes
in
your
reporting
area
and
examine
heatmaps
of
crime
density.</p>
</div>
<figure>
<img
src="images/LA_Police.png">
<figcaption class="text end">Credit ABC News</figcaption>
</figure>
</div>
</div>
</section>
<section id="Types">
<h2 class="text end">Explore crime reported to the LAPD</h2>
<div
class="flex
horizontal">
<figure>
<svg class="tree"></svg>
<figcaption class="text start">Crime Type Mappings</figcaption>
</figure>
</div>
<p>Crimes
reported
to
the
LAPD
are
recorded
in
their
database,
which
is
made
publicly
available
for
reported
crimes
from
2010
until
present.
They
have
136
unique
crime
codes
to
describe
different
types
of
crime.
These
crimes
are
described
by
43
categories
that
fall
into
9
groups.</p>
<p>Use
the
tree
to
explore
the
types
of
crimes
and
their
groupings
by
clicking
on
the
tree
to
expand
and
contract
branches.</p>
</div>
</div>
</section>
<section id="Rates">
<h2>Examine crime rates across LA County over time</h2>
<p>Use
the
map
and
graphs
below
to
examine
the
change
of
crime
rates
for
each
of
the
LAPD
reporting
districts.
Click
on
a
region
in
the
map
to
show
overall
changes
in
crime,
crime
rankings
by
percent
change,
and
the
change
in
crime
over
time
(separated
by
type
of
crime).
Compare
the
change
in
overall
crime
for
each
district
in
the
slopegraphs
below
the
map.
Hover
over
a
slopegraph
to
highlight
the
district
or
click
the
region
on
the
map
to
highlight
the
slopegraph.</p>
</div>
<div
class="flex
horizontal">
<h3 class="district"></h3>
<div
class="flex
horizontal">
<div
class="flex
horizontal">
<div
class="text
center">
<span class="crime-2010"></span>
</div>
<div
class="text
center">
<span class="crime-2015"></span>
</div>
</div>
<div
class="flex
horizontal">
<div
class="text
center">
<span class="total-change"></span>
</div>
<div
class="text
center">
<span class="percent-change"></span>
</div>
</div>
</div>
<p>Crime
Type
Ranked
by
Percent
Change</p>
<div
class="ranking"></div>
</div>
</div>
</div>
<div
class="choropleth-container">
<svg class="choropleth"></svg>
<div
class="legend"></div>
</div>
</div>
<div
class="flex
horizontal">
<p>Crime
Type
Ranked
by
Total
Occurence</p>
<svg class="line multi"></svg>
</div>
<div
class="lines-container"></div>
</div>
</section>
<section id="Simulations">
<h2>Simulate crime rates across LAPD reporting districts</h2>
<p>Use
the
crime
simulator
below
to
simulate
crime
rates
in
different
districts.
Select
a
district
from
the
drop-down
menu
and
choose
whether
to
simulate
crimes
on
total
population
or
on
total
reported
crimes
in
the
area.
Select
your
population
or
total
reported
crimes
size
and
press
the
simulate
button
to
generate
a
fresh
simulation.
Hover
over
the
icons
to
explore
the
types
of
crimes
simulated.</p>
</div>
<figure class="simulate"></figure>
</div>
</section>
<section id="Comparison">
<h2>Compare crime density between districts</h2>
<p>Compare
the
density
of
reported
crimes
between
districts
with
the
heatmaps
below.
Compare
the
top
five
crimes
reported
in
each
district
as
you
explore
the
crime
density.
Select
different
districts
or
compare
across
2015
and
2010
by
selecting
options
from
the
drop
down
menus.</p>
</div>
<div
class="flex
horizontal">
<figure class="heat"></figure>
<figure class="heat"></figure>
</div>
</section>
<section id="Time">
<h2>Explore the relationship between time and reported crimes</h2>
<p>Explore
the
patterns
of
reported
crimes
over
time
in
the
barchart
below.
Select
different
crime
categories
from
the
drop
down
menu
and
compare
the
frequency
(height)
and
time
(color)
of
their
occurrence
across
all
months
in
2015.
Compare
crime
rates
and
reporting
times
across
the
different
days
of
the
week.
Why
is
there
an
abnormally
large
number
of
cases
of
Resisting
Arrest
on
Thursdays
in
October?
(Hint:
What
day
of
the
week
was
Halloween
in
2015?).</p>
</div>
<figure class="column stacked multi"></figure>
</div>
</section>
<section id="Team">
<h2>Meet the Team</h2>
</div>
</section>
</article>
<script src="external/heatmap.min.js"></script>
<script src="external/gmaps-heatmap.js"></script>
<script src="index.js" type="module"></script>
</body>
</html>