The avatar for @natpbs
Nathan
Public
Edited
Jun 20, 2024
Insert cell
Insert cell
Insert cell
mutable torusTemplate = null
Insert cell
Insert cell
Insert cell
mutable rotationTemplate = null
Insert cell
Insert cell
Insert cell
mutable sphereTemplate = null
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
mutable logs = []
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
capPath.at(-1)[0]
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
draggableLog = new Log(Log.levels.debug)
Insert cell
draggableLog.logs.slice(-20)
Insert cell
torusDebug = {
const log = draggableLog;
const view = cloneTemplate(torusTemplate);
const svg = view.querySelector("svg");
const draggables = Array.from(svg.querySelectorAll(".draggable"));
for (const draggable of draggables) {
}
const main = draggables[0];
function drag(dx, dy) {
let { x, y } = main.pos;
x += dx;
y += dy;
x += 50;
x -= 100 * Math.floor(x / 100);
x -= 50;
y += 50;
y -= 100 * Math.floor(y / 100);
y -= 50;
for (const i of [0, 1]) {
for (const j of [0, 1]) {
const { pos } = draggables[i + 2 * j];
pos.x = x + 100 * i;
pos.y = y + 100 * j;
}
}
}
debugMakeDraggable(log, draggables, drag);
return view;
}
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