31:[] 2f:{"title":"Lines on circle example","cells":[{"id":0,"value":"md`# Lines on circle example\n\nReproducing one diagram from https://ciechanow.ski/gears/ but with ObservableHQ`\n","pinned":false,"hidden":false,"mode":"ojs"},{"id":9,"value":"svg``","pinned":true,"hidden":false,"mode":"ojs"},{"id":7,"value":"viewof unwind = slider({\n min: 0, \n max: 1,\n value: 0,\n step: 0.01, \n description: \"Unwind the circle\",\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":35,"value":"viewof num_arcs = slider({\n min: 2, \n max: 10,\n value: 5,\n step: 1,\n description: \"Number of lines\",\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":29,"value":"colored_lines = {\n let svg = \"\";\n for (let i = 0; i < num_arcs; i++) {\n let radius = 50 * i / num_arcs;\n let hue = (i / num_arcs) * 240 | 0;\n let color = `hsl(${360-hue}, 50%, 50%)`;\n let x = radius * Math.cos(unwind * 2*Math.PI), y = -radius * Math.sin(unwind * 2*Math.PI);\n svg += `0.5?1:0},0,${x},${y}\" stroke=\"${color}\" stroke-width=\"1.5\" fill=\"none\"/>`\n svg += ``;\n let horiz = 200*unwind * (i/num_arcs), vert = (i / num_arcs) * 50;\n svg += ``;\n svg += ``;\n }\n return svg;\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":4,"value":"import {slider} from \"@jashkenas/inputs\"","pinned":true,"hidden":false,"mode":"ojs"}],"files":"$W31","stdlib":"1","titling":"auto"}