map = {
const svg = d3.create("svg")
.attr("viewBox", [0, 0, width, height])
.style("display", "block")
svg.append("path")
.attr("d", path(outline))
.attr("fill", "none")
.attr("stroke", "currentColor");
svg.append("g")
.attr("stroke", "black")
.selectAll("circle")
.data(starData)
.join("circle")
.attr("r", d => radius(d.magnitude))
.attr("transform", d => `translate(${projection(d)})`);
if (constelations.indexOf("c") > -1) {
svg.append("g")
.attr("fill", "none")
.attr("stroke", "steelblue")
.attr("stroke-width", 0.5)
.attr("stroke-linejoin", "round")
.attr("stroke-linecap", "round")
.selectAll("path")
.data(constelationsData.features)
.enter()
.append("path")
.attr("stroke", "blue")
.attr("fill", "none")
.attr("d", f => path(f));
}
if (constelations.indexOf("c") > -1 && constelations.indexOf("n") > -1) {
svg.append("g")
.attr("font-size", "smaller")
.selectAll(".constName")
.data(constelationsData.features)
.enter()
.append("text")
.attr("fill", "green")
.attr("transform", function(f) { return "translate(" + projection(d3.geoCentroid(f)) + ")"; })
.text(d => d.id);
}
if (constelations.indexOf("m") > -1) {
svg.append("g")
.attr("stroke", "black")
.attr("fill", "none")
.attr("opacity", 0.45)
.selectAll("path")
.data(milkywayData.features)
.enter()
.append("path")
.attr("d", f => path(f));
}
return svg.node()
}