Public
Edited
Jun 14, 2023
Demographics_incidents.csv
Type Table, then Shift-Enter. Ctrl-space for more options.
tmp2.csv
Type Table, then Shift-Enter. Ctrl-space for more options.
Demographics_incidents.csv
culprits = {
const data = await FileAttachment("Demographics_incidents.csv").csv()
return data.map((d) => {
const country = d["Country"];
const count = d["# of incidents (Culprits)"] > 10 ? d["# of incidents (Culprits)"];
return {country, count};
});
}
tmp1.csv
Type Table, then Shift-Enter. Ctrl-space for more options.
tmp1.csv
Plot.plot({
label: null,
x: {
axis: "top",
label: "← Victims · Number of Incidents (2022 - 2023) · Culprits →",
labelAnchor: "center",
tickFormat: Math.abs
},
// y: {
// axis: "left",
// filter: (d) => (d.count_culprits > 10),
// },
marks: [
// Plot.barX(demographics_incidents, {
// x: "count_culprits",
// y: "country",
// dy: +2,
// sort: { y: "-x" },
// filter: (d) => (d.count_culprits > 10),
// fill: "red",
// }),
Plot.barX(demographics_incidents, {
x: "count_victims",
y: "country",
// dy: -2,
filter: (d) => i < 10,
sort: { y: "-x" },
fill: "blue"
}),
Plot.text(demographics_incidents, {x: "count_victims", y: "country", text: "count_victims", dx: +10}),
// Plot.axisY({
// x: 0,
// filter: (d) => (d.count_culprits > 10),
// }),
// Plot.ruleX([0])
]
})
Plot.plot({
width: 1000,
height: 480,
insetLeft: 50,
insetRight: 50,
r: {range: [0, 30]},
marks: [
Plot.dot(demographics_incidents, Plot.dodgeY({x: "count_culprits", padding: 0}))
]
})
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.
