forked from alpha-beta-soup's block: d3 map experiment with NZTM [UNLISTED]
xxxxxxxxxx
<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 p = d3.geoIdentity().reflectY(true),
path = d3.geoPath().projection(p);//scale(1, width, height))
d3.json("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];
var wards = topojson.feature(nz, nz.objects.wards);
p.fitExtent([[0,0],[960,500]], wards)
svg.append("path")
.datum(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