30:T439,{ replay7; const n = 5000; const points = Float32Array.from( { length: 2 * n }, d3.randomNormal(height / 2, 60) ); const context = DOM.context2d(width, height); context.translate(30, 30); const r = 2; for (let t = 0; t < 50; t++) { context.fillStyle = "rgba(255,255,255,.2)"; if (t === 49) context.fillStyle = "white"; context.fillRect(-30, -30, width, height); let i; context.beginPath(); for (i = 0; i < n / 2; i++) { context.moveTo(points[2 * i], points[2 * i + 1]); context.arc(points[2 * i], points[2 * i + 1], r, 0, tau); } context.fillStyle = "orange"; context.fill(); context.beginPath(); for (; i < n; i++) { context.moveTo(points[2 * i], points[2 * i + 1]); context.arc(points[2 * i], points[2 * i + 1], r, 0, tau); } context.fillStyle = "lightblue"; context.fill(); yield context.canvas; if (t === 0) await visibility().then(await Promises.delay(500)); rectangleUniformTransport(points, width - 60, height - 60, { strength: 0.2 }); } }31:T458,discUniformTransportBatched = { let indices = [], projection, deltas; // batched return ( points, radius, { dirs = 3, strength = 1, profile = chordAreaInverse } = {} ) => { const n = points.length / 2; if (n !== indices.length) { indices = Uint32Array.from(d3.range(n)); projection = new Float32Array(n); deltas = new Float32Array(2 * n); } const a = 2 * Math.PI * Math.random(); deltas.fill(0); for (let d = 0; d < dirs; d++) { const ap = a + (Math.PI * d) / dirs, sa = Math.sin(ap), ca = Math.cos(ap); for (let i = 0; i < n; i++) projection[i] = ca * points[2 * i] + sa * points[2 * i + 1]; indices.sort((i, j) => projection[i] - projection[j]); for (let k = 0; k < n; k++) { const i = indices[k], ideal = radius * profile(k / (n + 1)), delta = ideal - projection[i]; deltas[2 * i] += ca * delta; deltas[2 * i + 1] += sa * delta; } } for (let i = 0; i < points.length; i++) points[i] += (deltas[i] / dirs) * strength; }; }32:[] 2e:{"title":"Disc Transport","cells":[{"id":0,"value":"md`# Disc Transport\n\nA technique borrowed from Optimal Transport (OT) can help to compute force layouts much faster (and with less parameter tweaking) than the traditional multi-body repulsive approach.\n\nThe method, called sliced optimal transport, is the following:\n1. choose a random axis, and project all the points onto that axis.\n2. order the projected points along the axis\n3. match each projected point with its “ideal position” (the position it would have if the point cloud was already uniformly distributed on the disc: see below)\n4. compute the difference vector between the ideal position and the projected position.\n5. move the original points according to that difference vector.\n\nAs we can see below, in just a few iterations the data is scaled and centered. After a few more steps, the point cloud covers a more or less uniform disc. `","pinned":false,"hidden":false,"mode":"ojs"},{"id":48,"value":"viewof replay = html`