2d:null 2e:["$","title",null,{"children":"x3dom | Andreas Plesch | Observable"}] 33:[] 31:{"id":"28f54d45f93484a3","slug":"x3dom","title":"x3dom","thumbnail":"b84039f48d5feb43e22ff9f33aaae6d376ce4ad39f1744610a5a09534115b04b","access_level":"public","create_time":"$D2018-05-30T18:10:48.773Z","update_time":"$D2022-01-19T01:35:26.596Z","view_time":null,"first_public_time":"$D2018-05-30T18:12:09.632Z","has_unpublished_edits":null,"fork":false,"stars":1,"starred":false,"owner":{"type":"team","id":"3a7167e5e638bcd0","login":"andreasplesch","name":"Andreas Plesch","avatar_url":"https://avatars-next.observableusercontent.com/4da1ba746a4b25e755d1c9b71ca1c72165a9c40e02aee1f3fcae880584d70c9c","tier":"starter_2024"},"version":127,"publish_version":127,"role":null,"authored":false,"authors":[{"type":"individual","id":"171053d51d09c7fc","login":"andreasplesch","name":"Andreas Plesch","avatar_url":"https://avatars-next.observableusercontent.com/4da1ba746a4b25e755d1c9b71ca1c72165a9c40e02aee1f3fcae880584d70c9c","tier":null}],"members":[{"type":"individual","id":"171053d51d09c7fc","login":"andreasplesch","name":"Andreas Plesch","avatar_url":"https://avatars-next.observableusercontent.com/4da1ba746a4b25e755d1c9b71ca1c72165a9c40e02aee1f3fcae880584d70c9c","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":3,"collection":{"id":"fad18253ee738559","slug":"x3dom","title":"x3dom","owner":{"id":"3a7167e5e638bcd0","login":"andreasplesch","name":"Andreas Plesch"}},"type":"notebook","body":{"title":"x3dom","cells":[{"id":0,"value":"md`# x3dom`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":5,"value":"md`How to load x3dom and work with it`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":12,"value":"md`## require code\n\\`\\`\\`js\nrequire('https://x3dom.org/download/dev/x3dom-full.js').catch(() => window.x3dom)\\`\\`\\`\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":124,"value":"md`## require both x3dom.js and x3dom.css`","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":10,"value":"x3dom = {\n await require('https://x3dom.org/download/dev/x3dom-full.debug.js').catch(() => window.x3dom);\n //combine with stylesheet into a single cell since they belong together\n return html``\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":22,"value":"md`## loading default CSS style:\n\nin observable via html link element`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":25,"value":"stylesheet = html``","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":28,"value":"md`## customize css\nfor observable via style element`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":31,"value":"x3dstyleforobservable = html`\n\n`","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":58,"value":"md`## create x3dom reloader`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":60,"value":"reloader = { \n window.x3dom.reload();\n return x3delement; // just to make reactive\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":36,"value":"md`## x3d scene dom\n\nvia html.\n\n** note: styled container div is required to play nice **\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":52,"value":"x3delement=html`\n

\n\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n\n

\n`","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":90,"value":"md`## TODO\n\n- figure out to update x3d dom without reloading (mutable?)\n- try some sliders\n- visualize !`\n","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W33","stdlib":"1","titling":"auto"}} 32:"$31:body"