2c:null 2d:["$","title",null,{"children":"Connections 2 | Fabian Iwand | Observable"}] 32:T60d,viewof points = { const {width, height, count, seed, maxRadius, deltaX, deltaY, scaleDX, scaleDY} = options; const wh = width / 2; const rng = seedrandom('' + seed); const points = Array(count).fill().map((v,i) => [width * rng(), height * rng(), i]); const tree = new quadtree(points); const bar = progress({interval: 250, invalidation}); yield bar; for(let i = 0; i < points.length; i++) { points[i][3] = (nearest(points[i], maxRadius) || [])[2]; await bar.progress(i+1, points.length); } bar.resolve(points); // Condition: y2 > y function nearest(p, r = Infinity) { let data = null; const [x, y] = p, ix = x/width, iy=y/height; const sx = scaleDX(ix,iy), sy = scaleDY(ix,iy); let left = x - r, right = x + r, top = y, bottom = y + r; tree.visit((node, nx0, ny0, nx1, ny1) => { if(node.length) return nx1 < left || nx0 > right || ny1 < top || ny0 > bottom; let n = node; do { if(n.data === p) continue; const [x2,y2] = n.data; // Warning: Removing this check causes circular parents. if(y2 <= y) continue; const dx = Math.abs(x2 - x) * sx, dy = Math.abs(y2 - y) * sy; if(deltaX >= 0 ? dx < deltaX : -dx < deltaX) continue; if(deltaY >= 0 ? dy < deltaY : -dy < deltaY) continue; const r2 = Math.sqrt(dx ** 2 + dy ** 2); if(r2 >= r) continue; r = r2; data = n.data; left = x - r; right = x + r; top = y - r; bottom = y + r; } while(n = n.next); }); return data; } }33:[] 30:{"id":"f94277ce019aab71","slug":"connections-2","title":"Connections 2","thumbnail":"3c2116782c089c41e34e26ffa4a53f718a42becff185725fe9528e660f046090","access_level":"public","create_time":"$D2018-11-13T21:28:21.802Z","update_time":"$D2020-08-21T08:04:16.380Z","view_time":null,"first_public_time":"$D2018-11-13T22:09:50.552Z","fork":{"id":"9b6a23da338c11b4","slug":"connections-1","title":"Connections 1","owner":{"id":"898d35f8860c7f03","login":"mootari","name":"Fabian Iwand"}},"stars":36,"starred":false,"owner":{"type":"team","id":"898d35f8860c7f03","login":"mootari","name":"Fabian Iwand","avatar_url":"https://avatars-next.observableusercontent.com/0d7defa821f38094c03bad23b9b360a5364e6e97e21fc238c39ddc48db7994ad","tier":"starter_2024"},"version":506,"publish_version":506,"role":null,"authored":false,"authors":[{"type":"individual","id":"07362516b5994994","login":"mootari","name":"Fabian Iwand","avatar_url":"https://avatars-next.observableusercontent.com/0d7defa821f38094c03bad23b9b360a5364e6e97e21fc238c39ddc48db7994ad","tier":null}],"members":[{"type":"individual","id":"07362516b5994994","login":"mootari","name":"Fabian Iwand","avatar_url":"https://avatars-next.observableusercontent.com/0d7defa821f38094c03bad23b9b360a5364e6e97e21fc238c39ddc48db7994ad","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":true,"trashed":false,"subscribed":null,"forks":14,"collection":{"id":"414312a67ea30ac3","slug":"generative","title":"Generative","owner":{"id":"898d35f8860c7f03","login":"mootari","name":"Fabian Iwand"}},"type":"notebook","body":{"title":"Connections 2","cells":[{"id":0,"value":"md`# Connections 2`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":10,"value":"{\n const pad = 20;\n const lineWidth = 1;\n const bgColor = 'hsl(10,10%,15%)';\n const color = 'hsla(0,0%,100%,.3)';\n \n const {width, height} = options;\n const sx = (width - pad * 2) / width, sy = (height - pad * 2) / height;\n\n const ctx = Object.assign(DOM.context2d(width, height, 2), {\n fillStyle: bgColor,\n strokeStyle: color,\n lineCap: 'round',\n lineJoin: 'round',\n lineWidth\n });\n ctx.fillRect(0, 0, width, height);\n \n const update = points.length / 20 | 0;\n for(let [x, y, i, p] of points) {\n ctx.beginPath();\n ctx.moveTo(pad + sx * x, pad + sy * y);\n while(p != null) {\n ctx.lineTo(pad + sx * points[p][0], pad + sy * points[p][1]);\n p = points[p][3];\n }\n ctx.stroke();\n if(!(i%update)) yield html`${ctx.canvas}
`;\n }\n \n return yield html`

${ctx.canvas}`;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":398,"value":"$32","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":389,"value":"options = ({\n width: 600,\n height: 600,\n count: 30000,\n seed: '2',\n // negative: dn <= |deltaN|\n // positive: dn >= |deltaN|\n maxRadius: 100,\n deltaX: -1,\n deltaY: -20,\n scaleDX: (ix,iy) => 1,\n scaleDY: (ix,iy) => (.5+iy*2),\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":433,"value":"md`---`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":16,"value":"seedrandom = require('seedrandom@3.0')","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":148,"value":"quadtree = (await require('d3-quadtree')).quadtree","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":394,"value":"import {progress} from '@mootari/displaying-progress'","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"}],"files":"$W33","stdlib":"1","titling":"auto"}} 31:"$30:body"