36:null 37:["$","title",null,{"children":"Untitled | Oiar | Observable"}] 3d:[] 3b:{"id":"13446be02f29c870","slug":"untitled/3","title":"","thumbnail":"c0741eb11593af28a42f1054df2903d106f7521c1b80064114021e5ce2c09699","access_level":"public","create_time":"$D2019-12-28T10:13:14.231Z","update_time":"$D2019-12-29T06:59:18.806Z","view_time":null,"first_public_time":"$D2019-12-29T06:59:57.810Z","has_unpublished_edits":null,"fork":{"id":"18c0a5cbdd74381a","slug":"d3-basics","title":"D3 Basics","owner":{"id":"2a278c3908e45a90","login":"fengyfei","name":"Feng Yifei"}},"stars":0,"starred":false,"owner":{"type":"team","id":"724a9d5ccf258909","login":"oiar","name":"Oiar","avatar_url":"https://avatars-next.observableusercontent.com/a47dea8beeceed2f4005f222dba473cbebc7e0c01f8ee6c053300a18ef20cd10","tier":"starter_2024","bio":"","following":false},"version":735,"publish_version":735,"role":null,"authored":false,"authors":[{"type":"individual","id":"5ed446de4f9df246","login":"oiar","name":"Oiar","avatar_url":"https://avatars-next.observableusercontent.com/a47dea8beeceed2f4005f222dba473cbebc7e0c01f8ee6c053300a18ef20cd10","tier":null,"bio":"","following":false}],"members":[{"type":"individual","id":"5ed446de4f9df246","login":"oiar","name":"Oiar","avatar_url":"https://avatars-next.observableusercontent.com/a47dea8beeceed2f4005f222dba473cbebc7e0c01f8ee6c053300a18ef20cd10","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"titling":"auto","title":"","cells":[{"id":532,"value":"{\n const buttonCN = html`\n \n `;\n \n buttonCN.onclick = () => {\n mutable language = CN\n }\n \n return buttonCN;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":231,"value":"{\n const buttonEN = html`\n \n `;\n \n buttonEN.onclick = () => {\n mutable language = EN\n }\n \n return buttonEN;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":0,"value":"md`\n${language[0]}\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":23,"value":"md`\n${language[1]}\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":6,"value":"html`\n\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":45,"value":"md`\n${language[2]}\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":96,"value":"md`\n${language[3]}\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":81,"value":"svg = {\n return d3.select('svg');\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":102,"value":"md`\n${language[4]}\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":48,"value":"circles = {\n return svg.selectAll('circle');\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":109,"value":"md`\n${language[5]}\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":69,"value":"{\n let counts = 0;\n const onClick = () => {\n if (counts == 0) {\n circles.attr('r', 40);\n } else {\n circles.attr('r', 20);\n }\n counts = (counts + 1) % 2;\n };\n\n const button = html`\n \n `;\n button.onclick = onClick;\n\n return button;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":12,"value":"md`\n${language[6]}\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":18,"value":"md`\n${language[7]}\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":15,"value":"d3 = require('d3')","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":655,"value":"EN = [`# D3 Basics`, \n `## SVG References\n - [Scalable Vector Graphics](https://developer.mozilla.org/en-US/docs/Web/SVG)\n - [SVG element reference](https://developer.mozilla.org/en-US/docs/Web/SVG/Element)\n - [SVG Attribute reference](https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute)\n - [SVG interfaces](https://developer.mozilla.org/en-US/docs/Web/API/Document_Object_Model#SVG_interfaces)`,\n `## D3 \n### Selection\n `,\n `Fetch SVG element via [select](https://github.com/d3/d3-selection/blob/v1.4.1/README.md#select)`,\n `Fetch circle elements via [selectAll](https://github.com/d3/d3-selection/blob/v1.4.1/README.md#selectAll)`,\n `Make some change via [attr](https://github.com/d3/d3-selection/blob/v1.4.1/README.md#selection_attr)`,\n `## Imports`,\n `D3 Version: ${d3.version}`\n ]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":287,"value":"CN = [`# D3 基础知识`, \n `## SVG 参考资料\n - [可缩放矢量图形](https://developer.mozilla.org/en-US/docs/Web/SVG)\n - [SVG 元素参考](https://developer.mozilla.org/en-US/docs/Web/SVG/Element)\n - [SVG 属性参考](https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute)\n - [SVG 接口](https://developer.mozilla.org/en-US/docs/Web/API/Document_Object_Model#SVG_interfaces)`,\n `## D3 \n### 选择\n `,\n `获取 SVG 元素通过 [选择](https://github.com/d3/d3-selection/blob/v1.4.1/README.md#select)`,\n `获取 circle 元素通过 [全选](https://github.com/d3/d3-selection/blob/v1.4.1/README.md#selectAll)`,\n `做一些改变通过 [属性](https://github.com/d3/d3-selection/blob/v1.4.1/README.md#selection_attr)`,\n `## 引进`,\n `D3 版本: ${d3.version}`\n ]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":602,"value":"mutable language = EN","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W3d","stdlib":"1"}} 3c:"$3b:body"