- // Round here is **CRUCIAL** otherwise the images are filtered
- // and the performance sucks (more than expected).
- var xoff = Math.round((x * size - xMin) / gZoomFactor);
- var yoff = Math.round((y * size - yMin) / gZoomFactor);
- // Draw placeholder, and then initiate loading/drawing of real one.
- gMapContext.drawImage(gLoadingTile, xoff, yoff);
-
- gTileService.get(gActiveMap, {x: x, y: y, z: gPos.z}, function(aImage, aStyle, aCoords) {
- // Only draw if this applies for the current view.
- if ((aStyle == gActiveMap) && (aCoords.z == gPos.z)) {
- var ixMin = gPos.x - wid / 2;
- var iyMin = gPos.y - ht / 2;
- var ixoff = Math.round((aCoords.x * size - ixMin) / gZoomFactor);
- var iyoff = Math.round((aCoords.y * size - iyMin) / gZoomFactor);
- // Would be nice to draw directly from the blob, but that crashes:
- // gMapContext.drawImage(aImage, ixoff, iyoff);
- var URL = window.URL;
- var imgURL = URL.createObjectURL(aImage);
- var imgObj = new Image();
- imgObj.src = imgURL;
- imgObj.onload = function() {
- gMapContext.drawImage(imgObj, ixoff, iyoff);
- URL.revokeObjectURL(imgURL);
+ // Only go to the drawing step if we need to draw this tile.
+ if (x < tiles.left || x > tiles.right ||
+ y < tiles.top || y > tiles.bottom) {
+ // Round here is **CRUCIAL** otherwise the images are filtered
+ // and the performance sucks (more than expected).
+ var xoff = Math.round((x * size - xMin) / gZoomFactor);
+ var yoff = Math.round((y * size - yMin) / gZoomFactor);
+ // Draw placeholder tile unless we overdraw.
+ if (!aOverdraw &&
+ (x < tiles.left -1 || x > tiles.right + 1 ||
+ y < tiles.top -1 || y > tiles.bottom + 1))
+ gMapContext.drawImage(gLoadingTile, xoff, yoff);
+
+ // Initiate loading/drawing of the actual tile.
+ gTileService.get(gActiveMap, {x: x, y: y, z: gPos.z},
+ function(aImage, aStyle, aCoords) {
+ // Only draw if this applies for the current view.
+ if ((aStyle == gActiveMap) && (aCoords.z == gPos.z)) {
+ var ixMin = gPos.x - wid / 2;
+ var iyMin = gPos.y - ht / 2;
+ var ixoff = Math.round((aCoords.x * size - ixMin) / gZoomFactor);
+ var iyoff = Math.round((aCoords.y * size - iyMin) / gZoomFactor);
+ var URL = window.URL;
+ var imgURL = URL.createObjectURL(aImage);
+ var imgObj = new Image();
+ imgObj.src = imgURL;
+ imgObj.onload = function() {
+ gMapContext.drawImage(imgObj, ixoff, iyoff);
+ URL.revokeObjectURL(imgURL);
+ }