29:null 2a:["$","title",null,{"children":"Harmonograph Exploration | Fabian Gündel | Observable"}] 2f:T53d,viewof config = form(html``)30:[] 2d:{"id":"97ba4680a436c5c8","slug":"harmonograph-exploration","title":"Harmonograph Exploration","thumbnail":"0fd6b025ed8b260231db8590456ab35970de6ca6d668c22d4990b345bc327b33","access_level":"public","create_time":"$D2020-05-11T14:15:50.433Z","update_time":"$D2023-08-04T09:12:24.997Z","view_time":null,"first_public_time":"$D2020-05-12T16:24:26.889Z","has_unpublished_edits":null,"fork":true,"stars":5,"starred":false,"owner":{"type":"team","id":"40fc243da291ec86","login":"sto3psl","name":"Fabian Gündel","avatar_url":"https://avatars-next.observableusercontent.com/389bce2d61aebba762252043b015af9ec5702eefde81634e9db5c593934b7b0e","tier":"starter_2024"},"version":351,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"c7d44ebfc09fccc5","login":"sto3psl","name":"Fabian Gündel","avatar_url":"https://avatars-next.observableusercontent.com/389bce2d61aebba762252043b015af9ec5702eefde81634e9db5c593934b7b0e","tier":null}],"members":[{"type":"individual","id":"c7d44ebfc09fccc5","login":"sto3psl","name":"Fabian Gündel","avatar_url":"https://avatars-next.observableusercontent.com/389bce2d61aebba762252043b015af9ec5702eefde81634e9db5c593934b7b0e","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":4,"collection":null,"type":"notebook","body":{"title":"Harmonograph Exploration","cells":[{"id":0,"value":"md`# Harmonograph Exploration`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"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","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":123,"value":"$2f","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":125,"value":"Object.entries(config).map(entry => entry.join(':')).join(' | ')","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":201,"value":"viewof precision = html``","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"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","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"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","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"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","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"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","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":167,"value":"width = 600","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":213,"value":"time = 100","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":120,"value":"import {form} from \"@mbostock/form-input\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W30","stdlib":"1","titling":"auto"}} 2e:"$2d:body"

First Pendulum

Second Pendulum