31:T53d,viewof config = form(html``)32:[] 2f:{"title":"Harmonograph Exploration","cells":[{"id":0,"value":"md`# Harmonograph Exploration`","pinned":false,"hidden":false,"mode":"ojs"},{"id":35,"value":"canvas = {\n const context = DOM.context2d(width, width);\n context.canvas.style.background = \"#fff\";\n context.strokeStyle = \"#636\";\n context.lineWidth = 1;\n context.save()\n context.beginPath()\n\n for (let t = 0; t < time; t += precision) {\n const [x,y] = calculateCoordinates(t)\n const args = [width / 2 + x, width / 2 + y]\n \n t ? context.lineTo(...args) : context.moveTo(...args)\n }\n context.stroke()\n yield context.canvas\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":123,"value":"$31","pinned":false,"hidden":false,"mode":"ojs"},{"id":125,"value":"Object.entries(config).map(entry => entry.join(':')).join(' | ')","pinned":false,"hidden":false,"mode":"ojs"},{"id":201,"value":"viewof precision = html``","pinned":true,"hidden":false,"mode":"ojs"},{"id":189,"value":"{\n const data = []\n for (let t = 0; t < time; t += precision) {\n data.push(calculateCoordinates(t).join(','))\n }\n return data.join(',')\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":4,"value":"function calculateCoordinates (t) {\n const x = calculateX(t)\n const y = calculateY(t)\n \n return [Math.round(x), Math.round(y)]\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":12,"value":"function calculateX (t) {\n const A = width / 4\n const { f1, f2, p1, p2, d1, d2 } = config\n return A * Math.sin(t * f1 + Math.PI * p1) * Math.exp(-d1 * t) + A * Math.sin(t * f2 + Math.PI * p2) * Math.exp(-d2 * t)\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":13,"value":"function calculateY (t) {\n const A = width / 4\n const { f3, f4, p3, p4, d3, d4 } = config\n return A * Math.sin(t * f3 + Math.PI * p3) * Math.exp(-d3 * t) + A * Math.sin(t * f4 + Math.PI * p4) * Math.exp(-d4 * t)\n}\n","pinned":false,"hidden":false,"mode":"ojs"},{"id":167,"value":"width = 600","pinned":false,"hidden":false,"mode":"ojs"},{"id":213,"value":"time = 100","pinned":false,"hidden":false,"mode":"ojs"},{"id":120,"value":"import {form} from \"@mbostock/form-input\"","pinned":false,"hidden":false,"mode":"ojs"}],"files":"$W32","stdlib":"1","titling":"auto"}

First Pendulum

Second Pendulum