d3 map experiment with NZTM

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

.land {
  fill: #ddd;
}

.boundary {
  fill: none;
  stroke: #999;
}

</style>
<svg width="960" height="800"></svg>
<script src="https://d3js.org/d3.v4.min.js"></script>
<script src="https://d3js.org/topojson.v2.min.js"></script>
<script>

var svg = d3.select("svg"),
    width = +svg.attr("width"),
    height = +svg.attr("height");

// function scale (scaleFactor, width, height) {
//     return d3.geoTransform({
//         point: function(x, y) {
//             this.stream.point( (x - width/2) * scaleFactor + width/2 , (y - height/2) * scaleFactor + height/2);
//         }
//     });
//     }

var path = d3.geoPath().projection(null);//scale(1, width, height))

d3.json("build/wards-simple-topo.json", function(error, nz) {
  if (error) throw error;

// console.log(nz)
  // nz.transform.scale = [0,0];//undefined;
  // nz.transform.translate = [0,0];

svg.append("path")
      .datum(topojson.feature(nz, nz.objects.wards))
      .attr("class", "land")
      .attr("d", path);

// svg.append("path")
  //     .datum(topojson.mesh(nz, nz.objects.wards, function(a, b) { return a !== b; }))
  //     .attr("class", "boundary")
  //     .attr("d", path);
});

</script>

https://d3js.org/d3.v4.min.js

https://d3js.org/topojson.v2.min.js