Data visualization software enginner: working to make visualization more accessible, equitable, and impactful.
Published
Edited
Aug 21, 2021
4 stars
import { bills } from "@ramonaisonline/anti-trans-bill-tracker"
Inputs.table(bills)
import { SummaryTable } from "@observablehq/summary-table"
SummaryTable(bills)
by_state = aq
.from(bills)
.filter(aq.escape(d => include.includes(d.Status)))
.groupby("State", "Category")
.count()
.derive({
label: aq.escape((d) => d.Category.split(" ").slice(-2).join(" "))
})
statuses = new Set(bills.map(d => d.Status))
chart = {
return addTooltips(
Plot.cell(by_state, {
x: "label",
y: "State",
fill: "count",
title: (d) => d.State + " " + format(d.count) + " \n" + d.Category
}).plot({
width,
marginLeft: 150,
color: {
scheme: "reds"
},
x: {
label:null
},
y: {
label:null
}
}),
{ stroke: "black" }
)
}
format = (n) => (n === 1 ? n + " bill" : n + " bills")
import { aq, op } from "@uwdata/arquero"
import { slide, notes, style, keyBindings } from "@mkfreeman/slides"
import { addTooltips } from "@mkfreeman/plot-tooltip"
styles = md`### Styles`
fullscreen_icon = `<svg style="display:inline;" height=15 width = 15><path style="fill:#9d9d9d; opacity:1" clip-rule="evenodd" d="M8.00001 2L3 2H2L2 3L2.00001 8L4.00001 8L4.00001 5.47903L6.93541 8.41443L8.34963 7.00022L5.34941 4L8.00001 4L8.00001 2ZM8.00001 14H13H14V13V8H12V10.6122L9.50723 8.15797L8.10409 9.58317L10.5589 12H8.00001V14Z" fill="currentColor"></path></svg>`
keyBindings
style
html`<style>
h1 {
font-size:1.8em;
}
.slide code {
font-size:3vw;
}
</style>`
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.
