Australia polling booth voronoi and ocean overlay

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

path {
  stroke-linejoin: round;
  fill: none;
}

.topojson {
  stroke: #222;
}

.voronoi {
  stroke: none;
}

.geojson {
  stroke: red;
}

.ocean {
  fill: steelblue;
}

</style>
<body>
<script src="https://d3js.org/d3.v3.min.js"></script>
<script src="https://d3js.org/queue.v1.min.js"></script>
<script src="https://d3js.org/topojson.v1.min.js"></script>
<script>
var width = 960,
  height = 600;

var ausCenter = [144.9, -37.8];
var parallels = [-36, -18];

var projection = d3.geo.albers()
    .translate([width / 2, height / 2])
    .scale(20000)
    .rotate([-ausCenter[0], 0])
    .center([0, ausCenter[1]])
    .parallels(parallels)
    .clipExtent([[0, 0], [width, height]])
    .precision(0);

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

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

var zoom = d3.behavior.zoom()
    .translate(projection.translate())
    .scale(projection.scale())
    .on("zoom", zoomed);

svg.call(zoom);

queue()
  .defer(d3.json, "voronoi.json")
  .defer(d3.json, "ocean.json")
  .await(ready);

function ready(err, geo, ocean) {

window.geo = geo;
  console.log(geo);
  svg.selectAll("path.geojson")
      .data(topojson.feature(geo, geo.objects.voronoi).features)
      .enter().append("path")
      .attr("class", "geojson")
      .attr("d", path);

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

console.log(ocean);
}

function zoomed() {
  projection
    .translate(d3.event.translate)
    .scale(d3.event.scale);

svg.selectAll("path").attr("d", path);
}
</script>

Modified http://d3js.org/d3.v3.min.js to a secure url

Modified http://d3js.org/queue.v1.min.js to a secure url

Modified http://d3js.org/topojson.v1.min.js to a secure url

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

https://d3js.org/queue.v1.min.js

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