D3 Examples - D3-slippy map with canvas tiles

xxxxxxxxxx
 
<!DOCTYPE html>
<meta charset="utf-8">
<canvas width="960" height="960"></canvas>
<script src="https://d3js.org/d3.v4.min.js"></script>
<script src="d3-slippy.js"></script> 
<script>
    // Canvas:
    var canvas = d3.select("canvas");
    var context = canvas.node().getContext("2d");
​
    // Set up a slippy projection
    var slippy = d3.geoSlippy()
     .tileSet("")
     .size(canvas);
     
    // Set up a path generator
    var path = d3.geoPath().projection(slippy.projection());
​
    // Set zoom properties
    var zoom = d3.zoom()
      .on("zoom",zoomed)
      .translateExtent(slippy.zoomTranslateConstrain())
      .scaleExtent([1,128]);
    
    // Call zoom and set initial zoom
    canvas
      .call(zoom)
      .call(zoom.transform, slippy.zoomIdentity());
      
    // Apply zoom
    function zoomed() {
      // Update projection.
      slippy.zoomTransform(d3.event.transform)
​
      // Update raster tiles:
      slippy.canvas(context);   
      
    }
​
</script>
    