Public
Edited
Feb 21, 2024
1 star
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
pairs = [[3,5],[5,8],[8,13],[13,21],[21,34],[34,55],[55,89]]
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
function makeQuad(i=0, {k=1/20, scale=width/50, u=8, v=13}={}) {
return [
makePoint(i, {k, scale}),
makePoint(i+v, {k, scale}),
makePoint(i+u+v, {k, scale}),
makePoint(i+u, {k, scale}),
]
}
Insert cell
function makePoint(i=0, {k=1/20, scale=width/50}={}) {
return toCartesian([Math.pow(PHI, i * k) * scale, GA * i]);
}
Insert cell
function makeOutline({i=0, u=8, v=13, k=1/20, scale=width/50}={}) {
// generate a series of points
const points = d3.range(i, i + u + v).map((j) => makePoint(j, {k,scale}))
// Join them by sorting them in angle-order
.sort((a, b) => toPolars(b)[1] - toPolars(a)[1])
return points
}
Insert cell
function makeQuads(n=10, {i=0, k=1/20, scale=50, u=5, v=8}={}) {
return d3.range(i, i+n).map(i => makeQuad(i,{k,scale, u, v}))
}
Insert cell
function toPolars([x,y]) {
return [
Math.sqrt(Math.pow(x,2) + Math.pow(y,2)),
Math.atan2(y, x)
]
}
Insert cell
function toCartesian([r, theta]) {
return [
r * Math.cos(theta),
r * Math.sin(theta)
]
}
Insert cell
function rotate([x,y], d) {
var [r, theta] = toPolars([x,y])
return toCartesian([r, theta + d])
}
Insert cell
function scale([x, y], k) {
return [x*k, y*k]
}
Insert cell
PI = Math.PI
Insert cell
GA = PI * (3 - Math.sqrt(5))
Insert cell
PHI = (1 + Math.sqrt(5)) / 2
Insert cell
import {Scrubber} from "@mbostock/scrubber"

Insert cell

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.
Learn more