Maps — and other representations of the world.
Public
Edited
Aug 8, 2023
3 forks
39 stars
numbers = {
const k = [
d3.randomNormal.source(d3.randomLcg(40))(2, 0.5),
d3.randomNormal.source(d3.randomLcg(41))(3, 0.3),
d3.randomNormal.source(d3.randomLcg(42))(4, 0.2)
];
return Float64Array.from({ length: 250 }, (_, i) => k[i % 3]());
}
cuts = simple.jenks(numbers, 3) // note: this implementation returns [min, break1, break2, max]
roundBreaks = (numbers, k) =>
d3.pairs(simple.ckmeans(numbers, k)).map(([low, hi]) => {
const p = 10 ** Math.floor(1 - Math.log10(hi.at(0) - low.at(-1)));
return Math.floor(((hi.at(0) + low.at(-1)) / 2) * p) / p;
})
roundBreaks(numbers, 3)
variances = d3.range(1, 20)
.map((k) => ({
k,
intra_sum_squares: d3.sum(simple.ckmeans(numbers, k), (v) => d3.variance(v))
}))
elbowiness = (numbers) => {
const intrass = [
{},
...d3
.range(1, 15)
.map((k) =>
k === 1
? d3.variance(numbers)
: d3.sum(simple.ckmeans(numbers, k), (v) => d3.variance(v))
)
];
return d3
.range(0, intrass.length - 1)
.map((k) =>
k < 2
? NaN
: Math.log(intrass[k - 1]) +
Math.log(intrass[k + 1]) -
2 * Math.log(intrass[k])
);
}
autoK = (numbers) =>
d3.maxIndex(elbowiness(numbers), (score, k) => score / (1 + Math.sqrt(k)))
autoK(numbers)
{
const values = new Map(gdp.map((d) => [d.country, d.gdp_per_capita]));
return Plot.plot({
color: {
legend: true,
scheme: "Cool",
type: "threshold",
domain: roundBreaksLog(
gdp.map((d) => d["gdp_per_capita"]),
k_gdp_log
),
width: Math.sqrt(k_gdp_log) * 100,
tickFormat: (d) => d / 1000,
label: "GDP per capita (dollars, thousands)",
unknown: "#ccc"
},
projection: "equal-earth",
marks: [
Plot.geo(
countries,
Plot.centroid({
fill: (d) => values.get(d.properties.a3),
stroke: "white",
title: (d) => `${d.properties.a3}\n${values.get(d.properties.a3)}`,
strokeWidth: 0.5,
tip: true
})
),
Plot.sphere()
]
});
}
roundBreaksLog = (numbers, k) =>
d3
.pairs(
simple.ckmeans(
numbers.map((d) => Math.log(d)),
k
)
)
.map(([low, hi]) => {
const a = Math.exp(hi.at(0));
const b = Math.exp(low.at(-1));
const p = 10 ** Math.floor(1 - Math.log10(a - b));
return Math.floor(((a + b) / 2) * p) / p;
})
import { countries } from "@visionscarto/geo"
breaks = roundBreaksLog(
gdp.map((d) => d["gdp_per_capita"]),
k_gdp_log
)
simple = require("simple-statistics@7")
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.
