Public
Edited
Nov 2, 2022
1 star
Insert cell
Insert cell
Insert cell
chartsTable.length ? html`<iframe src="https://ourworldindata.org/grapher/${_.last(chartsTable).slug}" loading="lazy" style="width: 100%; height: 500px; border: 0px none;"/>` : md`please select a row in the table above`
Insert cell
chartsWithLCH = charts.map((row) => {
const color = chromaLib(row.color)
const hue= color.get("hsl.h")
const saturation = color.get("hsl.s")
const lightness = color.get("hsl.l")
return {...row, hue, saturation, lightness}
})
Insert cell
owid
select charts.id as id, charts.slug as slug, title, json_each.value ->> '$.display.color' as color, json_each.value ->> '$.display.name' as variableName from charts, json_each(config, '$.dimensions') where json_each.value ->> '$.display.color' is not null
Insert cell
Insert cell
owid = new DatasetteClient(
"https://owid-datasette-y43qr.ondigitalocean.app/owid"
)
Insert cell
//Inputs.table(variables.query(`SELECT * from variables ${whereClause}`))
Insert cell
import {DatasetteClient} from "@ambassadors/datasette-client"
Insert cell
import {debounce} from "@mbostock/debouncing-input"
Insert cell
chromaLib = require("chroma-js")
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