2d:null 2e:["$","title",null,{"children":"SVG Cylinder | Peter Beshai | Observable"}] 33:[] 31:{"id":"43f36d02f807cc7a","slug":"svg-cylinder","title":"SVG Cylinder","thumbnail":"078793e1cbe3ad863deaf67533ef17ddc01745c77915f0ea7b5395a697d5a709","access_level":"public","create_time":"$D2019-09-05T13:10:07.050Z","update_time":"$D2021-04-22T23:50:56.076Z","view_time":null,"first_public_time":"$D2019-09-05T13:43:23.195Z","has_unpublished_edits":null,"fork":false,"stars":4,"starred":false,"owner":{"type":"team","id":"6acf8922a00de1ff","login":"pbeshai","name":"Peter Beshai","avatar_url":"https://avatars-next.observableusercontent.com/db43a100f98fe00872d57f02fe3deb1fe4d5305239db9310ba983a9c7d6efb65","tier":"starter_2024"},"version":154,"publish_version":154,"role":null,"authored":false,"authors":[{"type":"individual","id":"26ab57b8a43a5dda","login":"pbeshai","name":"Peter Beshai","avatar_url":"https://avatars-next.observableusercontent.com/db43a100f98fe00872d57f02fe3deb1fe4d5305239db9310ba983a9c7d6efb65","tier":null}],"members":[{"type":"individual","id":"26ab57b8a43a5dda","login":"pbeshai","name":"Peter Beshai","avatar_url":"https://avatars-next.observableusercontent.com/db43a100f98fe00872d57f02fe3deb1fe4d5305239db9310ba983a9c7d6efb65","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":6,"collection":null,"type":"notebook","body":{"title":"SVG Cylinder","cells":[{"id":0,"value":"md`# SVG Cylinder\n\nGenerate an SVG path of a cylinder\n`\n","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":144,"value":"md`\n\\`\\`\\`js\n\n\\`\\`\\`\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":4,"value":"html``","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":22,"value":"viewof radius = slider({ min: 1, max: 100, step: 1, title: 'Radius' })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":28,"value":"viewof tilt = slider({ title: 'Tilt' })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":56,"value":"viewof height = slider({ min: 1, max: 100, step: 1, title: 'Height' })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":86,"value":"viewof showBox = checkbox({\n options: [{ value: \"on\", label: \"Toggle on bounding box\" }],\n value: \"off\"\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":33,"value":"md`---`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":36,"value":"import {slider, checkbox} from \"@jashkenas/inputs\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":151,"value":"tiltAdjustedHeight = height * Math.cos((tilt * Math.PI) / 2) // thanks @bowguy","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":125,"value":"d = {\n const diameter = radius * 2;\n const rx = radius;\n const ry = Math.round(tilt * radius * 1000) / 1000;\n\n const d = ` M 0,${ry} \n a ${rx},${ry} 0,0,0 ${diameter} 0\n a ${rx},${ry} 0,0,0 ${-diameter} 0\n l 0,${tiltAdjustedHeight}\n a ${rx},${ry} 0,0,0 ${diameter} 0\n l 0,${-tiltAdjustedHeight}\n `\n .replace(/\\s+/g, ' ')\n .trim();\n return d;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W33","stdlib":"1","titling":"auto"}} 32:"$31:body"