Public
Edited
Aug 3, 2023
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
categorical = ["#4b94d8", "#f0a70a", "#65d0d7", "#518c31", "#fbd82d", "#d17b95"]
Insert cell
reference = ({ light: "#d5d5d5", dark: "#484848" })
Insert cell
ref = dark ? reference.dark : reference.light
Insert cell
Insert cell
Insert cell
Insert cell
olympians_age = tidy.tidy(
olympians,
tidy.mutate({
age: (d) =>
(date_opening_ceremony.getTime() - d.date_of_birth.getTime()) /
(1000 * 60 * 60 * 24 * 365.25)
})
)
Insert cell
sportCount = tidy.tidy(
olympians,
tidy.groupBy("sport", tidy.summarize({ count: tidy.n() })),
tidy.arrange(tidy.desc("count"))
)
Insert cell
countCutoff = sportCount[5].count
Insert cell
sportCutoff = tidy.tidy(
sportCount,
tidy.mutate({
sportCategory: (d) => (d.count >= countCutoff ? d.sport : "other")
}),
tidy.select(["sport", "sportCategory"])
)
Insert cell
olympians_binned = tidy.tidy(
olympians_age,
tidy.leftJoin(sportCutoff, { by: "sport" })
)
Insert cell
domainSport = sportCutoff
.map((d) => d.sportCategory)
.filter((x, i, arr) => arr.indexOf(x) === i)
Insert cell
date_opening_ceremony = new Date("2016-08-05")
Insert cell
Insert cell
tidy = import("https://unpkg.com/@tidyjs/tidy@2.5.2/dist/es/index.js?module")
Insert cell
import { toSVG } from "@fil/plot-figure-to-svg"
Insert cell
import { inputMode, invokeMode, styleDark } from "@ijlyttle/dark-mode-input"
Insert cell
invokeMode(dark)
Insert cell
styleDark()
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