Wise Fool.
Visioneer.
triangle(
levels,
)
triangle(
levels,
{caption: "Pascal’s triangle"},
pascal(levels)
)
triangle(
levels,
{caption: `Twofold ${levels}–${2 * levels} → pitch sequence: ${scale}`},
tetraktys(levels)
)
raw = (row, col) => `${row},${col}`
// 1. map raw coordinates to Pascal’s coordinates
// 2. calculate and return Pascal’s triangle value
pascal =
(levels) =>
(row, col) =>
pt(levels - row + col, levels - row)
// tetraktys
// https://en.wikipedia.org/wiki/Tetractys
tetraktys =
(levels) =>
(row, col) =>
ratio({row: 2 * levels - row - 1, col: 2 * levels - col})
triangle = _.curry(
(levels, options = {}, data = x => x) =>
tri(options)(set4(levels)(data))
)
aap = set4(levels)((row,col)=>Fraction(2 * levels - row - 1, 2 * levels - col)).map(k => k.value)
aap.map(f => f.mul(lcm(...aap.map(k => k.d))))
scalePlot(aap)
set4 = (
(levels) =>
(valuator = raw) =>
d3
.range(levels)
.map(
(row) =>
d3
.range(row + 1)
.map(
(col) => ({
row,
// start each row one more to the left
// step columns 2
// col: levels - row + 2 * col - 1,
col,
value: valuator(row, col),
})
)
)
.flat())
diatonicScaleSample = s .map(f => Fraction(f))
diatonicScaleLCM = lcm(...diatonicScaleSample.map(f => f.d))
diatonicNaturals = diatonicScaleSample.map(f => f.mul(diatonicScaleLCM).n)
diatonicScaleSample.map(f => Object.assign(
f,
{
natural: f.mul(24).n,
}
))
ratios = (scale) => {
const fractions = scale.map(f => Fraction(f));
const d = lcm(...fractions.map(f => f.d));
const naturals = fractions.map(f => f.mul(d).n);
const extent = d3.extent(naturals);
const data = naturals.map((x, i) => ({x, ...fractions[i]}));
return ({
scale,
fractions,
d,
naturals,
extent,
data,
})
}
ratios(s)
s = [
1/1,
9/8,
5/4,
// 4/3,
33/24,
3/2,
5/3,
15/8,
2/1,
]
scalePlot2(ratios(s))
scalePlot2 = (scale) => Plot.plot({
x: {
domain: scale.extent,
ticks: 4 * scale.naturals.length,
grid: true,
},
y: {axis: null},
height: 9*15,
width,
marks: [
// Plot.ruleY([0], {stroke: "red"}),
Plot.dot(scale.data, {
frameAnchor: "bottom",
x: "x", fill: "black", r: 6
}),
Plot.tip(scale.data, {
x: "x",
frameAnchor: "bottom",
fontFamily: "monospace",
title: jet(scale),
}),
]
})
jet =
(scale) =>
({n, d}, i) =>
[
`r: ${n}:${d}`,
`n: ${scale.naturals[i]}/${scale.d}`,
`f: ${(n / d).toFixed(2)}`,
`¢: ${(cent(n / d)).toFixed(0)}`
]
.join("\n")
jet({n:30, d: 24}, 0)
scale
ratios([3,4,5])
naturalized = diatonicScaleSample.map(f => f.mul(diatonicScaleLCM))
scalePlot(diatonicScaleSample)
scalePlot = (scale) => {
const d = lcm(...scale.map(f => f.d));
const naturals = scale.map(f => f.mul(d).n);
const n = naturals.map(x => ({x,y:0}));
// return naturals.map(x => ({x,y:0}));
const length = scale.length;
const e = d3.extent(naturals);
// return e;
// return scale;
// return naturals;
// return n;
// return d;
return Plot.plot({
x: {
domain: [e[0], 2 * e[0]],
ticks: 2 * length,
},
y: {axis: null,},
// width,
height: 9*6,
width,
marks: [
Plot.dot(n, {x:"x", fill:"black", r: 6}),
Plot.tip(n, Plot.pointer({
x: "x",
title: () => "hoi"
})),
// Plot.tip(naturals)
]
})}
diatonicNaturals.map(x => ({x,y:0}))
scale = scaler(levels)
scaler = (n) => d3.range(n, 2 * n + 1).join(":")
filter([7,13])(d3.range(4,22))
filter =
(omit) =>
(list) =>
list.filter(e => !omit.includes(e))
ratio = ({row,col}) => ({
cleared: Fraction(row,col)
.valueOf()
// .toFraction().replace("/", ":")
,
raw: `${row}:${col}`
})
[settings.fraction]
function pt(row, col) {
if (row === 1 && col === 1) {
return 1;
} else if (col < 1 || col > row) {
return 0;
} else {
return (pt (row - 1, col - 1)) +
(pt (row - 1, col));
}
}
pg =
(valuator = (row, col) => `${row},${col}`) =>
(levels) =>
d3
.range(levels)
.map(
(row) =>
d3
.range(row + 1)
.map(
(col) => ({
row,
// start each row one more to the left
// step columns 2
col: levels - row + 2 * col - 1,
col,
value: valuator(row, col),
})
)
)
.flat()
pg()(4) // generates 10 values
tri = Triangle(settings) // set up Tri (partial application)
Triangle =
({levels, wide, width, background, boxed, margin, rotate}) =>
({x = "col", y = "row", text = "value", caption = `Raw triangle coordinates for ${levels} levels`} = {}) =>
(data) =>
Plot.plot({
caption,
marks: [
Plot.cell(data, {
x,
y,
stroke: boxed ? "black" : "none",
fill: background ? "peachpuff" : "none",
}),
Plot.text(data, {
x,
y,
text,
fontSize: 27 - 2 * levels,
rotate,
}),
],
width,
height: width,
marginTop: margin,
marginLeft: margin,
marginBottom: margin,
marginRight: margin,
x: { tickSize: 0, padding: 0, tickRotate: -45, axis: null },
y: { tickSize: 0, padding: 0, tickRotate: -45, axis: null },
style: `transform: rotate(${-rotate}deg); background:transparent;`
})
table = (data) => Inputs.table(data, {width: 320})
Fraction = require("fraction.js@4.0")
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.
