cartodb/Leaflet
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

remove TileLayer.Canvas in favor of GridLayer

Browse Source
This commit is contained in:
Vladimir Agafonkin 2013-11-27 18:43:12 +02:00
parent 5e6f95dc9c
commit ce79ea1e81
3 changed files with 9 additions and 73 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
build/deps.js
View File

@ -47,12 +47,6 @@ var deps = {
deps: ['TileLayer'] deps: ['TileLayer']
}, },
TileLayerCanvas: {
src: ['layer/tile/TileLayer.Canvas.js'],
desc: 'Tile layer made from canvases (for custom drawing purposes).',
deps: ['TileLayer']
},
ImageOverlay: { ImageOverlay: {
src: ['layer/ImageOverlay.js'], src: ['layer/ImageOverlay.js'],
desc: 'Used to display an image over a particular rectangular area of the map.' desc: 'Used to display an image over a particular rectangular area of the map.'

15
debug/map/canvas.html
View File

@ -16,18 +16,19 @@
<script type="text/javascript"> <script type="text/javascript">
var tiles = new L.TileLayer.Canvas(); var tiles = new L.GridLayer();
tiles.drawTile = function(canvas, tile, zoom) { tiles.createTile = function(coords) {
var ctx = canvas.getContext('2d'); var tile = document.createElement('canvas'),
ctx = tile.getContext('2d');
tile.width = tile.height = 256;
ctx.fillStyle = 'white'; ctx.fillStyle = 'white';
ctx.fillRect(0, 0, 255, 255); ctx.fillRect(0, 0, 255, 255);
ctx.fillStyle = 'black'; ctx.fillStyle = 'black';
ctx.fillText('x: ' + tile.x + ', y: ' + tile.y + ', zoom:' + zoom, 20, 20); ctx.fillText('x: ' + coords.x + ', y: ' + coords.y + ', zoom: ' + coords.z, 20, 20);
ctx.strokeStyle = 'red'; ctx.strokeStyle = 'red';
ctx.beginPath(); ctx.beginPath();
@ -37,6 +38,8 @@
ctx.lineTo(0, 255); ctx.lineTo(0, 255);
ctx.closePath(); ctx.closePath();
ctx.stroke(); ctx.stroke();
return tile;
} }
var map = new L.Map('map', {center: new L.LatLng(50.5, 30.51), zoom: 15, layers: [tiles]}); var map = new L.Map('map', {center: new L.LatLng(50.5, 30.51), zoom: 15, layers: [tiles]});

61
src/layer/tile/TileLayer.Canvas.js
View File

@ -1,61 +0,0 @@
/*
* L.TileLayer.Canvas is a class that you can use as a base for creating
* dynamically drawn Canvas-based tile layers.
*/
L.TileLayer.Canvas = L.TileLayer.extend({
options: {
async: false
},
initialize: function (options) {
L.setOptions(this, options);
},
redraw: function () {
if (this._map) {
this._reset({hard: true});
this._update();
}
for (var i in this._tiles) {
this._redrawTile(this._tiles[i]);
}
return this;
},
_redrawTile: function (tile) {
this.drawTile(tile, tile._tilePoint, this._map._zoom);
},
_createTile: function () {
var tile = L.DomUtil.create('canvas', 'leaflet-tile');
tile.width = tile.height = this.options.tileSize;
tile.onselectstart = tile.onmousemove = L.Util.falseFn;
return tile;
},
_loadTile: function (tile, tilePoint) {
tile._layer = this;
tile._tilePoint = tilePoint;
this._redrawTile(tile);
if (!this.options.async) {
this.tileDrawn(tile);
}
},
drawTile: function (/*tile, tilePoint*/) {
// override with rendering code
},
tileDrawn: function (tile) {
this._tileOnLoad.call(tile);
}
});
L.tileLayer.canvas = function (options) {
return new L.TileLayer.Canvas(options);
};