2c:null 2d:["$","title",null,{"children":"お仕事 2015-2020 | shimizu | Observable"}] 32:[{"id":"42f7b05eacb0a6be4ff2202c9090a208cf931291cca66a53aded5d5679f44aa35526aa9775e96c9cab522690404e8cba7b948dfe00364fc6c49470eaa13a544d","href":"https://static.observableusercontent.com/files/42f7b05eacb0a6be4ff2202c9090a208cf931291cca66a53aded5d5679f44aa35526aa9775e96c9cab522690404e8cba7b948dfe00364fc6c49470eaa13a544d","name":"data-1@1.tsv","type":"text/tab-separated-values","lastModified":1610411564592.265,"size":7765},{"id":"89684ccf454cebb5153ca9070ba983b6067bf979bd4e5e6adb973ea624b01625ed0a97ab46e4cf7ba4bf2d8d50763c896796f295f09aeab7ffd80a9eca6e2ebd","href":"https://static.observableusercontent.com/files/89684ccf454cebb5153ca9070ba983b6067bf979bd4e5e6adb973ea624b01625ed0a97ab46e4cf7ba4bf2d8d50763c896796f295f09aeab7ffd80a9eca6e2ebd","name":"data@1.tsv","type":"text/tab-separated-values","lastModified":1607766332834.629,"size":7646}] 30:{"id":"0d578a0187b895a8","slug":"work-2015-2020","title":"お仕事 2015-2020","thumbnail":"5af58634e7b6b278ff91b8bf9704b39f7896907378898533ac5a0b27b3704eb7","access_level":"public","create_time":"$D2020-09-14T06:41:24.029Z","update_time":"$D2021-01-12T00:46:56.776Z","view_time":null,"first_public_time":"$D2020-12-12T09:46:31.331Z","has_unpublished_edits":null,"fork":false,"stars":2,"starred":false,"owner":{"type":"team","id":"d24c0ca9d1300164","login":"shimizu","name":"shimizu","avatar_url":"https://avatars-next.observableusercontent.com/4911d1cb615a6d69d84f6803f9c18eb02a7074312fbb7a8868ab03134a7e9ddc","tier":"starter_2024"},"version":261,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"871e5a5f08c8ef40","login":"shimizu","name":"shimizu","avatar_url":"https://avatars-next.observableusercontent.com/4911d1cb615a6d69d84f6803f9c18eb02a7074312fbb7a8868ab03134a7e9ddc","tier":null}],"members":[{"type":"individual","id":"871e5a5f08c8ef40","login":"shimizu","name":"shimizu","avatar_url":"https://avatars-next.observableusercontent.com/4911d1cb615a6d69d84f6803f9c18eb02a7074312fbb7a8868ab03134a7e9ddc","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"titling":"auto","title":"お仕事 2015-2020","cells":[{"id":0,"value":"md`# お仕事 2015-2020`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":212,"value":"md `2015年11月〜2020年11月までの間に、実装を担当したプロジェクトをカレンダーとして表示しています。\n\n日付はコンテンツ公開日に合わせてあるので、実際に作業を行なっていた時期とは異なります。\n\nクリックするとコンテンツに飛びます\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":24,"value":"view = html`\n

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

\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":197,"value":"md `## スタイル設定`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":94,"value":"tableStyle = html``","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":135,"value":"legendStyle = html``","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":143,"value":"tooltipStyle = html``","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":181,"value":"md`## セルの描画`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":57,"value":"cell = {\n const calendar = d3.select('#calendar tbody');\n const tr = calendar.selectAll('tr').data(yearlyData.entries()).enter().append('tr');\n tr.append('td').attr('class', 'label').text(d => d.key);\n \n\tconst td = tr\n\t\t.selectAll('.box')\n\t\t.data(function(d) {\n\t\t\tconst MathData = Object.keys(month).map(i => {\n\t\t\t\tconst val = d.value.get(i);\n\t\t\t\tconst length = !val ? 0 : val.length;\n\t\t\t\treturn { label: month[i], val: val, length: length };\n\t\t\t});\n\t\t\treturn MathData;\n\t\t})\n\t\t.enter()\n\t\t.append('td')\n\t\t.attr('class', 'box')\n\t\t.attr('data-label', d => d.label);\n\n\tconst cell = td\n\t\t.selectAll('.cell')\n\t\t.data(d => !d.val ? [] : d.val )\n\t\t.enter()\n\t\t.append('a')\n\t\t.attr('class', 'cell')\n\t\t.attr('target', '_blank')\n\t\t.attr('href', d => d.URL)\n\t\t.text(d => d['タイプ'][0]) //頭文字だけ表示する\n\t\t.style('background-color', d => color[d['タイプ']]);\n \n return cell;\n \n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":186,"value":"md`## 凡例の描画`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":92,"value":"legend = {\n\tconst legend = d3.select('.legend');\n\tconst data = Object.keys(color).map(key => {\n\t\treturn { key: key, color: color[key] };\n\t});\n\n\tlegend\n\t\t.selectAll('li')\n\t\t.data(data)\n\t\t.enter()\n\t\t.append('li')\n\t\t.attr('class', d => d.key)\n\t\t.text(d => d.key)\n \n return legend\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":187,"value":"md`## ツールチップの描画`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":132,"value":"tooltip = {\n const tooltip = d3.select(\"body\").append(\"div\")\n .attr(\"class\", \"tooltip\")\n .style(\"position\", \"absolute\")\n .style(\"visibility\", \"hidden\");\n \n\n cell\n .on(\"mouseover\", d => {\n const inner = [[d[\"年\"], d[\"月\"], d[\"日\"]].join(\"/\"), d[\"タイトル\"]].join(\" \");\n tooltip.text(inner);\n return tooltip.style(\"visibility\", \"visible\");\n })\n .on(\"mousemove\", () =>{\n let x = d3.event.pageX;\n if(x > width*0.75) x = x-width/4;\n return tooltip.style(\"top\", (d3.event.pageY-40)+\"px\").style(\"left\",(x)+\"px\");\n \n })\n .on(\"mouseout\", () => tooltip.style(\"visibility\", \"hidden\")); \n \n return tooltip;\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":195,"value":"md `## ラベル`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":69,"value":"month = ({\n\t1: 'Jan',\n\t2: 'Feb',\n\t3: 'Mar',\n\t4: 'Apr',\n\t5: 'May',\n\t6: 'Jun',\n\t7: 'Jul',\n\t8: 'Aug',\n\t9: 'Sep',\n\t10: 'Oct',\n\t11: 'Nob',\n\t12: 'Dec'\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":59,"value":"color = ({\n\tDataViz: '#FF7A7A',\n\tChart: '#6A96D7',\n\tMap: '#91F577',\n\tLive: '#E0FA79',\n\tOther: '#A058B3'\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":193,"value":"md`## データ読み込み`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":35,"value":"convert = function(data) {\n\treturn d3\n\t\t.nest()\n\t\t.rollup(function(d) {\n\t\t\treturn d3\n\t\t\t\t.nest()\n\t\t\t\t.key(function(dd) {\n\t\t\t\t\treturn dd['月'];\n\t\t\t\t})\n\t\t\t\t.map(d);\n\t\t})\n\t\t.key(function(d) {\n\t\t\treturn d['年'];\n\t\t})\n\t\t.map(data);\n};","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":4,"value":"data = FileAttachment(\"data-1@1.tsv\").tsv();","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":10,"value":"yearlyData = convert(data)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":207,"value":"md `## ライブラリ読み込み`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":14,"value":"d3 = require(\"d3@5\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W32","stdlib":"1"}} 31:"$30:body"