JSFiddle - React, Tailwind, and code Playground

by jpeter06

HTML

<svg width="100%" height="500" id="example_map"></svg>
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/4.13.0/d3.min.js"></script>
<script src="https://unpkg.com/topojson-client@3"></script>

<script>
	var path = d3.geoPath().projection(geoAzimuthalEquidistant());
  var url = "https://unpkg.com/[email protected]/world/110m.json";
  d3.json(url, function(error, world){
      if (error) throw error;

      var svg = d3.select("#example_map")
        .datum(topojson.feature(world, world.objects.land))
        .attr("d", path);
  })
</script>