31:T7fb,chart = { const svg = d3.select(DOM.svg(width,height)) .style("background-color","#e8e0e3") svg.append("text") .attr("x",width/2) .attr("y",70) .text("Potentially Habitable Exoplanets") .style("fill","#df691f") .style("text-anchor","middle") .style("font-size","2em") .style("font-weight","bold") svg.append("text") .attr("x",width/2) .attr("y",95) .text("Week 5 :Uncertainties. Day 28 : Future.") .style("fill","#df691f") .style("text-anchor","middle") .style("font-size","1.2em") svg.append("text") .attr("x",width/2) .attr("y",115) .text("#30DayChartChallenge") .style("fill","#df691f") .style("text-anchor","middle") .style("font-size","1em") const g = svg.append("g") .attr("transform",`translate(${margin.left},${margin.top+80})`) g.append("defs") .append("filter") .attr("id","glow") .append("feGaussianBlur") .attr("stdDeviation","3.5") .attr("result","coloredBlur") .append("feMerge") .append("feMergeNode") .attr("in","coloredBlur") .append("feMergeNode") .attr("in","SourceGraphic") g.selectAll("image") .data(data) .join("image") .attr("transform",(d,i)=>`translate(${x(i%5)},${y(Math.floor(i/5))}) scale(0.077)`) .attr("xlink:href",img) .attr("x",-250) .attr("y",-250) .attr("opacity",0.25) g.selectAll("circle") .data(data) .join("circle") .attr("class","exo") .attr("transform",(d,i)=>`translate(${x(i%5)},${y(Math.floor(i/5))})`) .attr("r",(d,i)=>d.Radius*radius) .attr("stroke",color) .attr("stroke-width",2) .attr("fill","none") g.selectAll(".exo") .style("filter","url(#glow)") g.selectAll("circles") .data(data) .join("circle") .attr("transform",(d,i)=>`translate(${x(i%5)},${y(Math.floor(i/5))})`) .attr("r",(d,i)=>d.Radius*radius) .attr("stroke",color) .attr("stroke-width",2) .attr("fill","none") return svg.node() }32:[{"id":"9d38a76984772e627177a347e81f61ee78e2a52e7b5a0b5f8868f95d62903e83b50559f93ba06492c7ccf6b0ff53c1468f025bd9a7cb9fe2bfd1d856130aacb5","href":"https://static.observableusercontent.com/files/9d38a76984772e627177a347e81f61ee78e2a52e7b5a0b5f8868f95d62903e83b50559f93ba06492c7ccf6b0ff53c1468f025bd9a7cb9fe2bfd1d856130aacb5","name":"earth-globe.png","type":"image/png","lastModified":1619709285883.097,"size":45717},{"id":"58e0b087d81411d2b926fe7a8202bd19e7ae8456ae4f937264fa11d25c3a86fe85100607da39e5bd63ef847e03520a54b8760346c6f097f949fa63b70ac4ea5f","href":"https://static.observableusercontent.com/files/58e0b087d81411d2b926fe7a8202bd19e7ae8456ae4f937264fa11d25c3a86fe85100607da39e5bd63ef847e03520a54b8760346c6f097f949fa63b70ac4ea5f","name":"data.csv","type":"text/csv","lastModified":1619719419353.436,"size":2585}] 2f:{"title":"Potentially Habitable Exoplanets","cells":[{"id":0,"value":"html`

Potentially Habitable Exoplanets

Week 5 :Uncertainties. Day 28 : Future.

#30daychartchallenge

`","pinned":false,"hidden":false,"mode":"ojs"},{"id":352,"value":"html`

Data Credit:\nPlanetary Habitability Laboratory\n
\nEarth Image Credit:\nFreepik via flaticon\n
\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":9,"value":"$31","pinned":false,"hidden":false,"mode":"ojs"},{"id":252,"value":"annotations = {\n chart\n const annotations = data.map((d,i)=>{\n return {\n x:x(i%5),\n y:y(Math.floor(i/5)),\n dx:0,\n dy:-60,\n color:color,\n note:{\n title: d.Name,\n label: d.Distance+\" lightyears away.\"\n },\n subject:{\n radius:radius*d.Radius\n }\n }\n })\n \n const type = d3.annotationCustomType(\n d3.annotationCalloutCircle,\n {\"className\":\"custom\",\n \"note\":{\n \"align\":\"middle\"}})\n \n const makeAnnotations = d3.annotation()\n .type(type)\n .textWrap(110)\n .annotations(annotations)\n \n d3.select(\"svg\")\n .append(\"g\")\n .attr(\"transform\",`translate(${margin.left},${margin.top+80})`)\n .call(makeAnnotations)\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":171,"value":"color = \"#df691f\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":27,"value":"radius = 20","pinned":false,"hidden":false,"mode":"ojs"},{"id":48,"value":"y = d3.scaleLinear()\n .domain([0,8])\n .range([margin.top,height-margin.bottom])","pinned":false,"hidden":false,"mode":"ojs"},{"id":46,"value":"x = d3.scaleLinear()\n .domain([0,5])\n .range([margin.left,width-margin.right])","pinned":false,"hidden":false,"mode":"ojs"},{"id":14,"value":"margin = ({left:60,right:10,top:100,bottom:100})","pinned":false,"hidden":false,"mode":"ojs"},{"id":10,"value":"height = 2000","pinned":false,"hidden":false,"mode":"ojs"},{"id":165,"value":"width = 954","pinned":false,"hidden":false,"mode":"ojs"},{"id":81,"value":"img = FileAttachment(\"earth-globe.png\").url()","pinned":false,"hidden":false,"mode":"ojs"},{"id":6,"value":"data = FileAttachment('data.csv').csv({typed:true})","pinned":false,"hidden":false,"mode":"ojs"},{"id":4,"value":"d3 = require('d3@6','d3-svg-annotation')","pinned":false,"hidden":false,"mode":"ojs"},{"id":216,"value":"style = html`\n\n`","pinned":false,"hidden":false,"mode":"ojs"}],"files":"$W32","stdlib":"1","titling":"auto"}