md`# Second Exercise on Observable: Classification and Colors Will`
d3 = require("d3@5")
topojson = require("topojson-client@3")
NYPD = FileAttachment("NYCPolice.json").json()
county_features = topojson.feature(NYPD, NYPD.objects.NYCPolice)
csv_data = d3.csvParse(await FileAttachment("NYCPolice.csv").text(),({precinct, shape_area, shape_leng}) => [+precinct, [+shape_area/+shape_leng]])
shape_width = Array.from(csv_data.values(), d => d[1][0])
data = Object.assign(new Map(csv_data), {title: ["precinct number", "Width"]})
md`# Linear Scale (Unclassed)`
linear = d3.scaleLinear()
.domain([d3.min(shape_width),d3.max(shape_width)])
.range(["#fee0d2", "#de2d26"])
chart(numericSort(shape_width), linear)
md`# Quantile Classification`
quantile = d3.scaleQuantile()
.domain(shape_width)
.range(["#fee5d9", "#fcae91", "#fb6a4a", "#cb181d"])
chart(numericSort(shape_width), quantile)
md`# Jenks Natural Breaks Classification`
naturalbreaks = simple.ckmeans(shape_width, 3).map(v => v.pop())
jenks = d3
.scaleThreshold()
.domain(naturalbreaks)
.range(["#fee5d9", "#fcae91", "#fb6a4a", "#cb181d"])
chart(numericSort(shape_width), jenks)
md`# Equal Interval Classification (Quantize)`
quantize = d3.scaleQuantize()
.domain([d3.min(shape_width),d3.max(shape_width)])
.range(["#fee5d9", "#fcae91", "#fb6a4a", "#cb181d"])
chart(numericSort(shape_width), quantize)
md`# Threshold`
threshold = d3.scaleThreshold()
.domain([0.05, 0.1, 0.50])
.range(["#fee5d9", "#fcae91", "#fb6a4a", "#cb181d"])
chart(numericSort(shape_width), threshold)
showScaleGrouping(shape_width, {
scaleQuantile: quantile,
scaleThreshold: threshold,
scaleJenks: jenks,
scaleQuantize: quantize,
scaleQuantizeNice: quantize.copy().nice()
})
md`# Annex`
simple = require("simple-statistics@7.0.7/dist/simple-statistics.min.js")
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.
