Public
Edited
Apr 21, 2023
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
AW_ban = [new Date(1994,9,13), new Date(2004,9,13)]
Insert cell
parseDate = d3.timeParse("%m/%d/%Y");
Insert cell
Insert cell
Insert cell
max_death = d3.max(ms_data, d=> d.deaths)
Insert cell
min_death = d3.min(ms_data, d=> d.deaths)
Insert cell
regEx = /semi|automatic|assault/;
Insert cell
Insert cell
ms_data = data_raw.map( d => ({
label: d.case,
date: parseDate(d.date),
deaths: d.fatalities,
total_victims: d.total_victims,
weapon_ban: regEx.test(d.weapon_type.toLowerCase()),
age: d.age_of_shooter < 21,
mh: d.prior_signs_mental_health_issues.toLowerCase() === "yes",
date_label: d.date
}))
Insert cell
d3 = require("d3@6")
Insert cell
chart_param = ({
width: width,
height: width / 2,
node_size: {
big_node: (22 / 954) * width,
small_node: (7 / 954) * width
},
font_size: 0,
margin: {
top: (65 / 954) * width,
left: (80 / 954) * width,
right: (80 / 954) * width,
bottom: (65 / 954) * width,
big_node: (3 / 954) * width,
small_node: (1 / 954) * width
}
})
Insert cell
html`
<style>
.toolTip {
position: absolute;
display: none;
min-width: 30px;
max-width: 240px;
border-radius: 4px;
height: auto;
background: rgba(250,250,250, 0.9);
border: 1px solid #DDD;
padding: 4px 8px;
font-size: .85rem;
text-align: left;
z-index: 1000;
}
</style>`
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.
Learn more