chart = {
const height = width / 1.8;
const svg = d3.select(DOM.svg(width, height))
.style("width", "100%")
.style("height", "auto")
.style("margin-bottom", "30px");
const projection = d3.geoNaturalEarth1()
.scale(width / 4.8)
.translate([width / 2.15, height / 1.7])
.precision(.1);
const path = d3.geoPath()
.projection(projection);
svg.append("g")
.selectAll("path")
.data(topojson.feature(world, world.objects.countries).features)
.enter().append("path")
.attr("fill", "#ccc")
.attr("d", path)
svg.append("path")
.datum(topojson.mesh(world, world.objects.countries, (a, b) => a !== b))
.attr("fill", "none")
.attr("stroke", "white")
.attr("stroke-linejoin", "round")
.attr("stroke-width", 0.5)
.attr("d", path);
var circles = svg.append("g")
.selectAll("path")
.data(topojson.feature(world, world.objects.countries).features)
circles
.enter()
.append("circle")
.attr("fill", "black")
.style("opacity", 0)
.attr("r", 50)
.attr("cx", function(d) {
if(path.centroid(d)[0] < 500) return -10
else return 1010
})
.attr("cy", function(d) { return d3.randomUniform(0,600)()
})
.transition()
.duration(1500)
.ease(d3.easeCubicOut)
.delay(function(d, i) { return 2000 + i * 8; })
.attr("r", 3)
.attr("cx", function(d) { return path.centroid(d)[0] })
.attr("cy", function(d) { return path.centroid(d)[1] })
.style("opacity", 1)
return svg.node();
}