2b:null 2c:["$","title",null,{"children":"Fitted Symbols | D3 | Observable"}] 31:[] 2f:{"id":"1fac2626b9e1b65f","slug":"fitted-symbols","title":"Fitted Symbols","thumbnail":"516746beca7bb18a1bea5e7d341e8640fb7e565b241b1af426b20870c82eba98","access_level":"public","create_time":"$D2019-04-26T16:18:40.252Z","update_time":"$D2026-06-14T12:21:33.746Z","view_time":null,"first_public_time":"$D2020-09-04T04:39:53.272Z","fork":false,"stars":5,"starred":false,"owner":{"type":"team","id":"863951e3ebe4c0ae","login":"d3","name":"D3","avatar_url":"https://avatars-next.observableusercontent.com/5af16e327a90b2873351dda8a596c0d2d3bf954f64523deefe80177c9764d0f7","tier":"pro_2024"},"version":151,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"45a379fcfcb14253","login":"fil","name":"Fil","avatar_url":"https://avatars-next.observableusercontent.com/d5b1777907117a2bdf2a07eb98600d7a9beb21639fde42b9753e95c88c7731a6","tier":null}],"members":[{"type":"team","id":"863951e3ebe4c0ae","login":"d3","name":"D3","avatar_url":"https://avatars-next.observableusercontent.com/5af16e327a90b2873351dda8a596c0d2d3bf954f64523deefe80177c9764d0f7","tier":"pro_2024","role":"editor"}],"comments":[{"id":"52ca4bae5cba679d","reply_to_id":null,"content":"Suggest to add ISC License please. Thanks!","create_time":"$D2020-11-02T19:11:10.797Z","update_time":null,"resolved":true,"user":{"type":"individual","id":"6a6e2fdbba1803f2","login":"curran","name":"Curran Kelleher","avatar_url":"https://avatars-next.observableusercontent.com/27282ae25b74721def112d68db7d4c2dfd43d48f6b2f232e34cbbdb2bedc9dc9","tier":null}}],"custom_thumbnail":false,"trashed":false,"subscribed":null,"forks":10,"collection":{"id":"9677f62ae01e8373","slug":"d3-shape","title":"d3-shape","owner":{"id":"863951e3ebe4c0ae","login":"d3","name":"D3"}},"type":"notebook","body":{"title":"Fitted Symbols","cells":[{"id":0,"value":"# Fitted Symbols","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined"},{"id":73,"value":"chart = svg``","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":7,"value":"{\n const path = d3.select(chart).select(\"#symbol\"),\n collection = d3.select(chart).select(\"#collection\").selectAll(\"path\"),\n rect = d3.select(chart).select(\"rect\"),\n width = +rect.attr(\"width\"),\n height = +rect.attr(\"height\"),\n symbol = d3.symbol(),\n symbolTypes = d3.symbols,\n symbolNames = \"circle cross diamond square star triangle wye\".split(/ /);\n\n let symbolIndex = -1;\n\n do {\n symbolIndex = (symbolIndex + 1) % symbolTypes.length;\n symbol.type(symbolTypes[symbolIndex]);\n\n yield symbolNames[symbolIndex];\n\n path.attr(\"d\", symbol.size(64));\n collection.transition().style(\"fill\", (_,i) => i === symbolIndex ? \"#000\" : \"#999\")\n\n var box = path.node().getBBox(),\n error = Math.min(width / box.width, height / box.height);\n\n path\n .transition()\n .duration(1500)\n .attr(\"d\", symbol.size(error * error * 64));\n } while (await Promise.race([invalidation, Promises.delay(2000, true)]));\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":81,"value":"","pinned":true,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined"}],"files":"$W31","stdlib":"1","titling":"auto"}} 30:"$2f:body"