layout, title
| layout |
title |
| tutorial_frame |
CanvasCircles |
<script type='text/javascript'>
var map = L.map('map', {
center: [0, 0],
zoom: 0
});
L.GridLayer.CanvasCircles = L.GridLayer.extend({
createTile: function (coords) {
var tile = document.createElement('canvas');
var tileSize = this.getTileSize();
tile.setAttribute('width', tileSize.x);
tile.setAttribute('height', tileSize.y);
var ctx = tile.getContext('2d');
// Draw whatever is needed in the canvas context
// For example, circles which get bigger as we zoom in
ctx.arc(tileSize.x/2, tileSize.x/2, 4 + coords.z*4, 0, 2*Math.PI, false);
ctx.fill();
return tile;
}
});
L.gridLayer.canvasCircles = function(opts) {
return new L.GridLayer.CanvasCircles(opts);
};
map.addLayer( L.gridLayer.canvasCircles() );
</script>
