Public
Edited
Nov 3, 2022
table(ckdata, {})
out@3.csv
Type Table, then Shift-Enter. Ctrl-space for more options.
black = d3.map(ckdata, d => d.black)
white = d3.map(ckdata, d => d.white)
asian = d3.map(ckdata, d => d.asian)
hispanic = d3.map(ckdata, d => d.hispanic)
yz = [white, black, asian, hispanic]
y01z = d3.stack()
.keys(d3.range(n))
(d3.transpose(yz)) // stacked yz
.map((data, i) => data.map(([y0, y1]) => [y0, y1, i]))
yMax = d3.max(yz, y => d3.max(y))
y1Max = d3.max(y01z, y => d3.max(y, d => d[1]))
y = d3.scaleLinear()
.domain([0, y1Max])
.range([height - margin.bottom, margin.top])
z = d3.scaleSequential(d3.interpolateBlues)
.domain([-0.5 * n, 1.5 * n])
n = 4 // balck, white, asian, hispanic
height = 500
margin = ({top: 0, right: 0, bottom: 20, left: 0})
import {Legend} from "@d3/color-legend"
import { select } from "@jashkenas/inputs"
import { table } from "@john-guerra/tables"
import {swatches} from "@d3/color-legend"
d3 = require("d3@6")
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.
