2d:null 2e:["$","title",null,{"children":"SVG text position attributes | Christian Wilcox | Observable"}] 33:[] 31:{"id":"3ca1b6e1136fa2c6","slug":"svg-text-positional-attributes","title":"SVG text position attributes","thumbnail":"e4efa72dc728e8c413649aeacd5488f1ee88ec314078f4492067ff56bba6d9c8","access_level":"public","create_time":"$D2018-09-26T12:25:44.252Z","update_time":"$D2022-02-23T02:00:22.746Z","view_time":null,"first_public_time":"$D2018-09-26T13:48:53.642Z","has_unpublished_edits":null,"fork":false,"stars":9,"starred":false,"owner":{"type":"team","id":"735c6ab969f7c460","login":"cw","name":"Christian Wilcox","avatar_url":"https://avatars-next.observableusercontent.com/368b113ade86a6e356457fa1261dbc0a8f5385612c10809be6aa5d0f98fb0643","tier":"starter_2024"},"version":58,"publish_version":58,"role":null,"authored":false,"authors":[{"type":"individual","id":"d860027f59f6cb70","login":"cw","name":"Christian Wilcox","avatar_url":"https://avatars-next.observableusercontent.com/368b113ade86a6e356457fa1261dbc0a8f5385612c10809be6aa5d0f98fb0643","tier":null}],"members":[{"type":"individual","id":"d860027f59f6cb70","login":"cw","name":"Christian Wilcox","avatar_url":"https://avatars-next.observableusercontent.com/368b113ade86a6e356457fa1261dbc0a8f5385612c10809be6aa5d0f98fb0643","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":3,"collection":{"id":"d8dadca5ed3ab33f","slug":"svg-exploration","title":"Exploring SVG 💯","owner":{"id":"735c6ab969f7c460","login":"cw","name":"Christian Wilcox"}},"type":"notebook","body":{"title":"SVG text position attributes","cells":[{"id":0,"value":"md`# SVG text position attributes`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":6,"value":"svg``","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":19,"value":"viewof textAnchor = radio({\n options: [\"start\", \"middle\", \"end\", \"inherit\"],\n value: \"middle\",\n title: \"text-anchor\",\n description: \"Horizontal axis\"\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":8,"value":"viewof alignmentBaseline = radio({\n title: \"alignment-baseline\",\n options: [\n \"auto\",\n \"baseline\",\n \"before-edge\",\n \"text-before-edge\",\n \"middle\",\n \"central\",\n \"after-edge\",\n \"text-after-edge\",\n \"ideographic\",\n \"alphabetic\",\n \"hanging\",\n \"mathematical\",\n \"inherit\"\n ],\n value: \"middle\",\n description: \"Vertical axis\"\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":46,"value":"viewof fontFamily = {\n const form = html`

\n \n \n`;\n form.text.oninput = () => (form.value = form.text.value);\n form.select.onchange = () => {\n if (form.select.value === \"Other\") {\n form.text.style.display = \"inline\";\n form.text.select();\n form.value = form.text.value;\n } else {\n form.text.style.display = \"none\";\n form.value = form.select.value;\n }\n form.dispatchEvent(new CustomEvent(\"input\"));\n };\n form.select.onchange();\n return form;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":52,"value":"html``","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":9,"value":"import {radio, select} from \"@jashkenas/inputs\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W33","stdlib":"1","titling":"auto"}} 32:"$31:body"