Tobler’s Hyperelliptical projection by fil

Waldo R. Tobler’s family of hyperelliptical projections is available for d3-geo-projection as pull request #133.

You can try the following parameters:

Default:

d3.geoHyperelliptical().alpha(0).gamma(1.183136).k(2.5) (fig. 9)

Values described in Tobler, “The Hyperelliptical and Other New Pseudo Cylindrical Equal Area Map Projections”, Journal of Geophysical Research, 1973:

d3.geoHyperelliptical().alpha(0).gamma(6).k(1/2) (fig. 5)
d3.geoHyperelliptical().alpha(1/4).gamma(1.194).k(2) (fig. 6)
d3.geoHyperelliptical().alpha(1/2).gamma(Math.PI/2).k(2) (fig. 7)
d3.geoHyperelliptical().alpha(0).gamma(1.461).k(3/2) (fig. 8)

index.html

<!DOCTYPE html>
<meta charset="utf-8">
<style>

body {
  background: #fcfcfa;
}

.stroke {
  fill: none;
  stroke: #000;
  stroke-width: 3px;
}

.fill {
  fill: #fff;
}

.graticule {
  fill: none;
  stroke: #777;
  stroke-width: .5px;
  stroke-opacity: .5;
}

.land {
  fill: #222;
}

.boundary {
  fill: none;
  stroke: #fff;
  stroke-width: .5px;
}

</style>
<body>
<script src="https://unpkg.com/d3@5"></script>
<script src="d3-geo-projection.js"></script>
<script src="https://unpkg.com/topojson"></script>
<script src="https://unpkg.com/versor"></script>
<script src="https://unpkg.com/d3-inertia@0.1"></script>
<script>

var projection = d3.geoHyperelliptical()
  .alpha(0).gamma(1.183136).k(2.5) // (fig. 9)
//.alpha(0).gamma(6).k(1/2) // (fig. 5)
//.alpha(1/4).gamma(1.194).k(2) // (fig. 6)
//.alpha(1/2).gamma(Math.PI/2).k(2) // (fig. 7)
//.alpha(0).gamma(1.461).k(3/2) // (fig. 8)
//.alpha(0).gamma(2).k(4) // test parameters freely

.rotate([90,0])

var path = d3.geoPath()
    .projection(projection);

var graticule = d3.geoGraticule();

var svg = d3.select("body").append("svg");

svg.append("defs").append("path")
    .datum({type: "Sphere"})
    .attr("id", "sphere");

svg.append("use")
    .attr("class", "stroke")
    .attr("xlink:href", "#sphere");

svg.append("use")
    .attr("class", "fill")
    .attr("xlink:href", "#sphere");

svg.append("path")
    .datum(graticule)
    .attr("class", "graticule");

d3.json("https://unpkg.com/world-atlas@2.0.2/land-110m.json").then(function(world) {

  svg.insert("path", ".graticule")
      .datum(topojson.feature(world, world.objects.land))
      .attr("class", "land")
  draw();

});

 function draw() {
    const margin = 10;
    const width = Math.min(960, window.innerWidth),
          height = Math.min(width / 2, window.innerHeight);
    svg.attr('height', height).attr('width', width)
    projection.fitExtent([[margin, margin], [width - margin, height - margin]], {
      type: "Sphere"
    });

    svg.selectAll('path').attr('d', path)
  }

  d3.geoInertiaDrag(svg.style('cursor', 'move'), draw);

  d3.select(window).on('resize', draw);
</script>