2e:null 2f:["$","title",null,{"children":"D3. Part 2 - Importing and combining Charts | philippkoytek | Observable"}] 34:[] 32:{"id":"29b43f5dcc1166b6","slug":"d3-part-2-importing-and-combining-charts","title":"D3. Part 2 - Importing and combining Charts","thumbnail":"5bd8ecccd2a03b9e9f36064ea1070041b7eef78f3b044105389d0aba4f961ccd","access_level":"public","create_time":"$D2020-11-28T17:47:34.828Z","update_time":"$D2020-12-08T11:06:24.691Z","view_time":null,"first_public_time":"$D2020-12-01T09:31:24.710Z","has_unpublished_edits":null,"fork":false,"stars":0,"starred":false,"owner":{"type":"team","id":"d1485b4e59b7f657","login":"philippkoytek","name":"","avatar_url":"https://avatars-next.observableusercontent.com/74089590362f57eb01b7f7eb9d2e82b025e4e58a19cf3d989397abf44ce7db6d","tier":"starter_2024"},"version":67,"publish_version":67,"role":null,"authored":false,"authors":[{"type":"individual","id":"6ec2f9ddd766f194","login":"philippkoytek","name":"","avatar_url":"https://avatars-next.observableusercontent.com/74089590362f57eb01b7f7eb9d2e82b025e4e58a19cf3d989397abf44ce7db6d","tier":null}],"members":[{"type":"individual","id":"6ec2f9ddd766f194","login":"philippkoytek","name":"","avatar_url":"https://avatars-next.observableusercontent.com/74089590362f57eb01b7f7eb9d2e82b025e4e58a19cf3d989397abf44ce7db6d","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":{"id":"02bbccbe7ab24f4b","slug":"d3-tutorial","title":"D3 Tutorial","owner":{"id":"d1485b4e59b7f657","login":"philippkoytek","name":""}},"type":"notebook","body":{"title":"D3. Part 2 - Importing and combining Charts","cells":[{"id":0,"value":"md`# D3. Part 2 - Importing and combining Charts\n\n[Importing components of another Notebook](https://observablehq.com/@observablehq/introduction-to-imports)\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":23,"value":"chartWidth = width/2","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":30,"value":"mutable mySelectedData = null","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":9,"value":"import {scatterplot, barchart}\nwith {chartWidth as width, mutable mySelectedData as selectedData}\nfrom \"@philippkoytek/d3-part-2-simple-interaction\";","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":11,"value":"html`\n

Two Charts

${scatterplot}

${barchart}

selected: ${mySelectedData && mySelectedData.country}

\n`","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W34","stdlib":"1","titling":"auto"}} 33:"$32:body"