The avatar for @cpietsch
Christopher Pietsch
Visualization, Prototypes, ML, Data wrangling and Art.
Public
Edited
May 18, 2021
1 fork
3
Insert cell
Insert cell
Insert cell
dataCsv
Insert cell
dataCsv.columns
Insert cell
columns = dataCsv.columns.map(formatKey)
Insert cell
formatKey = d => d.replace(/\r/g,"").replace(/\n/g," ").replace(/- /g,"").replace(/\"/g,"").normalize()
Insert cell
data = dataCsv
.filter(d => d[1] != "")
.map(d => (d[11] = parseNumber(d[11]), d))
Insert cell
parseNumber = d => parseInt((""+d).replace(/,/g, "").split(".")[0]) || undefined
Insert cell
parseNumber("61,876,000.00")
Insert cell
dataLookup = new Map(data.map(d => [d[1], d]))
Insert cell
budgets = data.map(d => d[11])
Insert cell
budgedScale = d3.scaleLog().range([5,40]).domain(d3.extent(budgets)).clamp(true)
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Type JavaScript, then Shift-Enter. Ctrl-space for more options. Arrow ↑/↓ to switch modes.

Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
sectorsBudget = d3.rollup(data.filter(d => d[11] > 0),v => d3.sum(v, d=>d[11]), d => d[6], d => d[4])
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
import {chart as zoomCircle } with { pack, height, sectors as data } from "@d3/zoomable-circle-packing"
Insert cell
Insert cell
md`# Verhältnisse`
Insert cell
Insert cell
stackedData = d3.stack().keys(Object.keys(sectorsColors))(draftsSelection.map(d => d.balance))
Insert cell
Insert cell
x = d3.scaleLinear()
.domain([0, d3.max(stackedData, d => d3.max(d, d => d[1]))])
.range([0, width])
Insert cell
y = d3.scaleBand()
.domain(draftsSelection.map(d => d.name))
.range([0, height])
.padding(0.08)
Insert cell
//d3.rollup(committees[0].lobbies,v => v.length, d => sectorLookup.get(dataLookup.get(d)[5]))
Insert cell
Insert cell
height = width
Insert cell
Insert cell
import {fileInput} from "@mbostock/file-input"
Insert cell
import {swatches} from "@d3/color-legend"
Insert cell
d3 = require("d3@6")
Insert cell

One platform to build and deploy the best data apps

Experiment and prototype by building visualizations in live JavaScript notebooks. Collaborate with your team and decide which concepts to build out.
Use Observable Framework to build data apps locally. Use data loaders to build in any language or library, including Python, SQL, and R.
Seamlessly deploy to Observable. Test before you ship, use automatic deploy-on-commit, and ensure your projects are always up-to-date.
Learn more