Refactor to a more convenient internal API

This commit is contained in:
Andreas Hocevar
2016-06-22 23:41:00 +02:00
parent cf7ff841a7
commit 6b4ee42c90
34 changed files with 497 additions and 554 deletions
@@ -1,7 +1,7 @@
goog.provide('ol.renderer.canvas.ImageLayer');
goog.require('goog.asserts');
goog.require('ol.matrix');
goog.require('ol.transform');
goog.require('ol.functions');
goog.require('ol.ImageBase');
goog.require('ol.ViewHint');
@@ -30,13 +30,13 @@ ol.renderer.canvas.ImageLayer = function(imageLayer) {
/**
* @private
* @type {ol.Matrix}
* @type {ol.Transform}
*/
this.imageTransform_ = ol.matrix.create();
this.imageTransform_ = ol.transform.create();
/**
* @private
* @type {?ol.Matrix}
* @type {?ol.Transform}
*/
this.imageTransformInv_ = null;
@@ -82,9 +82,8 @@ ol.renderer.canvas.ImageLayer.prototype.forEachLayerAtPixel = function(pixel, fr
if (this.getLayer().getSource() instanceof ol.source.ImageVector) {
// for ImageVector sources use the original hit-detection logic,
// so that for example also transparent polygons are detected
var coordinate = pixel.slice();
ol.matrix.multVec2(
frameState.pixelToCoordinateMatrix, coordinate, coordinate);
var coordinate = ol.transform.apply(
frameState.pixelToCoordinateTransform, pixel.slice());
var hasFeature = this.forEachFeatureAtCoordinate(
coordinate, frameState, ol.functions.TRUE, this);
@@ -96,8 +95,7 @@ ol.renderer.canvas.ImageLayer.prototype.forEachLayerAtPixel = function(pixel, fr
} else {
// for all other image sources directly check the image
if (!this.imageTransformInv_) {
this.imageTransformInv_ = ol.matrix.create();
ol.matrix.invert(this.imageTransform_, this.imageTransformInv_);
this.imageTransformInv_ = ol.transform.invert(this.imageTransform_.slice());
}
var pixelOnCanvas =
@@ -189,11 +187,12 @@ ol.renderer.canvas.ImageLayer.prototype.prepareFrame = function(frameState, laye
var imagePixelRatio = image.getPixelRatio();
var scale = pixelRatio * imageResolution /
(viewResolution * imagePixelRatio);
ol.matrix.makeTransform(this.imageTransform_,
var transform = ol.transform.reset(this.imageTransform_);
ol.transform.translate(transform,
pixelRatio * frameState.size[0] / 2,
pixelRatio * frameState.size[1] / 2,
scale, scale,
0,
pixelRatio * frameState.size[1] / 2);
ol.transform.scale(transform, scale, scale);
ol.transform.translate(transform,
imagePixelRatio * (imageExtent[0] - viewCenter[0]) / imageResolution,
imagePixelRatio * (viewCenter[1] - imageExtent[3]) / imageResolution);
this.imageTransformInv_ = null;
+23 -29
View File
@@ -1,7 +1,7 @@
goog.provide('ol.renderer.canvas.Layer');
goog.require('goog.asserts');
goog.require('ol.matrix');
goog.require('ol.transform');
goog.require('ol.extent');
goog.require('ol.layer.Layer');
goog.require('ol.render.Event');
@@ -22,9 +22,9 @@ ol.renderer.canvas.Layer = function(layer) {
/**
* @private
* @type {ol.Matrix}
* @type {ol.Transform}
*/
this.transform_ = ol.matrix.create();
this.transform_ = ol.transform.create();
};
ol.inherits(ol.renderer.canvas.Layer, ol.renderer.Layer);
@@ -57,14 +57,10 @@ ol.renderer.canvas.Layer.prototype.composeFrame = function(frameState, layerStat
var bottomRight = ol.extent.getBottomRight(extent);
var bottomLeft = ol.extent.getBottomLeft(extent);
ol.matrix.multVec2(frameState.coordinateToPixelMatrix,
topLeft, topLeft);
ol.matrix.multVec2(frameState.coordinateToPixelMatrix,
topRight, topRight);
ol.matrix.multVec2(frameState.coordinateToPixelMatrix,
bottomRight, bottomRight);
ol.matrix.multVec2(frameState.coordinateToPixelMatrix,
bottomLeft, bottomLeft);
ol.transform.apply(frameState.coordinateToPixelTransform, topLeft);
ol.transform.apply(frameState.coordinateToPixelTransform, topRight);
ol.transform.apply(frameState.coordinateToPixelTransform, bottomRight);
ol.transform.apply(frameState.coordinateToPixelTransform, bottomLeft);
context.save();
ol.render.canvas.rotateAtOffset(context, -rotation, width / 2, height / 2);
@@ -108,7 +104,7 @@ ol.renderer.canvas.Layer.prototype.composeFrame = function(frameState, layerStat
* @param {ol.render.EventType} type Event type.
* @param {CanvasRenderingContext2D} context Context.
* @param {olx.FrameState} frameState Frame state.
* @param {ol.Matrix=} opt_transform Transform.
* @param {ol.Transform=} opt_transform Transform.
* @private
*/
ol.renderer.canvas.Layer.prototype.dispatchComposeEvent_ = function(type, context, frameState, opt_transform) {
@@ -134,7 +130,7 @@ ol.renderer.canvas.Layer.prototype.dispatchComposeEvent_ = function(type, contex
/**
* @param {CanvasRenderingContext2D} context Context.
* @param {olx.FrameState} frameState Frame state.
* @param {ol.Matrix=} opt_transform Transform.
* @param {ol.Transform=} opt_transform Transform.
* @protected
*/
ol.renderer.canvas.Layer.prototype.dispatchPostComposeEvent = function(context, frameState, opt_transform) {
@@ -146,7 +142,7 @@ ol.renderer.canvas.Layer.prototype.dispatchPostComposeEvent = function(context,
/**
* @param {CanvasRenderingContext2D} context Context.
* @param {olx.FrameState} frameState Frame state.
* @param {ol.Matrix=} opt_transform Transform.
* @param {ol.Transform=} opt_transform Transform.
* @protected
*/
ol.renderer.canvas.Layer.prototype.dispatchPreComposeEvent = function(context, frameState, opt_transform) {
@@ -158,7 +154,7 @@ ol.renderer.canvas.Layer.prototype.dispatchPreComposeEvent = function(context, f
/**
* @param {CanvasRenderingContext2D} context Context.
* @param {olx.FrameState} frameState Frame state.
* @param {ol.Matrix=} opt_transform Transform.
* @param {ol.Transform=} opt_transform Transform.
* @protected
*/
ol.renderer.canvas.Layer.prototype.dispatchRenderEvent = function(context, frameState, opt_transform) {
@@ -174,7 +170,7 @@ ol.renderer.canvas.Layer.prototype.getImage = goog.abstractMethod;
/**
* @return {!ol.Matrix} Image transform.
* @return {!ol.Transform} Image transform.
*/
ol.renderer.canvas.Layer.prototype.getImageTransform = goog.abstractMethod;
@@ -183,19 +179,19 @@ ol.renderer.canvas.Layer.prototype.getImageTransform = goog.abstractMethod;
* @param {olx.FrameState} frameState Frame state.
* @param {number} offsetX Offset on the x-axis in view coordinates.
* @protected
* @return {!ol.Matrix} Transform.
* @return {!ol.Transform} Transform.
*/
ol.renderer.canvas.Layer.prototype.getTransform = function(frameState, offsetX) {
var viewState = frameState.viewState;
var pixelRatio = frameState.pixelRatio;
return ol.matrix.makeTransform(this.transform_,
pixelRatio * frameState.size[0] / 2,
pixelRatio * frameState.size[1] / 2,
pixelRatio / viewState.resolution,
-pixelRatio / viewState.resolution,
-viewState.rotation,
-viewState.center[0] + offsetX,
-viewState.center[1]);
var transform = ol.transform.reset(this.transform_);
ol.transform.translate(transform,
pixelRatio * frameState.size[0] / 2, pixelRatio * frameState.size[1] / 2);
ol.transform.scale(transform,
pixelRatio / viewState.resolution, -pixelRatio / viewState.resolution);
ol.transform.rotate(transform, -viewState.rotation);
return ol.transform.translate(transform,
-viewState.center[0] + offsetX, -viewState.center[1]);
};
@@ -209,13 +205,11 @@ ol.renderer.canvas.Layer.prototype.prepareFrame = goog.abstractMethod;
/**
* @param {ol.Pixel} pixelOnMap Pixel.
* @param {ol.Matrix} imageTransformInv The transformation matrix
* @param {ol.Transform} imageTransformInv The transformation matrix
* to convert from a map pixel to a canvas pixel.
* @return {ol.Pixel} The pixel.
* @protected
*/
ol.renderer.canvas.Layer.prototype.getPixelOnCanvas = function(pixelOnMap, imageTransformInv) {
var pixelOnCanvas = [0, 0];
ol.matrix.multVec2(imageTransformInv, pixelOnMap, pixelOnCanvas);
return pixelOnCanvas;
return ol.transform.apply(imageTransformInv, pixelOnMap.slice());
};
+11 -8
View File
@@ -3,7 +3,7 @@
goog.provide('ol.renderer.canvas.Map');
goog.require('goog.asserts');
goog.require('ol.matrix');
goog.require('ol.transform');
goog.require('ol');
goog.require('ol.RendererType');
goog.require('ol.array');
@@ -62,9 +62,9 @@ ol.renderer.canvas.Map = function(container, map) {
/**
* @private
* @type {ol.Matrix}
* @type {ol.Transform}
*/
this.transform_ = ol.matrix.create();
this.transform_ = ol.transform.create();
};
ol.inherits(ol.renderer.canvas.Map, ol.renderer.Map);
@@ -117,16 +117,19 @@ ol.renderer.canvas.Map.prototype.dispatchComposeEvent_ = function(type, frameSta
/**
* @param {olx.FrameState} frameState Frame state.
* @protected
* @return {!ol.Matrix} Transform.
* @return {!ol.Transform} Transform.
*/
ol.renderer.canvas.Map.prototype.getTransform = function(frameState) {
var pixelRatio = frameState.pixelRatio;
var viewState = frameState.viewState;
var resolution = viewState.resolution;
return ol.matrix.makeTransform(this.transform_,
this.canvas_.width / 2, this.canvas_.height / 2,
pixelRatio / resolution, -pixelRatio / resolution,
-viewState.rotation,
var transform = ol.transform.reset(this.transform_);
ol.transform.translate(transform,
this.canvas_.width / 2, this.canvas_.height / 2);
ol.transform.scale(transform,
pixelRatio / resolution, -pixelRatio / resolution);
ol.transform.rotate(transform, -viewState.rotation);
return ol.transform.translate(transform,
-viewState.center[0], -viewState.center[1]);
};
@@ -3,7 +3,7 @@
goog.provide('ol.renderer.canvas.TileLayer');
goog.require('goog.asserts');
goog.require('ol.matrix');
goog.require('ol.transform');
goog.require('ol.TileRange');
goog.require('ol.TileState');
goog.require('ol.array');
@@ -50,9 +50,9 @@ ol.renderer.canvas.TileLayer = function(tileLayer) {
/**
* @private
* @type {ol.Matrix}
* @type {ol.Transform}
*/
this.imageTransform_ = ol.matrix.create();
this.imageTransform_ = ol.transform.create();
/**
* @protected
@@ -326,9 +326,11 @@ ol.renderer.canvas.TileLayer.prototype.renderTileImages = function(context, fram
if (hasRenderListeners) {
var dX = drawOffsetX - offsetX / drawScale + offsetX;
var dY = drawOffsetY - offsetY / drawScale + offsetY;
var imageTransform = ol.matrix.makeTransform(this.imageTransform_,
drawSize / 2 - dX, drawSize / 2 - dY, pixelScale, -pixelScale,
-rotation, -center[0] + dX / pixelScale, -center[1] - dY / pixelScale);
var imageTransform = ol.transform.reset(this.imageTransform_);
ol.transform.translate(imageTransform, drawSize / 2 - dX, drawSize / 2 - dY);
ol.transform.scale(imageTransform, pixelScale, -pixelScale);
ol.transform.rotate(imageTransform, -rotation);
ol.transform.translate(imageTransform, -center[0] + dX / pixelScale, -center[1] - dY / pixelScale);
this.dispatchRenderEvent(renderContext, frameState, imageTransform);
}
if (rotation || hasRenderListeners) {
@@ -2,7 +2,7 @@ goog.provide('ol.renderer.canvas.VectorTileLayer');
goog.require('goog.asserts');
goog.require('ol.events');
goog.require('ol.matrix');
goog.require('ol.transform');
goog.require('ol.Feature');
goog.require('ol.VectorTile');
goog.require('ol.array');
@@ -56,9 +56,9 @@ ol.renderer.canvas.VectorTileLayer = function(layer) {
/**
* @private
* @type {ol.Matrix}
* @type {ol.Transform}
*/
this.tmpTransform_ = ol.matrix.create();
this.tmpTransform_ = ol.transform.create();
// Use lower resolution for pure vector rendering. Closest resolution otherwise.
this.zDirection =
@@ -147,11 +147,12 @@ ol.renderer.canvas.VectorTileLayer.prototype.renderTileReplays_ = function(
if (pixelSpace) {
origin = ol.extent.getTopLeft(tileExtent);
tileTransform = ol.matrix.makeTransform(this.tmpTransform_,
offsetX, offsetY,
pixelScale * tilePixelResolution,
pixelScale * tilePixelResolution,
rotation,
tileTransform = ol.transform.reset(this.tmpTransform_);
ol.transform.translate(tileTransform, offsetX, offsetY);
ol.transform.scale(tileTransform,
pixelScale * tilePixelResolution, pixelScale * tilePixelResolution);
ol.transform.rotate(tileTransform, rotation);
ol.transform.translate(tileTransform,
(origin[0] - center[0]) / tilePixelResolution,
(center[1] - origin[1]) / tilePixelResolution);
} else {
@@ -425,20 +426,16 @@ ol.renderer.canvas.VectorTileLayer.prototype.renderTileImage_ = function(
var tilePixelResolution = tileResolution / tilePixelRatio;
var tileExtent = tileGrid.getTileCoordExtent(
tile.getTileCoord(), this.tmpExtent);
var tileTransform;
var tileTransform = ol.transform.reset(this.tmpTransform_);
if (pixelSpace) {
tileTransform = ol.matrix.makeTransform(this.tmpTransform_,
0, 0,
pixelScale * tilePixelResolution, pixelScale * tilePixelResolution,
0,
ol.transform.scale(tileTransform,
pixelScale * tilePixelResolution, pixelScale * tilePixelResolution);
ol.transform.translate(tileTransform,
-tileSize[0] * tilePixelRatio / 2, -tileSize[1] * tilePixelRatio / 2);
} else {
var tileCenter = ol.extent.getCenter(tileExtent);
tileTransform = ol.matrix.makeTransform(this.tmpTransform_,
0, 0,
pixelScale, -pixelScale,
0,
-tileCenter[0], -tileCenter[1]);
ol.transform.scale(tileTransform, pixelScale, -pixelScale);
ol.transform.translate(tileTransform, -tileCenter[0], -tileCenter[1]);
}
replayState.replayGroup.replay(tileContext, pixelRatio,