31:[] 2f:{"title":"2025 Data Drawing Showcase","cells":[{"id":0,"value":"# 2025 Data Drawing Showcase\n\nWe created data drawings that represent how we charge in everyday life.","pinned":false,"hidden":false,"mode":"md"},{"id":39,"value":"viewof dataName = {\n const radio = Inputs.radio(names, {\n label: md`__📄 Data__`,\n value: names.at(0)\n });\n\n d3.select(radio).style(\"max-width\", `${width}px`);\n d3.select(radio).select(\"label\").style(\"font-size\", \"1rem\");\n d3.select(radio).select(\"label\").style(\"flex-shrink\", \"1\");\n d3.select(radio).select(\"div\").classed(\"toggle\", true);\n d3.select(radio).selectAll(\"div > label\").style(\"margin-right\", 0);\n return radio;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":8,"value":"viewof name = {\n const radio = Inputs.radio(names, {\n label: md`__📊 Drawing__`,\n value: names.at(0)\n });\n\n d3.select(radio).style(\"max-width\", `${width}px`);\n d3.select(radio).select(\"label\").style(\"font-size\", \"1rem\");\n d3.select(radio).select(\"label\").style(\"flex-shrink\", \"1\");\n d3.select(radio).select(\"div\").classed(\"toggle\", true);\n d3.select(radio).selectAll(\"div > label\").style(\"margin-right\", 0);\n return radio;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":25,"value":"## Web version","pinned":false,"hidden":false,"mode":"md"},{"id":35,"value":"chartFunction(data)","pinned":false,"hidden":false,"mode":"ojs"},{"id":130,"value":"legendFunction(data)","pinned":false,"hidden":false,"mode":"ojs"},{"id":23,"value":"## Paper version","pinned":false,"hidden":false,"mode":"md"},{"id":86,"value":"

","pinned":false,"hidden":false,"mode":"md"},{"id":59,"value":"data = dataset.filter((d) => d.name === dataName)","pinned":false,"hidden":false,"mode":"ojs"},{"id":71,"value":"chartFunction = charts.get(name)","pinned":false,"hidden":false,"mode":"ojs"},{"id":405,"value":"legendFunction = legends.get(name)","pinned":false,"hidden":false,"mode":"ojs"},{"id":272,"value":"","pinned":false,"hidden":false,"mode":"html"},{"id":32,"value":"charts = new Map([\n // [\"Ogawa\", ogawaChart],\n [\"Okuyama\", okuyamaChart],\n [\"Yamasaki\", yamasakiChart],\n [\"Mitsui\", mitsuiChart],\n [\"Okuyama\", okuyamaChart],\n [\"Homma\", hommaChart],\n [\"Sano\", sanoChart],\n [\"Sugimoto\", sugimotoChart2]\n])","pinned":false,"hidden":false,"mode":"ojs"},{"id":123,"value":"legends = new Map([\n // [\"Ogawa\", ogawaLegend],\n [\"Okuyama\", okuyamaLegend],\n [\"Yamasaki\", yamasakiLegend],\n [\"Mitsui\", mitsuiLegend],\n [\"Okuyama\", okuyamaLegend],\n [\"Homma\", hommaLegend],\n [\"Sano\", sanoLegend],\n [\"Sugimoto\", sugimotoLegend]\n])","pinned":false,"hidden":false,"mode":"ojs"},{"id":349,"value":"names","pinned":false,"hidden":false,"mode":"ojs"},{"id":165,"value":"### Import codes","pinned":false,"hidden":false,"mode":"md"},{"id":5,"value":"import { dataset, dataByName, names } from \"930e107bebaff325\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":377,"value":"// import { ogawaChart, ogawaLegend } from \"7554e5309fa26eae\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":29,"value":"import { okuyamaChart, okuyamaLegend } from \"994736d448454b54\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":51,"value":"import { yamasakiChart, yamasakiLegend } from \"a4f98a1b1c74ecfe\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":75,"value":"import { hommaChart, hommaLegend } from \"31e622e6d79b542c\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":81,"value":"import { sanoChart, sanoLegend } from \"15e96dff071487d9\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":411,"value":"import { mitsuiChart, mitsuiLegend } from \"584dfcca03a0b082\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":395,"value":"import { sugimotoChart, sugimotoLegend } from \"8a0e2a793a7b2778\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":540,"value":"import { sugimotoChart2 } from \"372b382ccea2c8eb\"","pinned":false,"hidden":false,"mode":"ojs"}],"files":"$W31","stdlib":"1","titling":"auto"}