ashatora/openlayers
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Use blocked scoped variables

Browse Source 
In addition to using const and let, this also upgrades our linter config and removes lint (mostly whitespace).
This commit is contained in:
Tim Schaub
2018-01-11 23:32:36 -07:00
parent 0bf2b04dee
commit ad62739a6e
684 changed files with 18120 additions and 18184 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/ol/renderer/canvas/ImageLayer.js
+37 -37
View File
@@ -21,7 +21,7 @@ import _ol_transform_ from '../../transform.js';
* @param {ol.layer.Image} imageLayer Single image layer.
* @api
*/
var CanvasImageLayerRenderer = function(imageLayer) {
const CanvasImageLayerRenderer = function(imageLayer) {
IntermediateCanvasRenderer.call(this, imageLayer);
@@ -73,11 +73,11 @@ CanvasImageLayerRenderer['handles'] = function(type, layer) {
* @return {ol.renderer.canvas.ImageLayer} The layer renderer.
*/
CanvasImageLayerRenderer['create'] = function(mapRenderer, layer) {
var renderer = new CanvasImageLayerRenderer(/** @type {ol.layer.Image} */ (layer));
const renderer = new CanvasImageLayerRenderer(/** @type {ol.layer.Image} */ (layer));
if (layer.getType() === LayerType.VECTOR) {
var candidates = getLayerRendererPlugins();
for (var i = 0, ii = candidates.length; i < ii; ++i) {
var candidate = /** @type {Object.<string, Function>} */ (candidates[i]);
const candidates = getLayerRendererPlugins();
for (let i = 0, ii = candidates.length; i < ii; ++i) {
const candidate = /** @type {Object.<string, Function>} */ (candidates[i]);
if (candidate !== CanvasImageLayerRenderer && candidate['handles'](RendererType.CANVAS, layer)) {
renderer.setVectorRenderer(candidate['create'](mapRenderer, layer));
}
@@ -108,36 +108,36 @@ CanvasImageLayerRenderer.prototype.getImageTransform = function() {
*/
CanvasImageLayerRenderer.prototype.prepareFrame = function(frameState, layerState) {
var pixelRatio = frameState.pixelRatio;
var size = frameState.size;
var viewState = frameState.viewState;
var viewCenter = viewState.center;
var viewResolution = viewState.resolution;
const pixelRatio = frameState.pixelRatio;
const size = frameState.size;
const viewState = frameState.viewState;
const viewCenter = viewState.center;
const viewResolution = viewState.resolution;
var image;
var imageLayer = /** @type {ol.layer.Image} */ (this.getLayer());
var imageSource = imageLayer.getSource();
let image;
const imageLayer = /** @type {ol.layer.Image} */ (this.getLayer());
const imageSource = imageLayer.getSource();
var hints = frameState.viewHints;
const hints = frameState.viewHints;
var renderedExtent = frameState.extent;
let renderedExtent = frameState.extent;
if (layerState.extent !== undefined) {
renderedExtent = getIntersection(renderedExtent, layerState.extent);
}
if (!hints[ViewHint.ANIMATING] && !hints[ViewHint.INTERACTING] &&
!isEmpty(renderedExtent)) {
var projection = viewState.projection;
let projection = viewState.projection;
if (!ENABLE_RASTER_REPROJECTION) {
var sourceProjection = imageSource.getProjection();
const sourceProjection = imageSource.getProjection();
if (sourceProjection) {
projection = sourceProjection;
}
}
var vectorRenderer = this.vectorRenderer_;
const vectorRenderer = this.vectorRenderer_;
if (vectorRenderer) {
var context = vectorRenderer.context;
var imageFrameState = /** @type {olx.FrameState} */ (_ol_obj_.assign({}, frameState, {
const context = vectorRenderer.context;
const imageFrameState = /** @type {olx.FrameState} */ (_ol_obj_.assign({}, frameState, {
size: [
getWidth(renderedExtent) / viewResolution,
getHeight(renderedExtent) / viewResolution
@@ -146,7 +146,7 @@ CanvasImageLayerRenderer.prototype.prepareFrame = function(frameState, layerStat
rotation: 0
}))
}));
var skippedFeatures = Object.keys(imageFrameState.skippedFeatureUids).sort();
const skippedFeatures = Object.keys(imageFrameState.skippedFeatureUids).sort();
if (vectorRenderer.prepareFrame(imageFrameState, layerState) &&
(vectorRenderer.replayGroupChanged ||
!equals(skippedFeatures, this.skippedFeatures_))) {
@@ -158,9 +158,9 @@ CanvasImageLayerRenderer.prototype.prepareFrame = function(frameState, layerStat
}
} else {
image = imageSource.getImage(
renderedExtent, viewResolution, pixelRatio, projection);
renderedExtent, viewResolution, pixelRatio, projection);
if (image) {
var loaded = this.loadImage(image);
const loaded = this.loadImage(image);
if (loaded) {
this.image_ = image;
}
@@ -170,22 +170,22 @@ CanvasImageLayerRenderer.prototype.prepareFrame = function(frameState, layerStat
if (this.image_) {
image = this.image_;
var imageExtent = image.getExtent();
var imageResolution = image.getResolution();
var imagePixelRatio = image.getPixelRatio();
var scale = pixelRatio * imageResolution /
const imageExtent = image.getExtent();
const imageResolution = image.getResolution();
const imagePixelRatio = image.getPixelRatio();
const scale = pixelRatio * imageResolution /
(viewResolution * imagePixelRatio);
var transform = _ol_transform_.compose(this.imageTransform_,
pixelRatio * size[0] / 2, pixelRatio * size[1] / 2,
scale, scale,
0,
imagePixelRatio * (imageExtent[0] - viewCenter[0]) / imageResolution,
imagePixelRatio * (viewCenter[1] - imageExtent[3]) / imageResolution);
const transform = _ol_transform_.compose(this.imageTransform_,
pixelRatio * size[0] / 2, pixelRatio * size[1] / 2,
scale, scale,
0,
imagePixelRatio * (imageExtent[0] - viewCenter[0]) / imageResolution,
imagePixelRatio * (viewCenter[1] - imageExtent[3]) / imageResolution);
_ol_transform_.compose(this.coordinateToCanvasPixelTransform,
pixelRatio * size[0] / 2 - transform[4], pixelRatio * size[1] / 2 - transform[5],
pixelRatio / viewResolution, -pixelRatio / viewResolution,
0,
-viewCenter[0], -viewCenter[1]);
pixelRatio * size[0] / 2 - transform[4], pixelRatio * size[1] / 2 - transform[5],
pixelRatio / viewResolution, -pixelRatio / viewResolution,
0,
-viewCenter[0], -viewCenter[1]);
this.renderedResolution = imageResolution * pixelRatio / imagePixelRatio;
}
src/ol/renderer/canvas/IntermediateCanvas.js
+23 -23
View File
@@ -14,7 +14,7 @@ import _ol_transform_ from '../../transform.js';
* @extends {ol.renderer.canvas.Layer}
* @param {ol.layer.Layer} layer Layer.
*/
var IntermediateCanvasRenderer = function(layer) {
const IntermediateCanvasRenderer = function(layer) {
CanvasLayerRenderer.call(this, layer);
@@ -42,33 +42,33 @@ IntermediateCanvasRenderer.prototype.composeFrame = function(frameState, layerSt
this.preCompose(context, frameState);
var image = this.getImage();
const image = this.getImage();
if (image) {
// clipped rendering if layer extent is set
var extent = layerState.extent;
var clipped = extent !== undefined &&
const extent = layerState.extent;
const clipped = extent !== undefined &&
!containsExtent(extent, frameState.extent) &&
intersects(extent, frameState.extent);
if (clipped) {
this.clip(context, frameState, /** @type {ol.Extent} */ (extent));
}
var imageTransform = this.getImageTransform();
const imageTransform = this.getImageTransform();
// for performance reasons, context.save / context.restore is not used
// to save and restore the transformation matrix and the opacity.
// see http://jsperf.com/context-save-restore-versus-variable
var alpha = context.globalAlpha;
const alpha = context.globalAlpha;
context.globalAlpha = layerState.opacity;
// for performance reasons, context.setTransform is only used
// when the view is rotated. see http://jsperf.com/canvas-transform
var dx = imageTransform[4];
var dy = imageTransform[5];
var dw = image.width * imageTransform[0];
var dh = image.height * imageTransform[3];
const dx = imageTransform[4];
const dy = imageTransform[5];
const dw = image.width * imageTransform[0];
const dh = image.height * imageTransform[3];
context.drawImage(image, 0, 0, +image.width, +image.height,
Math.round(dx), Math.round(dy), Math.round(dw), Math.round(dh));
Math.round(dx), Math.round(dy), Math.round(dw), Math.round(dh));
context.globalAlpha = alpha;
if (clipped) {
@@ -98,20 +98,20 @@ IntermediateCanvasRenderer.prototype.getImageTransform = function() {};
* @inheritDoc
*/
IntermediateCanvasRenderer.prototype.forEachFeatureAtCoordinate = function(coordinate, frameState, hitTolerance, callback, thisArg) {
var layer = this.getLayer();
var source = layer.getSource();
var resolution = frameState.viewState.resolution;
var rotation = frameState.viewState.rotation;
var skippedFeatureUids = frameState.skippedFeatureUids;
const layer = this.getLayer();
const source = layer.getSource();
const resolution = frameState.viewState.resolution;
const rotation = frameState.viewState.rotation;
const skippedFeatureUids = frameState.skippedFeatureUids;
return source.forEachFeatureAtCoordinate(
coordinate, resolution, rotation, hitTolerance, skippedFeatureUids,
/**
coordinate, resolution, rotation, hitTolerance, skippedFeatureUids,
/**
* @param {ol.Feature|ol.render.Feature} feature Feature.
* @return {?} Callback result.
*/
function(feature) {
return callback.call(thisArg, feature, layer);
});
function(feature) {
return callback.call(thisArg, feature, layer);
});
};
@@ -128,7 +128,7 @@ IntermediateCanvasRenderer.prototype.forEachLayerAtCoordinate = function(coordin
// so that for example also transparent polygons are detected
return CanvasLayerRenderer.prototype.forEachLayerAtCoordinate.apply(this, arguments);
} else {
var pixel = _ol_transform_.apply(this.coordinateToCanvasPixelTransform, coordinate.slice());
const pixel = _ol_transform_.apply(this.coordinateToCanvasPixelTransform, coordinate.slice());
_ol_coordinate_.scale(pixel, frameState.viewState.resolution / this.renderedResolution);
if (!this.hitCanvasContext_) {
@@ -138,7 +138,7 @@ IntermediateCanvasRenderer.prototype.forEachLayerAtCoordinate = function(coordin
this.hitCanvasContext_.clearRect(0, 0, 1, 1);
this.hitCanvasContext_.drawImage(this.getImage(), pixel[0], pixel[1], 1, 1, 0, 0, 1, 1);
var imageData = this.hitCanvasContext_.getImageData(0, 0, 1, 1).data;
const imageData = this.hitCanvasContext_.getImageData(0, 0, 1, 1).data;
if (imageData[3] > 0) {
return callback.call(thisArg, this.getLayer(), imageData);
} else {
src/ol/renderer/canvas/Layer.js
+29 -29
View File
@@ -17,7 +17,7 @@ import _ol_transform_ from '../../transform.js';
* @extends {ol.renderer.Layer}
* @param {ol.layer.Layer} layer Layer.
*/
var CanvasLayerRenderer = function(layer) {
const CanvasLayerRenderer = function(layer) {
LayerRenderer.call(this, layer);
@@ -45,14 +45,14 @@ inherits(CanvasLayerRenderer, LayerRenderer);
* @protected
*/
CanvasLayerRenderer.prototype.clip = function(context, frameState, extent) {
var pixelRatio = frameState.pixelRatio;
var width = frameState.size[0] * pixelRatio;
var height = frameState.size[1] * pixelRatio;
var rotation = frameState.viewState.rotation;
var topLeft = getTopLeft(/** @type {ol.Extent} */ (extent));
var topRight = getTopRight(/** @type {ol.Extent} */ (extent));
var bottomRight = getBottomRight(/** @type {ol.Extent} */ (extent));
var bottomLeft = getBottomLeft(/** @type {ol.Extent} */ (extent));
const pixelRatio = frameState.pixelRatio;
const width = frameState.size[0] * pixelRatio;
const height = frameState.size[1] * pixelRatio;
const rotation = frameState.viewState.rotation;
const topLeft = getTopLeft(/** @type {ol.Extent} */ (extent));
const topRight = getTopRight(/** @type {ol.Extent} */ (extent));
const bottomRight = getBottomRight(/** @type {ol.Extent} */ (extent));
const bottomLeft = getBottomLeft(/** @type {ol.Extent} */ (extent));
_ol_transform_.apply(frameState.coordinateToPixelTransform, topLeft);
_ol_transform_.apply(frameState.coordinateToPixelTransform, topRight);
@@ -79,19 +79,19 @@ CanvasLayerRenderer.prototype.clip = function(context, frameState, extent) {
* @private
*/
CanvasLayerRenderer.prototype.dispatchComposeEvent_ = function(type, context, frameState, opt_transform) {
var layer = this.getLayer();
const layer = this.getLayer();
if (layer.hasListener(type)) {
var width = frameState.size[0] * frameState.pixelRatio;
var height = frameState.size[1] * frameState.pixelRatio;
var rotation = frameState.viewState.rotation;
const width = frameState.size[0] * frameState.pixelRatio;
const height = frameState.size[1] * frameState.pixelRatio;
const rotation = frameState.viewState.rotation;
_ol_render_canvas_.rotateAtOffset(context, -rotation, width / 2, height / 2);
var transform = opt_transform !== undefined ?
const transform = opt_transform !== undefined ?
opt_transform : this.getTransform(frameState, 0);
var render = new CanvasImmediateRenderer(
context, frameState.pixelRatio, frameState.extent, transform,
frameState.viewState.rotation);
var composeEvent = new RenderEvent(type, render, frameState,
context, null);
const render = new CanvasImmediateRenderer(
context, frameState.pixelRatio, frameState.extent, transform,
frameState.viewState.rotation);
const composeEvent = new RenderEvent(type, render, frameState,
context, null);
layer.dispatchEvent(composeEvent);
_ol_render_canvas_.rotateAtOffset(context, rotation, width / 2, height / 2);
}
@@ -108,7 +108,7 @@ CanvasLayerRenderer.prototype.dispatchComposeEvent_ = function(type, context, fr
* @template S,T,U
*/
CanvasLayerRenderer.prototype.forEachLayerAtCoordinate = function(coordinate, frameState, callback, thisArg) {
var hasFeature = this.forEachFeatureAtCoordinate(coordinate, frameState, 0, TRUE, this);
const hasFeature = this.forEachFeatureAtCoordinate(coordinate, frameState, 0, TRUE, this);
if (hasFeature) {
return callback.call(thisArg, this.getLayer(), null);
@@ -159,15 +159,15 @@ CanvasLayerRenderer.prototype.dispatchRenderEvent = function(context, frameState
* @return {!ol.Transform} Transform.
*/
CanvasLayerRenderer.prototype.getTransform = function(frameState, offsetX) {
var viewState = frameState.viewState;
var pixelRatio = frameState.pixelRatio;
var dx1 = pixelRatio * frameState.size[0] / 2;
var dy1 = pixelRatio * frameState.size[1] / 2;
var sx = pixelRatio / viewState.resolution;
var sy = -sx;
var angle = -viewState.rotation;
var dx2 = -viewState.center[0] + offsetX;
var dy2 = -viewState.center[1];
const viewState = frameState.viewState;
const pixelRatio = frameState.pixelRatio;
const dx1 = pixelRatio * frameState.size[0] / 2;
const dy1 = pixelRatio * frameState.size[1] / 2;
const sx = pixelRatio / viewState.resolution;
const sy = -sx;
const angle = -viewState.rotation;
const dx2 = -viewState.center[0] + offsetX;
const dy2 = -viewState.center[1];
return _ol_transform_.compose(this.transform_, dx1, dy1, sx, sy, angle, dx2, dy2);
};
src/ol/renderer/canvas/Map.js
+41 -41
View File
@@ -24,7 +24,7 @@ import SourceState from '../../source/State.js';
* @param {ol.PluggableMap} map Map.
* @api
*/
var CanvasMapRenderer = function(container, map) {
const CanvasMapRenderer = function(container, map) {
MapRenderer.call(this, container, map);
@@ -90,20 +90,20 @@ CanvasMapRenderer['create'] = function(container, map) {
* @private
*/
CanvasMapRenderer.prototype.dispatchComposeEvent_ = function(type, frameState) {
var map = this.getMap();
var context = this.context_;
const map = this.getMap();
const context = this.context_;
if (map.hasListener(type)) {
var extent = frameState.extent;
var pixelRatio = frameState.pixelRatio;
var viewState = frameState.viewState;
var rotation = viewState.rotation;
const extent = frameState.extent;
const pixelRatio = frameState.pixelRatio;
const viewState = frameState.viewState;
const rotation = viewState.rotation;
var transform = this.getTransform(frameState);
const transform = this.getTransform(frameState);
var vectorContext = new CanvasImmediateRenderer(context, pixelRatio,
extent, transform, rotation);
var composeEvent = new RenderEvent(type, vectorContext,
frameState, context, null);
const vectorContext = new CanvasImmediateRenderer(context, pixelRatio,
extent, transform, rotation);
const composeEvent = new RenderEvent(type, vectorContext,
frameState, context, null);
map.dispatchEvent(composeEvent);
}
};
@@ -115,14 +115,14 @@ CanvasMapRenderer.prototype.dispatchComposeEvent_ = function(type, frameState) {
* @return {!ol.Transform} Transform.
*/
CanvasMapRenderer.prototype.getTransform = function(frameState) {
var viewState = frameState.viewState;
var dx1 = this.canvas_.width / 2;
var dy1 = this.canvas_.height / 2;
var sx = frameState.pixelRatio / viewState.resolution;
var sy = -sx;
var angle = -viewState.rotation;
var dx2 = -viewState.center[0];
var dy2 = -viewState.center[1];
const viewState = frameState.viewState;
const dx1 = this.canvas_.width / 2;
const dy1 = this.canvas_.height / 2;
const sx = frameState.pixelRatio / viewState.resolution;
const sy = -sx;
const angle = -viewState.rotation;
const dx2 = -viewState.center[0];
const dy2 = -viewState.center[1];
return _ol_transform_.compose(this.transform_, dx1, dy1, sx, sy, angle, dx2, dy2);
};
@@ -148,10 +148,10 @@ CanvasMapRenderer.prototype.renderFrame = function(frameState) {
return;
}
var context = this.context_;
var pixelRatio = frameState.pixelRatio;
var width = Math.round(frameState.size[0] * pixelRatio);
var height = Math.round(frameState.size[1] * pixelRatio);
const context = this.context_;
const pixelRatio = frameState.pixelRatio;
const width = Math.round(frameState.size[0] * pixelRatio);
const height = Math.round(frameState.size[1] * pixelRatio);
if (this.canvas_.width != width || this.canvas_.height != height) {
this.canvas_.width = width;
this.canvas_.height = height;
@@ -159,13 +159,13 @@ CanvasMapRenderer.prototype.renderFrame = function(frameState) {
context.clearRect(0, 0, width, height);
}
var rotation = frameState.viewState.rotation;
const rotation = frameState.viewState.rotation;
this.calculateMatrices2D(frameState);
this.dispatchComposeEvent_(RenderEventType.PRECOMPOSE, frameState);
var layerStatesArray = frameState.layerStatesArray;
const layerStatesArray = frameState.layerStatesArray;
stableSort(layerStatesArray, MapRenderer.sortByZIndex);
if (rotation) {
@@ -173,8 +173,8 @@ CanvasMapRenderer.prototype.renderFrame = function(frameState) {
_ol_render_canvas_.rotateAtOffset(context, rotation, width / 2, height / 2);
}
var viewResolution = frameState.viewState.resolution;
var i, ii, layer, layerRenderer, layerState;
const viewResolution = frameState.viewState.resolution;
let i, ii, layer, layerRenderer, layerState;
for (i = 0, ii = layerStatesArray.length; i < ii; ++i) {
layerState = layerStatesArray[i];
layer = layerState.layer;
@@ -208,26 +208,26 @@ CanvasMapRenderer.prototype.renderFrame = function(frameState) {
* @inheritDoc
*/
CanvasMapRenderer.prototype.forEachLayerAtPixel = function(pixel, frameState, callback, thisArg,
layerFilter, thisArg2) {
var result;
var viewState = frameState.viewState;
var viewResolution = viewState.resolution;
layerFilter, thisArg2) {
let result;
const viewState = frameState.viewState;
const viewResolution = viewState.resolution;
var layerStates = frameState.layerStatesArray;
var numLayers = layerStates.length;
const layerStates = frameState.layerStatesArray;
const numLayers = layerStates.length;
var coordinate = _ol_transform_.apply(
frameState.pixelToCoordinateTransform, pixel.slice());
const coordinate = _ol_transform_.apply(
frameState.pixelToCoordinateTransform, pixel.slice());
var i;
let i;
for (i = numLayers - 1; i >= 0; --i) {
var layerState = layerStates[i];
var layer = layerState.layer;
const layerState = layerStates[i];
const layer = layerState.layer;
if (Layer.visibleAtResolution(layerState, viewResolution) &&
layerFilter.call(thisArg2, layer)) {
var layerRenderer = /** @type {ol.renderer.canvas.Layer} */ (this.getLayerRenderer(layer));
const layerRenderer = /** @type {ol.renderer.canvas.Layer} */ (this.getLayerRenderer(layer));
result = layerRenderer.forEachLayerAtCoordinate(
coordinate, frameState, callback, thisArg);
coordinate, frameState, callback, thisArg);
if (result) {
return result;
}
src/ol/renderer/canvas/TileLayer.js
+63 -63
View File
@@ -18,7 +18,7 @@ import _ol_transform_ from '../../transform.js';
* @param {ol.layer.Tile|ol.layer.VectorTile} tileLayer Tile layer.
* @api
*/
var CanvasTileLayerRenderer = function(tileLayer) {
const CanvasTileLayerRenderer = function(tileLayer) {
IntermediateCanvasRenderer.call(this, tileLayer);
@@ -109,8 +109,8 @@ CanvasTileLayerRenderer['create'] = function(mapRenderer, layer) {
* @return {boolean} Tile is drawable.
*/
CanvasTileLayerRenderer.prototype.isDrawableTile_ = function(tile) {
var tileState = tile.getState();
var useInterimTilesOnError = this.getLayer().getUseInterimTilesOnError();
const tileState = tile.getState();
const useInterimTilesOnError = this.getLayer().getUseInterimTilesOnError();
return tileState == TileState.LOADED ||
tileState == TileState.EMPTY ||
tileState == TileState.ERROR && !useInterimTilesOnError;
@@ -121,21 +121,21 @@ CanvasTileLayerRenderer.prototype.isDrawableTile_ = function(tile) {
*/
CanvasTileLayerRenderer.prototype.prepareFrame = function(frameState, layerState) {
var pixelRatio = frameState.pixelRatio;
var size = frameState.size;
var viewState = frameState.viewState;
var projection = viewState.projection;
var viewResolution = viewState.resolution;
var viewCenter = viewState.center;
const pixelRatio = frameState.pixelRatio;
const size = frameState.size;
const viewState = frameState.viewState;
const projection = viewState.projection;
const viewResolution = viewState.resolution;
const viewCenter = viewState.center;
var tileLayer = this.getLayer();
var tileSource = /** @type {ol.source.Tile} */ (tileLayer.getSource());
var sourceRevision = tileSource.getRevision();
var tileGrid = tileSource.getTileGridForProjection(projection);
var z = tileGrid.getZForResolution(viewResolution, this.zDirection);
var tileResolution = tileGrid.getResolution(z);
var oversampling = Math.round(viewResolution / tileResolution) || 1;
var extent = frameState.extent;
const tileLayer = this.getLayer();
const tileSource = /** @type {ol.source.Tile} */ (tileLayer.getSource());
const sourceRevision = tileSource.getRevision();
const tileGrid = tileSource.getTileGridForProjection(projection);
const z = tileGrid.getZForResolution(viewResolution, this.zDirection);
const tileResolution = tileGrid.getResolution(z);
let oversampling = Math.round(viewResolution / tileResolution) || 1;
let extent = frameState.extent;
if (layerState.extent !== undefined) {
extent = getIntersection(extent, layerState.extent);
@@ -145,24 +145,24 @@ CanvasTileLayerRenderer.prototype.prepareFrame = function(frameState, layerState
return false;
}
var tileRange = tileGrid.getTileRangeForExtentAndZ(extent, z);
var imageExtent = tileGrid.getTileRangeExtent(z, tileRange);
const tileRange = tileGrid.getTileRangeForExtentAndZ(extent, z);
const imageExtent = tileGrid.getTileRangeExtent(z, tileRange);
var tilePixelRatio = tileSource.getTilePixelRatio(pixelRatio);
const tilePixelRatio = tileSource.getTilePixelRatio(pixelRatio);
/**
* @type {Object.<number, Object.<string, ol.Tile>>}
*/
var tilesToDrawByZ = {};
const tilesToDrawByZ = {};
tilesToDrawByZ[z] = {};
var findLoadedTiles = this.createLoadedTileFinder(
tileSource, projection, tilesToDrawByZ);
const findLoadedTiles = this.createLoadedTileFinder(
tileSource, projection, tilesToDrawByZ);
var tmpExtent = this.tmpExtent;
var tmpTileRange = this.tmpTileRange_;
var newTiles = false;
var tile, x, y;
const tmpExtent = this.tmpExtent;
const tmpTileRange = this.tmpTileRange_;
let newTiles = false;
let tile, x, y;
for (x = tileRange.minX; x <= tileRange.maxX; ++x) {
for (y = tileRange.minY; y <= tileRange.maxY; ++y) {
tile = tileSource.getTile(z, x, y, pixelRatio, projection);
@@ -179,10 +179,10 @@ CanvasTileLayerRenderer.prototype.prepareFrame = function(frameState, layerState
tile = tile.getInterimTile();
}
if (this.isDrawableTile_(tile)) {
var uid = getUid(this);
const uid = getUid(this);
if (tile.getState() == TileState.LOADED) {
tilesToDrawByZ[z][tile.tileCoord.toString()] = tile;
var inTransition = tile.inTransition(uid);
const inTransition = tile.inTransition(uid);
if (!newTiles && (inTransition || this.renderedTiles.indexOf(tile) === -1)) {
newTiles = true;
}
@@ -193,23 +193,23 @@ CanvasTileLayerRenderer.prototype.prepareFrame = function(frameState, layerState
}
}
var childTileRange = tileGrid.getTileCoordChildTileRange(
tile.tileCoord, tmpTileRange, tmpExtent);
var covered = false;
const childTileRange = tileGrid.getTileCoordChildTileRange(
tile.tileCoord, tmpTileRange, tmpExtent);
let covered = false;
if (childTileRange) {
covered = findLoadedTiles(z + 1, childTileRange);
}
if (!covered) {
tileGrid.forEachTileCoordParentTileRange(
tile.tileCoord, findLoadedTiles, null, tmpTileRange, tmpExtent);
tile.tileCoord, findLoadedTiles, null, tmpTileRange, tmpExtent);
}
}
}
var renderedResolution = tileResolution * pixelRatio / tilePixelRatio * oversampling;
var hints = frameState.viewHints;
var animatingOrInteracting = hints[ViewHint.ANIMATING] || hints[ViewHint.INTERACTING];
const renderedResolution = tileResolution * pixelRatio / tilePixelRatio * oversampling;
const hints = frameState.viewHints;
const animatingOrInteracting = hints[ViewHint.ANIMATING] || hints[ViewHint.INTERACTING];
if (!(this.renderedResolution && Date.now() - frameState.time > 16 && animatingOrInteracting) && (
newTiles ||
!(this.renderedExtent_ && containsExtent(this.renderedExtent_, extent)) ||
@@ -218,12 +218,12 @@ CanvasTileLayerRenderer.prototype.prepareFrame = function(frameState, layerState
!animatingOrInteracting && renderedResolution != this.renderedResolution
)) {
var context = this.context;
const context = this.context;
if (context) {
var tilePixelSize = tileSource.getTilePixelSize(z, pixelRatio, projection);
var width = Math.round(tileRange.getWidth() * tilePixelSize[0] / oversampling);
var height = Math.round(tileRange.getHeight() * tilePixelSize[1] / oversampling);
var canvas = context.canvas;
const tilePixelSize = tileSource.getTilePixelSize(z, pixelRatio, projection);
const width = Math.round(tileRange.getWidth() * tilePixelSize[0] / oversampling);
const height = Math.round(tileRange.getHeight() * tilePixelSize[1] / oversampling);
const canvas = context.canvas;
if (canvas.width != width || canvas.height != height) {
this.oversampling_ = oversampling;
canvas.width = width;
@@ -238,7 +238,7 @@ CanvasTileLayerRenderer.prototype.prepareFrame = function(frameState, layerState
this.renderedTiles.length = 0;
/** @type {Array.<number>} */
var zs = Object.keys(tilesToDrawByZ).map(Number);
const zs = Object.keys(tilesToDrawByZ).map(Number);
zs.sort(function(a, b) {
if (a === z) {
return 1;
@@ -248,8 +248,8 @@ CanvasTileLayerRenderer.prototype.prepareFrame = function(frameState, layerState
return a > b ? 1 : a < b ? -1 : 0;
}
});
var currentResolution, currentScale, currentTilePixelSize, currentZ, i, ii;
var tileExtent, tileGutter, tilesToDraw, w, h;
let currentResolution, currentScale, currentTilePixelSize, currentZ, i, ii;
let tileExtent, tileGutter, tilesToDraw, w, h;
for (i = 0, ii = zs.length; i < ii; ++i) {
currentZ = zs[i];
currentTilePixelSize = tileSource.getTilePixelSize(currentZ, pixelRatio, projection);
@@ -257,7 +257,7 @@ CanvasTileLayerRenderer.prototype.prepareFrame = function(frameState, layerState
currentScale = currentResolution / tileResolution;
tileGutter = tilePixelRatio * tileSource.getGutter(projection);
tilesToDraw = tilesToDrawByZ[currentZ];
for (var tileCoordKey in tilesToDraw) {
for (const tileCoordKey in tilesToDraw) {
tile = tilesToDraw[tileCoordKey];
tileExtent = tileGrid.getTileCoordExtent(tile.getTileCoord(), tmpExtent);
x = (tileExtent[0] - imageExtent[0]) / tileResolution * tilePixelRatio / oversampling;
@@ -274,23 +274,23 @@ CanvasTileLayerRenderer.prototype.prepareFrame = function(frameState, layerState
this.renderedExtent_ = imageExtent;
}
var scale = this.renderedResolution / viewResolution;
var transform = _ol_transform_.compose(this.imageTransform_,
pixelRatio * size[0] / 2, pixelRatio * size[1] / 2,
scale, scale,
0,
(this.renderedExtent_[0] - viewCenter[0]) / this.renderedResolution * pixelRatio,
(viewCenter[1] - this.renderedExtent_[3]) / this.renderedResolution * pixelRatio);
const scale = this.renderedResolution / viewResolution;
const transform = _ol_transform_.compose(this.imageTransform_,
pixelRatio * size[0] / 2, pixelRatio * size[1] / 2,
scale, scale,
0,
(this.renderedExtent_[0] - viewCenter[0]) / this.renderedResolution * pixelRatio,
(viewCenter[1] - this.renderedExtent_[3]) / this.renderedResolution * pixelRatio);
_ol_transform_.compose(this.coordinateToCanvasPixelTransform,
pixelRatio * size[0] / 2 - transform[4], pixelRatio * size[1] / 2 - transform[5],
pixelRatio / viewResolution, -pixelRatio / viewResolution,
0,
-viewCenter[0], -viewCenter[1]);
pixelRatio * size[0] / 2 - transform[4], pixelRatio * size[1] / 2 - transform[5],
pixelRatio / viewResolution, -pixelRatio / viewResolution,
0,
-viewCenter[0], -viewCenter[1]);
this.updateUsedTiles(frameState.usedTiles, tileSource, z, tileRange);
this.manageTilePyramid(frameState, tileSource, tileGrid, pixelRatio,
projection, extent, z, tileLayer.getPreload());
projection, extent, z, tileLayer.getPreload());
this.scheduleExpireCache(frameState, tileSource);
return this.renderedTiles.length > 0;
@@ -309,22 +309,22 @@ CanvasTileLayerRenderer.prototype.prepareFrame = function(frameState, layerState
* @param {boolean} transition Apply an alpha transition.
*/
CanvasTileLayerRenderer.prototype.drawTileImage = function(tile, frameState, layerState, x, y, w, h, gutter, transition) {
var image = tile.getImage(this.getLayer());
const image = tile.getImage(this.getLayer());
if (!image) {
return;
}
var uid = getUid(this);
var alpha = transition ? tile.getAlpha(uid, frameState.time) : 1;
const uid = getUid(this);
const alpha = transition ? tile.getAlpha(uid, frameState.time) : 1;
if (alpha === 1 && !this.getLayer().getSource().getOpaque(frameState.viewState.projection)) {
this.context.clearRect(x, y, w, h);
}
var alphaChanged = alpha !== this.context.globalAlpha;
const alphaChanged = alpha !== this.context.globalAlpha;
if (alphaChanged) {
this.context.save();
this.context.globalAlpha = alpha;
}
this.context.drawImage(image, gutter, gutter,
image.width - 2 * gutter, image.height - 2 * gutter, x, y, w, h);
image.width - 2 * gutter, image.height - 2 * gutter, x, y, w, h);
if (alphaChanged) {
this.context.restore();
@@ -341,7 +341,7 @@ CanvasTileLayerRenderer.prototype.drawTileImage = function(tile, frameState, lay
* @inheritDoc
*/
CanvasTileLayerRenderer.prototype.getImage = function() {
var context = this.context;
const context = this.context;
return context ? context.canvas : null;
};
src/ol/renderer/canvas/VectorLayer.js
+88 -88
View File
@@ -22,7 +22,7 @@ import _ol_renderer_vector_ from '../vector.js';
* @param {ol.layer.Vector} vectorLayer Vector layer.
* @api
*/
var CanvasVectorLayerRenderer = function(vectorLayer) {
const CanvasVectorLayerRenderer = function(vectorLayer) {
CanvasLayerRenderer.call(this, vectorLayer);
@@ -122,42 +122,42 @@ CanvasVectorLayerRenderer.prototype.disposeInternal = function() {
*/
CanvasVectorLayerRenderer.prototype.composeFrame = function(frameState, layerState, context) {
var extent = frameState.extent;
var pixelRatio = frameState.pixelRatio;
var skippedFeatureUids = layerState.managed ?
const extent = frameState.extent;
const pixelRatio = frameState.pixelRatio;
const skippedFeatureUids = layerState.managed ?
frameState.skippedFeatureUids : {};
var viewState = frameState.viewState;
var projection = viewState.projection;
var rotation = viewState.rotation;
var projectionExtent = projection.getExtent();
var vectorSource = /** @type {ol.source.Vector} */ (this.getLayer().getSource());
const viewState = frameState.viewState;
const projection = viewState.projection;
const rotation = viewState.rotation;
const projectionExtent = projection.getExtent();
const vectorSource = /** @type {ol.source.Vector} */ (this.getLayer().getSource());
var transform = this.getTransform(frameState, 0);
let transform = this.getTransform(frameState, 0);
this.preCompose(context, frameState, transform);
// clipped rendering if layer extent is set
var clipExtent = layerState.extent;
var clipped = clipExtent !== undefined;
const clipExtent = layerState.extent;
const clipped = clipExtent !== undefined;
if (clipped) {
this.clip(context, frameState, /** @type {ol.Extent} */ (clipExtent));
}
var replayGroup = this.replayGroup_;
const replayGroup = this.replayGroup_;
if (replayGroup && !replayGroup.isEmpty()) {
if (this.declutterTree_) {
this.declutterTree_.clear();
}
var layer = /** @type {ol.layer.Vector} */ (this.getLayer());
var drawOffsetX = 0;
var drawOffsetY = 0;
var replayContext;
var transparentLayer = layerState.opacity !== 1;
var hasRenderListeners = layer.hasListener(RenderEventType.RENDER);
const layer = /** @type {ol.layer.Vector} */ (this.getLayer());
let drawOffsetX = 0;
let drawOffsetY = 0;
let replayContext;
const transparentLayer = layerState.opacity !== 1;
const hasRenderListeners = layer.hasListener(RenderEventType.RENDER);
if (transparentLayer || hasRenderListeners) {
var drawWidth = context.canvas.width;
var drawHeight = context.canvas.height;
let drawWidth = context.canvas.width;
let drawHeight = context.canvas.height;
if (rotation) {
var drawSize = Math.round(Math.sqrt(drawWidth * drawWidth + drawHeight * drawHeight));
const drawSize = Math.round(Math.sqrt(drawWidth * drawWidth + drawHeight * drawHeight));
drawOffsetX = (drawSize - drawWidth) / 2;
drawOffsetY = (drawSize - drawHeight) / 2;
drawWidth = drawHeight = drawSize;
@@ -170,7 +170,7 @@ CanvasVectorLayerRenderer.prototype.composeFrame = function(frameState, layerSta
replayContext = context;
}
var alpha = replayContext.globalAlpha;
const alpha = replayContext.globalAlpha;
if (!transparentLayer) {
// for performance reasons, context.save / context.restore is not used
// to save and restore the transformation matrix and the opacity.
@@ -182,17 +182,17 @@ CanvasVectorLayerRenderer.prototype.composeFrame = function(frameState, layerSta
replayContext.translate(drawOffsetX, drawOffsetY);
}
var width = frameState.size[0] * pixelRatio;
var height = frameState.size[1] * pixelRatio;
const width = frameState.size[0] * pixelRatio;
const height = frameState.size[1] * pixelRatio;
_ol_render_canvas_.rotateAtOffset(replayContext, -rotation,
width / 2, height / 2);
width / 2, height / 2);
replayGroup.replay(replayContext, transform, rotation, skippedFeatureUids);
if (vectorSource.getWrapX() && projection.canWrapX() &&
!containsExtent(projectionExtent, extent)) {
var startX = extent[0];
var worldWidth = getWidth(projectionExtent);
var world = 0;
var offsetX;
let startX = extent[0];
const worldWidth = getWidth(projectionExtent);
let world = 0;
let offsetX;
while (startX < projectionExtent[0]) {
--world;
offsetX = worldWidth * world;
@@ -213,14 +213,14 @@ CanvasVectorLayerRenderer.prototype.composeFrame = function(frameState, layerSta
transform = this.getTransform(frameState, 0);
}
_ol_render_canvas_.rotateAtOffset(replayContext, rotation,
width / 2, height / 2);
width / 2, height / 2);
if (replayContext != context) {
if (hasRenderListeners) {
this.dispatchRenderEvent(replayContext, frameState, transform);
}
if (transparentLayer) {
var mainContextAlpha = context.globalAlpha;
const mainContextAlpha = context.globalAlpha;
context.globalAlpha = layerState.opacity;
context.drawImage(replayContext.canvas, -drawOffsetX, -drawOffsetY);
context.globalAlpha = mainContextAlpha;
@@ -250,24 +250,24 @@ CanvasVectorLayerRenderer.prototype.forEachFeatureAtCoordinate = function(coordi
if (!this.replayGroup_) {
return undefined;
} else {
var resolution = frameState.viewState.resolution;
var rotation = frameState.viewState.rotation;
var layer = /** @type {ol.layer.Vector} */ (this.getLayer());
const resolution = frameState.viewState.resolution;
const rotation = frameState.viewState.rotation;
const layer = /** @type {ol.layer.Vector} */ (this.getLayer());
/** @type {Object.<string, boolean>} */
var features = {};
var result = this.replayGroup_.forEachFeatureAtCoordinate(coordinate, resolution,
rotation, hitTolerance, {},
/**
const features = {};
const result = this.replayGroup_.forEachFeatureAtCoordinate(coordinate, resolution,
rotation, hitTolerance, {},
/**
* @param {ol.Feature|ol.render.Feature} feature Feature.
* @return {?} Callback result.
*/
function(feature) {
var key = getUid(feature).toString();
if (!(key in features)) {
features[key] = true;
return callback.call(thisArg, feature, layer);
}
}, null);
function(feature) {
const key = getUid(feature).toString();
if (!(key in features)) {
features[key] = true;
return callback.call(thisArg, feature, layer);
}
}, null);
return result;
}
};
@@ -277,7 +277,7 @@ CanvasVectorLayerRenderer.prototype.forEachFeatureAtCoordinate = function(coordi
* @param {ol.events.Event} event Event.
*/
CanvasVectorLayerRenderer.prototype.handleFontsChanged_ = function(event) {
var layer = this.getLayer();
const layer = this.getLayer();
if (layer.getVisible() && this.replayGroup_) {
layer.changed();
}
@@ -298,35 +298,35 @@ CanvasVectorLayerRenderer.prototype.handleStyleImageChange_ = function(event) {
* @inheritDoc
*/
CanvasVectorLayerRenderer.prototype.prepareFrame = function(frameState, layerState) {
var vectorLayer = /** @type {ol.layer.Vector} */ (this.getLayer());
var vectorSource = vectorLayer.getSource();
const vectorLayer = /** @type {ol.layer.Vector} */ (this.getLayer());
const vectorSource = vectorLayer.getSource();
var animating = frameState.viewHints[ViewHint.ANIMATING];
var interacting = frameState.viewHints[ViewHint.INTERACTING];
var updateWhileAnimating = vectorLayer.getUpdateWhileAnimating();
var updateWhileInteracting = vectorLayer.getUpdateWhileInteracting();
const animating = frameState.viewHints[ViewHint.ANIMATING];
const interacting = frameState.viewHints[ViewHint.INTERACTING];
const updateWhileAnimating = vectorLayer.getUpdateWhileAnimating();
const updateWhileInteracting = vectorLayer.getUpdateWhileInteracting();
if (!this.dirty_ && (!updateWhileAnimating && animating) ||
(!updateWhileInteracting && interacting)) {
return true;
}
var frameStateExtent = frameState.extent;
var viewState = frameState.viewState;
var projection = viewState.projection;
var resolution = viewState.resolution;
var pixelRatio = frameState.pixelRatio;
var vectorLayerRevision = vectorLayer.getRevision();
var vectorLayerRenderBuffer = vectorLayer.getRenderBuffer();
var vectorLayerRenderOrder = vectorLayer.getRenderOrder();
const frameStateExtent = frameState.extent;
const viewState = frameState.viewState;
const projection = viewState.projection;
const resolution = viewState.resolution;
const pixelRatio = frameState.pixelRatio;
const vectorLayerRevision = vectorLayer.getRevision();
const vectorLayerRenderBuffer = vectorLayer.getRenderBuffer();
let vectorLayerRenderOrder = vectorLayer.getRenderOrder();
if (vectorLayerRenderOrder === undefined) {
vectorLayerRenderOrder = _ol_renderer_vector_.defaultOrder;
}
var extent = buffer(frameStateExtent,
vectorLayerRenderBuffer * resolution);
var projectionExtent = viewState.projection.getExtent();
const extent = buffer(frameStateExtent,
vectorLayerRenderBuffer * resolution);
const projectionExtent = viewState.projection.getExtent();
if (vectorSource.getWrapX() && viewState.projection.canWrapX() &&
!containsExtent(projectionExtent, frameState.extent)) {
@@ -335,8 +335,8 @@ CanvasVectorLayerRenderer.prototype.prepareFrame = function(frameState, layerSta
// to +540°, we add at least 1 world width on each side of the projection
// extent. If the viewport is wider than the world, we need to add half of
// the viewport width to make sure we cover the whole viewport.
var worldWidth = getWidth(projectionExtent);
var gutter = Math.max(getWidth(extent) / 2, worldWidth);
const worldWidth = getWidth(projectionExtent);
const gutter = Math.max(getWidth(extent) / 2, worldWidth);
extent[0] = projectionExtent[0] - gutter;
extent[2] = projectionExtent[2] + gutter;
}
@@ -354,17 +354,17 @@ CanvasVectorLayerRenderer.prototype.prepareFrame = function(frameState, layerSta
this.dirty_ = false;
var replayGroup = new _ol_render_canvas_ReplayGroup_(
_ol_renderer_vector_.getTolerance(resolution, pixelRatio), extent, resolution,
pixelRatio, vectorSource.getOverlaps(), this.declutterTree_, vectorLayer.getRenderBuffer());
const replayGroup = new _ol_render_canvas_ReplayGroup_(
_ol_renderer_vector_.getTolerance(resolution, pixelRatio), extent, resolution,
pixelRatio, vectorSource.getOverlaps(), this.declutterTree_, vectorLayer.getRenderBuffer());
vectorSource.loadFeatures(extent, resolution, projection);
/**
* @param {ol.Feature} feature Feature.
* @this {ol.renderer.canvas.VectorLayer}
*/
var renderFeature = function(feature) {
var styles;
var styleFunction = feature.getStyleFunction();
const renderFeature = function(feature) {
let styles;
let styleFunction = feature.getStyleFunction();
if (styleFunction) {
styles = styleFunction.call(feature, resolution);
} else {
@@ -374,23 +374,23 @@ CanvasVectorLayerRenderer.prototype.prepareFrame = function(frameState, layerSta
}
}
if (styles) {
var dirty = this.renderFeature(
feature, resolution, pixelRatio, styles, replayGroup);
const dirty = this.renderFeature(
feature, resolution, pixelRatio, styles, replayGroup);
this.dirty_ = this.dirty_ || dirty;
}
}.bind(this);
if (vectorLayerRenderOrder) {
/** @type {Array.<ol.Feature>} */
var features = [];
const features = [];
vectorSource.forEachFeatureInExtent(extent,
/**
/**
* @param {ol.Feature} feature Feature.
*/
function(feature) {
features.push(feature);
}, this);
function(feature) {
features.push(feature);
}, this);
features.sort(vectorLayerRenderOrder);
for (var i = 0, ii = features.length; i < ii; ++i) {
for (let i = 0, ii = features.length; i < ii; ++i) {
renderFeature(features[i]);
}
} else {
@@ -422,19 +422,19 @@ CanvasVectorLayerRenderer.prototype.renderFeature = function(feature, resolution
if (!styles) {
return false;
}
var loading = false;
let loading = false;
if (Array.isArray(styles)) {
for (var i = 0, ii = styles.length; i < ii; ++i) {
for (let i = 0, ii = styles.length; i < ii; ++i) {
loading = _ol_renderer_vector_.renderFeature(
replayGroup, feature, styles[i],
_ol_renderer_vector_.getSquaredTolerance(resolution, pixelRatio),
this.handleStyleImageChange_, this) || loading;
replayGroup, feature, styles[i],
_ol_renderer_vector_.getSquaredTolerance(resolution, pixelRatio),
this.handleStyleImageChange_, this) || loading;
}
} else {
loading = _ol_renderer_vector_.renderFeature(
replayGroup, feature, styles,
_ol_renderer_vector_.getSquaredTolerance(resolution, pixelRatio),
this.handleStyleImageChange_, this);
replayGroup, feature, styles,
_ol_renderer_vector_.getSquaredTolerance(resolution, pixelRatio),
this.handleStyleImageChange_, this);
}
return loading;
};
src/ol/renderer/canvas/VectorTileLayer.js
+132 -133
View File
@@ -27,7 +27,7 @@ import _ol_transform_ from '../../transform.js';
* @param {ol.layer.VectorTile} layer VectorTile layer.
* @api
*/
var CanvasVectorTileLayerRenderer = function(layer) {
const CanvasVectorTileLayerRenderer = function(layer) {
/**
* @type {CanvasRenderingContext2D}
@@ -128,11 +128,11 @@ CanvasVectorTileLayerRenderer.prototype.disposeInternal = function() {
* @inheritDoc
*/
CanvasVectorTileLayerRenderer.prototype.prepareFrame = function(frameState, layerState) {
var layer = this.getLayer();
var layerRevision = layer.getRevision();
const layer = this.getLayer();
const layerRevision = layer.getRevision();
if (this.renderedLayerRevision_ != layerRevision) {
this.renderedTiles.length = 0;
var renderMode = layer.getRenderMode();
const renderMode = layer.getRenderMode();
if (!this.context && renderMode != _ol_layer_VectorTileRenderType_.VECTOR) {
this.context = createCanvasContext2D();
}
@@ -151,57 +151,57 @@ CanvasVectorTileLayerRenderer.prototype.prepareFrame = function(frameState, laye
* @private
*/
CanvasVectorTileLayerRenderer.prototype.createReplayGroup_ = function(
tile, frameState) {
var layer = this.getLayer();
var pixelRatio = frameState.pixelRatio;
var projection = frameState.viewState.projection;
var revision = layer.getRevision();
var renderOrder = /** @type {ol.RenderOrderFunction} */
tile, frameState) {
const layer = this.getLayer();
const pixelRatio = frameState.pixelRatio;
const projection = frameState.viewState.projection;
const revision = layer.getRevision();
const renderOrder = /** @type {ol.RenderOrderFunction} */
(layer.getRenderOrder()) || null;
var replayState = tile.getReplayState(layer);
const replayState = tile.getReplayState(layer);
if (!replayState.dirty && replayState.renderedRevision == revision &&
replayState.renderedRenderOrder == renderOrder) {
return;
}
var source = /** @type {ol.source.VectorTile} */ (layer.getSource());
var sourceTileGrid = source.getTileGrid();
var tileGrid = source.getTileGridForProjection(projection);
var resolution = tileGrid.getResolution(tile.tileCoord[0]);
var tileExtent = tileGrid.getTileCoordExtent(tile.wrappedTileCoord);
const source = /** @type {ol.source.VectorTile} */ (layer.getSource());
const sourceTileGrid = source.getTileGrid();
const tileGrid = source.getTileGridForProjection(projection);
const resolution = tileGrid.getResolution(tile.tileCoord[0]);
const tileExtent = tileGrid.getTileCoordExtent(tile.wrappedTileCoord);
var zIndexKeys = {};
for (var t = 0, tt = tile.tileKeys.length; t < tt; ++t) {
var sourceTile = tile.getTile(tile.tileKeys[t]);
const zIndexKeys = {};
for (let t = 0, tt = tile.tileKeys.length; t < tt; ++t) {
const sourceTile = tile.getTile(tile.tileKeys[t]);
if (sourceTile.getState() == TileState.ERROR) {
continue;
}
var sourceTileCoord = sourceTile.tileCoord;
var sourceTileExtent = sourceTileGrid.getTileCoordExtent(sourceTileCoord);
var sharedExtent = getIntersection(tileExtent, sourceTileExtent);
var bufferedExtent = equals(sourceTileExtent, sharedExtent) ? null :
const sourceTileCoord = sourceTile.tileCoord;
const sourceTileExtent = sourceTileGrid.getTileCoordExtent(sourceTileCoord);
const sharedExtent = getIntersection(tileExtent, sourceTileExtent);
const bufferedExtent = equals(sourceTileExtent, sharedExtent) ? null :
buffer(sharedExtent, layer.getRenderBuffer() * resolution);
var tileProjection = sourceTile.getProjection();
var reproject = false;
const tileProjection = sourceTile.getProjection();
let reproject = false;
if (!equivalentProjection(projection, tileProjection)) {
reproject = true;
sourceTile.setProjection(projection);
}
replayState.dirty = false;
var replayGroup = new _ol_render_canvas_ReplayGroup_(0, sharedExtent, resolution,
pixelRatio, source.getOverlaps(), this.declutterTree_, layer.getRenderBuffer());
var squaredTolerance = _ol_renderer_vector_.getSquaredTolerance(
resolution, pixelRatio);
const replayGroup = new _ol_render_canvas_ReplayGroup_(0, sharedExtent, resolution,
pixelRatio, source.getOverlaps(), this.declutterTree_, layer.getRenderBuffer());
const squaredTolerance = _ol_renderer_vector_.getSquaredTolerance(
resolution, pixelRatio);
/**
* @param {ol.Feature|ol.render.Feature} feature Feature.
* @this {ol.renderer.canvas.VectorTileLayer}
*/
var renderFeature = function(feature) {
var styles;
var styleFunction = feature.getStyleFunction();
const renderFeature = function(feature) {
let styles;
let styleFunction = feature.getStyleFunction();
if (styleFunction) {
styles = styleFunction.call(/** @type {ol.Feature} */ (feature), resolution);
} else {
@@ -211,20 +211,19 @@ CanvasVectorTileLayerRenderer.prototype.createReplayGroup_ = function(
}
}
if (styles) {
var dirty = this.renderFeature(feature, squaredTolerance, styles,
replayGroup);
const dirty = this.renderFeature(feature, squaredTolerance, styles,
replayGroup);
this.dirty_ = this.dirty_ || dirty;
replayState.dirty = replayState.dirty || dirty;
}
};
var features = sourceTile.getFeatures();
const features = sourceTile.getFeatures();
if (renderOrder && renderOrder !== replayState.renderedRenderOrder) {
features.sort(renderOrder);
}
var feature;
for (var i = 0, ii = features.length; i < ii; ++i) {
feature = features[i];
for (let i = 0, ii = features.length; i < ii; ++i) {
const feature = features[i];
if (reproject) {
if (tileProjection.getUnits() == Units.TILE_PIXELS) {
// projected tile extent
@@ -239,7 +238,7 @@ CanvasVectorTileLayerRenderer.prototype.createReplayGroup_ = function(
}
}
replayGroup.finish();
for (var r in replayGroup.getReplays()) {
for (const r in replayGroup.getReplays()) {
zIndexKeys[r] = true;
}
sourceTile.setReplayGroup(layer, tile.tileCoord.toString(), replayGroup);
@@ -253,8 +252,8 @@ CanvasVectorTileLayerRenderer.prototype.createReplayGroup_ = function(
* @inheritDoc
*/
CanvasVectorTileLayerRenderer.prototype.drawTileImage = function(
tile, frameState, layerState, x, y, w, h, gutter, transition) {
var vectorImageTile = /** @type {ol.VectorImageTile} */ (tile);
tile, frameState, layerState, x, y, w, h, gutter, transition) {
const vectorImageTile = /** @type {ol.VectorImageTile} */ (tile);
this.createReplayGroup_(vectorImageTile, frameState);
if (this.context) {
this.renderTileImage_(vectorImageTile, frameState, layerState);
@@ -267,21 +266,21 @@ CanvasVectorTileLayerRenderer.prototype.drawTileImage = function(
* @inheritDoc
*/
CanvasVectorTileLayerRenderer.prototype.forEachFeatureAtCoordinate = function(coordinate, frameState, hitTolerance, callback, thisArg) {
var resolution = frameState.viewState.resolution;
var rotation = frameState.viewState.rotation;
const resolution = frameState.viewState.resolution;
const rotation = frameState.viewState.rotation;
hitTolerance = hitTolerance == undefined ? 0 : hitTolerance;
var layer = this.getLayer();
const layer = this.getLayer();
/** @type {Object.<string, boolean>} */
var features = {};
const features = {};
/** @type {Array.<ol.VectorImageTile>} */
var renderedTiles = this.renderedTiles;
const renderedTiles = this.renderedTiles;
var source = /** @type {ol.source.VectorTile} */ (layer.getSource());
var tileGrid = source.getTileGridForProjection(frameState.viewState.projection);
var bufferedExtent, found;
var i, ii, replayGroup;
var tile, tileCoord, tileExtent;
const source = /** @type {ol.source.VectorTile} */ (layer.getSource());
const tileGrid = source.getTileGridForProjection(frameState.viewState.projection);
let bufferedExtent, found;
let i, ii, replayGroup;
let tile, tileCoord, tileExtent;
for (i = 0, ii = renderedTiles.length; i < ii; ++i) {
tile = renderedTiles[i];
tileCoord = tile.wrappedTileCoord;
@@ -290,25 +289,25 @@ CanvasVectorTileLayerRenderer.prototype.forEachFeatureAtCoordinate = function(co
if (!containsCoordinate(bufferedExtent, coordinate)) {
continue;
}
for (var t = 0, tt = tile.tileKeys.length; t < tt; ++t) {
var sourceTile = tile.getTile(tile.tileKeys[t]);
for (let t = 0, tt = tile.tileKeys.length; t < tt; ++t) {
const sourceTile = tile.getTile(tile.tileKeys[t]);
if (sourceTile.getState() == TileState.ERROR) {
continue;
}
replayGroup = sourceTile.getReplayGroup(layer, tile.tileCoord.toString());
found = found || replayGroup.forEachFeatureAtCoordinate(
coordinate, resolution, rotation, hitTolerance, {},
/**
coordinate, resolution, rotation, hitTolerance, {},
/**
* @param {ol.Feature|ol.render.Feature} feature Feature.
* @return {?} Callback result.
*/
function(feature) {
var key = getUid(feature).toString();
if (!(key in features)) {
features[key] = true;
return callback.call(thisArg, feature, layer);
}
}, null);
function(feature) {
const key = getUid(feature).toString();
if (!(key in features)) {
features[key] = true;
return callback.call(thisArg, feature, layer);
}
}, null);
}
}
return found;
@@ -322,26 +321,26 @@ CanvasVectorTileLayerRenderer.prototype.forEachFeatureAtCoordinate = function(co
* @private
*/
CanvasVectorTileLayerRenderer.prototype.getReplayTransform_ = function(tile, frameState) {
var layer = this.getLayer();
var source = /** @type {ol.source.VectorTile} */ (layer.getSource());
var tileGrid = source.getTileGrid();
var tileCoord = tile.tileCoord;
var tileResolution = tileGrid.getResolution(tileCoord[0]);
var viewState = frameState.viewState;
var pixelRatio = frameState.pixelRatio;
var renderResolution = viewState.resolution / pixelRatio;
var tileExtent = tileGrid.getTileCoordExtent(tileCoord, this.tmpExtent);
var center = viewState.center;
var origin = getTopLeft(tileExtent);
var size = frameState.size;
var offsetX = Math.round(pixelRatio * size[0] / 2);
var offsetY = Math.round(pixelRatio * size[1] / 2);
const layer = this.getLayer();
const source = /** @type {ol.source.VectorTile} */ (layer.getSource());
const tileGrid = source.getTileGrid();
const tileCoord = tile.tileCoord;
const tileResolution = tileGrid.getResolution(tileCoord[0]);
const viewState = frameState.viewState;
const pixelRatio = frameState.pixelRatio;
const renderResolution = viewState.resolution / pixelRatio;
const tileExtent = tileGrid.getTileCoordExtent(tileCoord, this.tmpExtent);
const center = viewState.center;
const origin = getTopLeft(tileExtent);
const size = frameState.size;
const offsetX = Math.round(pixelRatio * size[0] / 2);
const offsetY = Math.round(pixelRatio * size[1] / 2);
return _ol_transform_.compose(this.tmpTransform_,
offsetX, offsetY,
tileResolution / renderResolution, tileResolution / renderResolution,
viewState.rotation,
(origin[0] - center[0]) / tileResolution,
(center[1] - origin[1]) / tileResolution);
offsetX, offsetY,
tileResolution / renderResolution, tileResolution / renderResolution,
viewState.rotation,
(origin[0] - center[0]) / tileResolution,
(center[1] - origin[1]) / tileResolution);
};
@@ -349,7 +348,7 @@ CanvasVectorTileLayerRenderer.prototype.getReplayTransform_ = function(tile, fra
* @param {ol.events.Event} event Event.
*/
CanvasVectorTileLayerRenderer.prototype.handleFontsChanged_ = function(event) {
var layer = this.getLayer();
const layer = this.getLayer();
if (layer.getVisible() && this.renderedLayerRevision_ !== undefined) {
layer.changed();
}
@@ -370,15 +369,15 @@ CanvasVectorTileLayerRenderer.prototype.handleStyleImageChange_ = function(event
* @inheritDoc
*/
CanvasVectorTileLayerRenderer.prototype.postCompose = function(context, frameState, layerState) {
var layer = this.getLayer();
var declutterReplays = layer.getDeclutter() ? {} : null;
var source = /** @type {ol.source.VectorTile} */ (layer.getSource());
var renderMode = layer.getRenderMode();
var replayTypes = CanvasVectorTileLayerRenderer.VECTOR_REPLAYS[renderMode];
var pixelRatio = frameState.pixelRatio;
var rotation = frameState.viewState.rotation;
var size = frameState.size;
var offsetX, offsetY;
const layer = this.getLayer();
const declutterReplays = layer.getDeclutter() ? {} : null;
const source = /** @type {ol.source.VectorTile} */ (layer.getSource());
const renderMode = layer.getRenderMode();
const replayTypes = CanvasVectorTileLayerRenderer.VECTOR_REPLAYS[renderMode];
const pixelRatio = frameState.pixelRatio;
const rotation = frameState.viewState.rotation;
const size = frameState.size;
let offsetX, offsetY;
if (rotation) {
offsetX = Math.round(pixelRatio * size[0] / 2);
offsetY = Math.round(pixelRatio * size[1] / 2);
@@ -387,39 +386,39 @@ CanvasVectorTileLayerRenderer.prototype.postCompose = function(context, frameSta
if (declutterReplays) {
this.declutterTree_.clear();
}
var tiles = this.renderedTiles;
var tileGrid = source.getTileGridForProjection(frameState.viewState.projection);
var clips = [];
var zs = [];
for (var i = tiles.length - 1; i >= 0; --i) {
var tile = /** @type {ol.VectorImageTile} */ (tiles[i]);
const tiles = this.renderedTiles;
const tileGrid = source.getTileGridForProjection(frameState.viewState.projection);
const clips = [];
const zs = [];
for (let i = tiles.length - 1; i >= 0; --i) {
const tile = /** @type {ol.VectorImageTile} */ (tiles[i]);
if (tile.getState() == TileState.ABORT) {
continue;
}
var tileCoord = tile.tileCoord;
var worldOffset = tileGrid.getTileCoordExtent(tileCoord)[0] -
const tileCoord = tile.tileCoord;
const worldOffset = tileGrid.getTileCoordExtent(tileCoord)[0] -
tileGrid.getTileCoordExtent(tile.wrappedTileCoord)[0];
var transform = undefined;
for (var t = 0, tt = tile.tileKeys.length; t < tt; ++t) {
var sourceTile = tile.getTile(tile.tileKeys[t]);
let transform = undefined;
for (let t = 0, tt = tile.tileKeys.length; t < tt; ++t) {
const sourceTile = tile.getTile(tile.tileKeys[t]);
if (sourceTile.getState() == TileState.ERROR) {
continue;
}
var replayGroup = sourceTile.getReplayGroup(layer, tileCoord.toString());
const replayGroup = sourceTile.getReplayGroup(layer, tileCoord.toString());
if (renderMode != _ol_layer_VectorTileRenderType_.VECTOR && !replayGroup.hasReplays(replayTypes)) {
continue;
}
if (!transform) {
transform = this.getTransform(frameState, worldOffset);
}
var currentZ = sourceTile.tileCoord[0];
var currentClip = replayGroup.getClipCoords(transform);
const currentZ = sourceTile.tileCoord[0];
const currentClip = replayGroup.getClipCoords(transform);
context.save();
context.globalAlpha = layerState.opacity;
// Create a clip mask for regions in this low resolution tile that are
// already filled by a higher resolution tile
for (var j = 0, jj = clips.length; j < jj; ++j) {
var clip = clips[j];
for (let j = 0, jj = clips.length; j < jj; ++j) {
const clip = clips[j];
if (currentZ < zs[j]) {
context.beginPath();
// counter-clockwise (outer ring) for current tile
@@ -446,7 +445,7 @@ CanvasVectorTileLayerRenderer.prototype.postCompose = function(context, frameSta
}
if (rotation) {
_ol_render_canvas_.rotateAtOffset(context, rotation,
/** @type {number} */ (offsetX), /** @type {number} */ (offsetY));
/** @type {number} */ (offsetX), /** @type {number} */ (offsetY));
}
CanvasTileLayerRenderer.prototype.postCompose.apply(this, arguments);
};
@@ -464,17 +463,17 @@ CanvasVectorTileLayerRenderer.prototype.renderFeature = function(feature, square
if (!styles) {
return false;
}
var loading = false;
let loading = false;
if (Array.isArray(styles)) {
for (var i = 0, ii = styles.length; i < ii; ++i) {
for (let i = 0, ii = styles.length; i < ii; ++i) {
loading = _ol_renderer_vector_.renderFeature(
replayGroup, feature, styles[i], squaredTolerance,
this.handleStyleImageChange_, this) || loading;
replayGroup, feature, styles[i], squaredTolerance,
this.handleStyleImageChange_, this) || loading;
}
} else {
loading = _ol_renderer_vector_.renderFeature(
replayGroup, feature, styles, squaredTolerance,
this.handleStyleImageChange_, this);
replayGroup, feature, styles, squaredTolerance,
this.handleStyleImageChange_, this);
}
return loading;
};
@@ -487,34 +486,34 @@ CanvasVectorTileLayerRenderer.prototype.renderFeature = function(feature, square
* @private
*/
CanvasVectorTileLayerRenderer.prototype.renderTileImage_ = function(
tile, frameState, layerState) {
var layer = this.getLayer();
var replayState = tile.getReplayState(layer);
var revision = layer.getRevision();
var replays = CanvasVectorTileLayerRenderer.IMAGE_REPLAYS[layer.getRenderMode()];
tile, frameState, layerState) {
const layer = this.getLayer();
const replayState = tile.getReplayState(layer);
const revision = layer.getRevision();
const replays = CanvasVectorTileLayerRenderer.IMAGE_REPLAYS[layer.getRenderMode()];
if (replays && replayState.renderedTileRevision !== revision) {
replayState.renderedTileRevision = revision;
var tileCoord = tile.wrappedTileCoord;
var z = tileCoord[0];
var pixelRatio = frameState.pixelRatio;
var source = /** @type {ol.source.VectorTile} */ (layer.getSource());
var tileGrid = source.getTileGridForProjection(frameState.viewState.projection);
var resolution = tileGrid.getResolution(z);
var context = tile.getContext(layer);
var size = source.getTilePixelSize(z, pixelRatio, frameState.viewState.projection);
const tileCoord = tile.wrappedTileCoord;
const z = tileCoord[0];
const pixelRatio = frameState.pixelRatio;
const source = /** @type {ol.source.VectorTile} */ (layer.getSource());
const tileGrid = source.getTileGridForProjection(frameState.viewState.projection);
const resolution = tileGrid.getResolution(z);
const context = tile.getContext(layer);
const size = source.getTilePixelSize(z, pixelRatio, frameState.viewState.projection);
context.canvas.width = size[0];
context.canvas.height = size[1];
var tileExtent = tileGrid.getTileCoordExtent(tileCoord);
for (var i = 0, ii = tile.tileKeys.length; i < ii; ++i) {
var sourceTile = tile.getTile(tile.tileKeys[i]);
const tileExtent = tileGrid.getTileCoordExtent(tileCoord);
for (let i = 0, ii = tile.tileKeys.length; i < ii; ++i) {
const sourceTile = tile.getTile(tile.tileKeys[i]);
if (sourceTile.getState() == TileState.ERROR) {
continue;
}
var pixelScale = pixelRatio / resolution;
var transform = _ol_transform_.reset(this.tmpTransform_);
const pixelScale = pixelRatio / resolution;
const transform = _ol_transform_.reset(this.tmpTransform_);
_ol_transform_.scale(transform, pixelScale, -pixelScale);
_ol_transform_.translate(transform, -tileExtent[0], -tileExtent[3]);
var replayGroup = sourceTile.getReplayGroup(layer, tile.tileCoord.toString());
const replayGroup = sourceTile.getReplayGroup(layer, tile.tileCoord.toString());
replayGroup.replay(context, transform, 0, {}, replays);
}
}