block by emeeks 298486b15217b1d4ee5c

Canvas Transform

Full Screen

Drawing geo paths to HTML5 canvas is really straightforward–d3.geo.path has a context() function that creates the necessary drawing code. But doing it in conjunction with transform zoom seems to require drawing by hand and accounting for current zoom.scale and zoom.translate individually for each point, which slows down canvas drawing.

The method of transferring the canvas drawing on-the-fly to an svg:image shows significant problems in Safari and is noticeably slower in Chrome than just using the canvas element.

index.html

tile.js

topojson.js