//
chartConfig = ({
radiusSize: 20,
padding: 2
})
data = fetch(
`https://data.cityofnewyork.us/resource/25th-nujf.json?$limit=2000&$where=rnk <= ${maxRank}&brth_yr=${selectedYear}`
).then((response) => response.json())
playNote = note => {
synth.triggerAttackRelease(note, "8n");
}
// Create notes off of name count...
freq = d3
.scaleQuantize()
.domain(d3.extent(data.map(d => d.cnt)))
.range(outNotes)
freqWithKey = key =>
d3
.scaleQuantize()
.domain(d3.extent(data.map(d => d.cnt)))
.range(noteRange(key)(`${key}2`, `${key}8`))
outNotes = noteRange("c")("C2", "C8")
now = Tone.now()
// Create keys based off of categories
key = d3
.scaleQuantize()
.domain(ethnicGroups)
.range(["c", "g", "a", "f"])
frequencyScales = {
let scales = new Map();
for (let group of ethnicGroups) {
console.log(freqWithKey(key(group)));
debugger;
const noteScale = freqWithKey(key(group));
scales.set(group, noteScale);
}
return scales;
}
// Create notes from scale
noteRange = note => Tonal.Scale.rangeOf(`${note.toUpperCase()} major`)
Tonal = import("https://cdn.jsdelivr.net/npm/tonal@6.4.1/+esm")
import { checkbox } from "@jashkenas/inputs"
import {text} from "@jashkenas/inputs"
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.
