2b:null 2c:["$","title",null,{"children":"Time line | zequanr | Observable"}] 31:T44c,function label(node){ let svg = d3.select(node); let lable_color_number =[0,0,0,0]; for(let o =0; o < data.length ; o++){ switch(data[o].tag_color) { case lable_color[0]: lable_color_number[0] += 1; break case lable_color[1]: lable_color_number[1] += 1; break case lable_color[2]: lable_color_number[2] += 1; break case lable_color[3]: lable_color_number[3] += 1; break } } for(let i =0; i < lable_text.length ; i++){ svg .append('rect') .attr('x',(8 + 80 * i)) .attr('y',8) .attr('rx',4) .attr('height',20) .attr('width',74) .attr('fill',lable_color[i]) svg .append('text') .text(lable_text[i] + '/'+lable_color_number[i]) .attr('fill', 'white') .attr('x', (45 + 80 * i)) .attr('y', 23) .attr('font-size', 13) .attr('font-weight','bold') .attr("text-anchor", "middle"); } return node }32:T844,function textBox(node){ const svg = d3.select(node); var i = 0; var size = 0; var count = 0; function draw (i) { switch(classify){ case "all": size = Text(data[i].content,23).length * 23 + 55; if (data[i].tag_color == "red") { function returnrightshowbox(){ return rightShowbox(data[i].date,data[i].title,data[i].content,data[i].tag_color,size); } svg .append(returnrightshowbox) .attr('x',width / 2 + 20) .attr('y', count + between); } else { function returnleftshowbox(){ return leftShowbox(data[i].date,data[i].title,data[i].content,data[i].tag_color,size); } svg .append(returnleftshowbox) .attr('x',width / 2 - item_width - 50) .attr('y', count + between) } svg .append('circle') .attr('cx',width / 2) .attr('cy',count + between + 0.4 * size + 70) .attr('r',8) .attr('fill',data[i].tag_color) .attr('stroke','white') .attr('stroke-width',5); break; case "green": case "red": case "blue": case "orange": size = Text(data[i].content,23).length * 22 + 55; if (!(i%2 == 0)) { function returnrightshowbox(){ return rightShowbox(data[i].date,data[i].title,data[i].content,data[i].tag_color,size); } svg .append(returnrightshowbox) .attr('x',width / 2 + 20) .attr('y', count + between); } else { function returnleftshowbox(){ return leftShowbox(data[i].date,data[i].title,data[i].content,data[i].tag_color,size); } svg .append(returnleftshowbox) .attr('x',width / 2 - item_width - 50) .attr('y', count + between) } svg .append('circle') .attr('cx',width / 2) .attr('cy',count + between + 0.4 * size + 70) .attr('r',8) .attr('fill',data[i].tag_color) .attr('stroke','white') .attr('stroke-width',5); } } for (;i <=data.length -1 ; i++){ draw (i); count = count + size + between; } return node; }33:T741,function rightShowbox (date,title,content,tag_color,size) { var item_height = size ; var item_x = 10; var item_y = 70; function rightRoundedRect(x, y, width, height, radius) { return "M" + x + "," + y + "h" + (width - radius) + "a" + radius + "," + radius + " 0 0 1 " + radius + "," + radius + "v" + (height - 2 * radius) + "a" + radius + "," + radius + " 0 0 1 " + -radius + "," + radius + "h" + (radius - width) + "z"; } function triangle(x,y,h) { return "M" + x + "," + (y + h / 3) + "v20,l-10,-10,z"; } const node = DOM.svg(); const svg = d3.select(node); svg .append('rect') .attr('x',item_x) .attr('y',item_y) .attr('rx',6) .attr('width',item_width + 10) .attr('height',item_height) .attr('fill','white'); svg .append('path') .attr('d', rightRoundedRect(item_x + item_width,item_y,15,item_height,8)) .attr('fill',tag_color); svg .append('path') .attr('d',triangle(item_x,item_y,item_height)) .attr('fill','white'); svg .append('text') .text(title) .attr('x', item_x + (item_width/2)) .attr('y', item_y + 35) .attr('text-anchor','middle') .attr("font-family", "'heiti', sans-serif") .attr("font-size", 18) .attr('font-weight','bold') .attr("fill", "black"); svg .selectAll("text1") .data(Text(content,23)) .join("text") .attr("x",item_x + 24) .attr("y", (d,i) => i * 22 + item_y + 65) .text(d => d) .attr('fill','black'); svg .append('text') .text(date) .attr('x', item_x + 16) .attr('y', item_y + 15) .attr("font-family", "'heiti',sans-serif") .attr('font-weight','bold') .attr("font-size", 14) .attr("fill", "black"); return node; }34:T73f,function leftShowbox (date,title,content,tag_color,size) { var item_height = size ; var item_x = 10; var item_y = 70; function leftRoundedRect(x, y, width, height, radius) { return "M" + x + "," + y + "a" + radius + "," + radius + " 0 0 0 " + -radius + "," + radius + "v" + (height -2 * radius) + "a" + radius + "," + radius + " 0 0 0 " + radius + "," + radius + "h" + width + "v" + -height + "," + "z"; } function triangle(x,y,h) { return "M" + x + "," + (y + h / 3) + "v20,l10,-10,z"; } const node = DOM.svg(); const svg = d3.select(node); svg .append('rect') .attr('x',item_x) .attr('y',item_y) .attr('rx',6) .attr('width',item_width + 10) .attr('height',item_height) .attr('fill','white'); svg .append('path') .attr('d', leftRoundedRect(item_x,item_y,7,item_height,8)) .attr('fill',tag_color); svg .append('path') .attr('d',triangle(item_x + 10 + item_width,item_y,item_height)) .attr('fill','white'); svg .append('text') .text(title) .attr('x', item_x + (item_width/2)) .attr('y', item_y + 35) .attr('text-anchor','middle') .attr("font-family", "'heiti', sans-serif") .attr("font-size", 18) .attr('font-weight','bold') .attr("fill", "black"); svg .selectAll("text1") .data(Text(content,23)) .join("text") .attr("x",item_x + 24) .attr("y", (d,i) => i * 22 + item_y + 65) .text(d => d) .attr('fill','black'); svg .append('text') .text(date) .attr('x', item_x + item_width - 26) .attr('y', item_y + 15) .attr("font-family", "'heiti',sans-serif") .attr('font-weight','bold') .attr("font-size", 14) .attr("fill", "black"); return node; }35:[] 2f:{"id":"e50102e258f4defc","slug":"time-line","title":"Time line","thumbnail":"336a5eb9d7c84025d51176ab07a291945c53d9236a04e93ba95b3f25b0ff4d5c","access_level":"public","create_time":"$D2021-03-11T07:00:21.615Z","update_time":"$D2021-06-13T07:40:47.864Z","view_time":null,"first_public_time":"$D2021-03-24T06:47:01.025Z","fork":{"id":"dc0a610e66f2027d","slug":"time-line","title":"Time line","owner":{"id":"0a00b6ddf6fe5a3b","login":"lengfengif","name":""}},"stars":3,"starred":false,"owner":{"type":"team","id":"dec476674409c240","login":"zequanr","name":"","avatar_url":"https://avatars-next.observableusercontent.com/7ebcb6cb6c371547c504cec14f2f5d2bc9f0a00379c74f9408751e49845e04a6","tier":"starter_2024"},"version":1684,"publish_version":1684,"role":null,"authored":false,"authors":[{"type":"individual","id":"b9b9ceeb256945ea","login":"zequanr","name":"","avatar_url":"https://avatars-next.observableusercontent.com/7ebcb6cb6c371547c504cec14f2f5d2bc9f0a00379c74f9408751e49845e04a6","tier":null}],"members":[{"type":"individual","id":"b9b9ceeb256945ea","login":"zequanr","name":"","avatar_url":"https://avatars-next.observableusercontent.com/7ebcb6cb6c371547c504cec14f2f5d2bc9f0a00379c74f9408751e49845e04a6","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"title":"Time line","cells":[{"id":0,"value":"md`# Time line`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1318,"value":"viewof classify = html``","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":319,"value":"{\n \n const node = DOM.svg(width,height);\n \n backGround(node);\n \n backLine(node);\n \n label(node);\n \n textBox(node);\n \n return node;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1489,"value":"function backGround(node){\n \n let svg = d3.select(node);\n \n svg\n .append('rect')\n .attr('x',0)\n .attr('y',0)\n .attr('width',width)\n .attr('height',height)\n .attr('fill',backgroundColor);\n \n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1494,"value":"function backLine(node){\n \n let svg = d3.select(node);\n \n let myDate = new Date();\n\nfunction returnline() {\n return 'M' + (width/2) + ',' + 50\n + 'v' + height + ',' + 'z'\n }\n\n svg\n .append('path')\n .attr('d',returnline)\n .attr('stroke','white')\n .attr('stroke-width',5); \n \n svg\n .append('circle')\n .attr('cx',width/2)\n .attr('cy',50)\n .attr('r',25)\n .attr('fill',backgroundColor)\n .attr('stroke','white')\n .attr('stroke-width',5)\n \n svg\n .append('text')\n .text(myDate.getUTCFullYear())\n .attr('x', width/2 - 16)\n .attr('y', 50 + 5)\n .attr(\"font-family\", \"'heiti',sans-serif\")\n .attr('font-weight','bold')\n .attr(\"font-size\", 14)\n .attr(\"fill\", \"black\");\n \n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1498,"value":"$31","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1202,"value":"$32","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":5,"value":"$33","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":602,"value":"$34","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1502,"value":"function Text(content, chars) {\n\n let temp = Array.from(content);\n let paragraph =[];\n let j=0;\n let offset = 0,start = 0;\n paragraph[0]=\"\";\n \n var pattern = new RegExp(\"[A-Za-z0-9. ]+\"); //filter\n\n for (var i = 0; i < temp.length; i++ ){\n \n if(pattern.test(temp[i])){\n offset += 1; \n };\n if ( i == start + chars + Math.floor(offset /2)){\n \n start = i;\n offset = 0;\n j++;\n paragraph[j] =\"\";\n }\n paragraph[j] += temp[i];\n }\n\n return paragraph\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1506,"value":"newData = { return d3.json(url) }","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":724,"value":"data = {\nlet tempData = []\nfor(let i = 0; i < newData.length; i++){\nif(newData[i].tag_color == classify || \"all\" == classify ){ tempData.push(newData[i])}\n}\n return tempData;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":6,"value":"md `# Appendix`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1469,"value":"lable_color =['red','blue','orange','green'];","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1466,"value":"lable_text =['反腐','重磅发言','大事件','政策新规'];","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":643,"value":"between = 20;","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1102,"value":"backgroundColor = \"#eee\";","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":674,"value":"item_width = 420;","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":22,"value":"width =960;","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1579,"value":"url =\"https://yuque-parse.vercel.app/api/table/parse\"","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1533,"value":"function heightnumber(){\nlet num=0;\n for(let i = 0; i < data.length ; i++){\n num += Text(data[i].content,23).length * 23 + 55;\n}\nreturn num\n}\n","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":24,"value":"height = between * (data.length) + heightnumber() + 90;","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":19,"value":"d3 = require (\"d3@5\");","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"}],"files":"$W35","stdlib":"1","titling":"auto"}} 30:"$2f:body"