chart = {
const color = d3.scaleSequential(d3.extent(goiter), d3.interpolateRdPu);
color.unknown("#ccc");
var svg = d3.select(DOM.svg(1100, 650));
svg.append("g")
.selectAll("path")
.data(sections.features)
.join("path")
.attr("fill", function(d) {
if (true) {
return color(d.properties.GOITER_PER_1K)
} else {
return "gray"
}
})
.attr("fill-opacity", function(d) {
if (true) {
return 1;
} else {
return 0.1
}
})
.attr("d", path)
.attr("stroke", "white")
.attr("stroke-width", 0);
svg.append("g")
.selectAll("path")
.data(states.features)
.join("path")
.attr("fill", "none")
.attr("d", path)
.attr("stroke", "white")
.attr("stroke-linejoin", "round")
.attr("stroke-width", 1)
.attr("stroke-opacity", 1);
svg.append("g")
.selectAll("path")
.data(divisions.features)
.join("path")
.attr("fill", "none")
.attr("d", path)
.attr("stroke", "black")
.attr("stroke-linejoin", "round")
.attr("stroke-width", 1)
.attr("stroke-opacity", 1);
svg.append("g")
.attr("transform", "translate("+550+","+0+")")
.append(() => legend({color,
title: "Goiter Rate",
ticks : 6,
width: 300}
)
);
return Object.assign(svg.node(), {scales: {color}});
}