Platform
Resources
Pricing
Sign in
Contact us
Taras Novak
I map 🗺️ & graph 📈 data 🈸
Workspace
Fork
Published
Chicago Crimes
By
Taras Novak
Edited
Feb 25, 2019
Fork of
Ridgeline plot
Chicago Crimes
Chicago Crimes Arrow Data Vega-Lite API Viz
Chicago Crimes Arrow Data Vega Viz
Chicago Crimes EDA
Chicago Crimes Treemap
Chicago Crimes Hexgrid Map
Chicago Crimes Ridgeline
Chicago Crimes Apache Arrow Hypergrid
Chicago Crimes by Day
Chicago Crimes Sankey
Chicago Crimes Sunburst, 2018
Chicago Crimes by Location
Chicago Crimes by Ward Flubber
Chicago Crimes in Perspective
Chicago Crimes by Type
Chicago Crimes Heatmap
Leaflet Pixi Overlay
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
data
=
dailyData
Insert cell
Insert cell
Insert cell
dataUrl
=
'https://raw.githubusercontent.com/RandomFractals/ChicagoCrimes/master/data/2018/chicago-crimes-2018.arrow'
Insert cell
dataTable
=
loadData
(
dataUrl
)
.
then
(
buffer
=>
arrow
.
Table
.
from
(
new
Uint8Array
(
buffer
)
)
)
Insert cell
crimeData
=
groupByField
(
dataTable
,
'PrimaryType'
)
Insert cell
dailyCrimes
=
Object
.
keys
(
crimeData
)
.
sort
(
(
a
,
b
)
=>
crimeData
[
b
]
.
length
-
crimeData
[
a
]
.
length
)
// order by crime type counts
.
slice
(
0
,
20
)
// top 20
.
map
(
key
=>
{
return
{
name
:
key
,
daily
:
groupByDay
(
crimeData
[
key
]
,
key
)
}
;
}
)
Insert cell
dailyData
=
{
const
dailyData
=
[
]
;
dailyCrimes
.
map
(
data
=>
{
Object
.
keys
(
data
.
daily
)
.
map
(
day
=>
{
dailyData
.
push
(
{
name
:
data
.
name
,
date
:
new
Date
(
new
Date
(
day
)
.
getTime
(
)
+
timezoneOffset
)
,
value
:
data
.
daily
[
day
]
.
length
}
)
;
}
)
;
}
)
;
return
dailyData
;
}
Insert cell
Insert cell
thefts
=
groupByDay
(
crimeData
[
'THEFT'
]
,
'THEFT'
)
Insert cell
homicides
=
groupByDay
(
crimeData
[
'HOMICIDE'
]
,
'HOMICIDE'
)
Insert cell
function
groupByDay
(
dataArray
,
crimeType
)
{
let
daily
=
{
}
;
dataArray
.
map
(
data
=>
{
const
day
=
data
.
date
.
toISOString
(
)
.
substring
(
0
,
10
)
;
// ISO date string
if
(
!
daily
[
day
]
)
{
daily
[
day
]
=
[
]
;
}
daily
[
day
]
.
push
(
data
)
;
}
)
;
return
daily
;
}
Insert cell
import
{
loadData
,
toDate
}
from
'@randomfractals/apache-arrow'
Insert cell
import
{
groupByField
}
from
'@randomfractals/chicago-crimes-by-type'
Insert cell
arrow
=
require
(
'apache-arrow@0.3.1'
)
Insert cell
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
Try it for free
Learn more
Compare fork
Fork
View
Export
Edit
Add comment
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
chart
Edit
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
overlap
Edit
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
height
Edit
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
margin
Edit
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
x
Edit
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
y
Edit
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
z
Edit
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
xAxis
Edit
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
yAxis
Edit
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
area
Edit
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
line
Edit
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
series
Edit
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
data
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
d3
Edit
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
Edit
Add comment
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
dataUrl
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
dataTable
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
crimeData
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
dailyCrimes
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
dailyData
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
timezoneOffset
Edit
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
thefts
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
homicides
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
groupByDay
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
arrow
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML