d3 = require("d3@5")
data = d3.csv("https://www.sfu.ca/~lha54/exonerees.csv", d3.autoType)
minYear = d3.min(data, d => d.Convicted)
maxYear = d3.max(data, d => d.Convicted)
sumofAge = data.reduce((sum, d) => sum + (d.Age), 0)
countofFemales = data.filter(d => d.Sex === "Female").reduce((count, d) => count + 1, 0)
meanYear = d3.mean(data, d => d.Exonerated)
sdYear = d3.deviation(data, d => d.Exonerated)
medYear = d3.median(data, d => d.Exonerated)
sortByYears = d3.nest()
.key(d => d.Exonerated)
.rollup(v => v.length)
.object(data)
import {vl} from '@vega/vega-lite-api'
vl.markBar()
.data(data)
.encode(
vl.x().fieldQ('Age').bin({maxbins: 20}),
vl.y().count()
)
.render()
VegaLite = require("vega-embed@5")
VegaLite({
data: {values: data},
mark: "bar",
encoding: {
x:{bin: true, field: "Age", type: "nominal"},
y:{aggregate: "count", field: "*", type: "quantitative"},
color: {field: "Race", type: "nominal"}
}
})
VegaLite({
data: {values: data},
mark: "bar",
encoding: {
y:{field: "Race", type: "nominal"},
x:{aggregate: "count", field: "*", type: "quantitative"},
color:{field: "Race", type: "nominal"}
}
})
VegaLite({
data: {values: data},
mark: {type: "line"},
encoding: {
x: {field: "Age", type: "quantitative"},
y: {aggregate: "count", field: "*", type: "quantitative"},
color: {field: "Race", type: "nominal"}
}
})
VegaLite({
data: {values: data},
mark: "bar",
encoding: {
x:{field: "Sex", type: "nominal"},
y:{aggregate: "count", field: "*", type: "quantitative"},
}
})
VegaLite({
data: {values: data},
mark: "bar",
encoding: {
x:{field: "State", type: "nominal"},
y:{aggregate: "count", field: "*", type: "quantitative"},
}
})
VegaLite({
data: {values: data},
mark: "bar",
encoding: {
x:{field: "Worst Crime Display", type: "nominal"},
y:{aggregate: "count", field: "*", type: "quantitative"},
}
})
VegaLite({
data: {values: data},
mark: "bar",
encoding: {
x:{field: "Convicted", type: "nominal"},
y:{aggregate: "count", field: "*", type: "quantitative"},
}
})
VegaLite({
data: {values: data},
mark: "bar",
encoding: {
x:{field: "Exonerated", type: "nominal"},
y:{aggregate: "count", field: "*", type: "quantitative"},
}
})
VegaLite({
data: {values: data},
mark: "bar",
encoding: {
x:{bin: true, field: "Age", type: "nominal"},
y:{aggregate: "count", field: "*", type: "quantitative"},
color:{field: "DNA", type: "nominal"}
}
})
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.
