← Examples
countries · high detail · iso filter

Aruba

Aruba is 180 km² — invisible at Natural Earth's standard resolutions. With filter=Aruba and detail=high, the API automatically serves a high-resolution country file sourced from DIVA-GIS rather than the global 10m dataset. The projection auto-fits to the returned geometry using fitExtent.

API Call

https://api.mapjson.com/v1/geo?layer=countries&filter=Aruba&detail=high

Code

<!DOCTYPE html>
<html>
<head>
  <script src="https://cdn.jsdelivr.net/npm/d3@7/dist/d3.min.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/topojson-client@3/dist/topojson-client.min.js"></script>
  <style>
    svg { width: 100%; display: block; background: #7ab4cc; }
  </style>
</head>
<body>
  <div id="map"></div>
  <script>
    const width = 960, height = 560;
    const svg = d3.select("#map").append("svg").attr("viewBox", `0 0 ${width} ${height}`);

    const url = "https://api.mapjson.com/v1/geo?layer=countries&filter=Aruba&detail=high";

    d3.json(url).then(topo => {
      const country = topojson.feature(topo, topo.objects.geo);
      const projection = d3.geoMercator()
        .fitExtent([[80, 60], [width - 80, height - 60]], country);
      const path = d3.geoPath().projection(projection);

      svg.append("g")
        .selectAll("path")
        .data(country.features)
        .join("path")
        .attr("d", path)
        .attr("fill", "#d9d0be")
        .attr("stroke", "#fff")
        .attr("stroke-width", 1);
    });
  </script>
</body>
</html>