chart = {
const path = d3.geoPath().projection(projection);;
const svg = d3.create("svg")
.attr("viewBox", "0 0 960 600")
.style("width", "100%")
.style("height", "auto");
svg.append("g")
.selectAll("path")
.data(topojson.feature(us, us.objects.ESP_adm1).features)
.enter()
.append("path")
.attr("fill", d => {
console.log(d.properties.HASC_1 + ": "+ data1.get(d.properties.HASC_1));
return color(data1.get(d.properties.HASC_1))
})
.attr("d", path)
.on("mouseover", function(d){
return tooltip.style("visibility", "visible").text(d.properties.NAME_1 + ": " + data1.get(d.properties.HASC_1));
})
.on("mousemove", function(){
return tooltip.style("top", (d3.event.pageY-10)+"px").style("left",(d3.event.pageX+10)+"px");
})
.on("mouseout", function(){
return tooltip.style("visibility", "hidden");
});
svg.append("path")
.datum(topojson.mesh(us, us.objects.ESP_adm1, (a, b) => a !== b))
.attr("fill", "none")
.attr("stroke", "white")
.attr("stroke-linejoin", "round")
.attr("d", path);
return svg.node();
}