diff --git a/externs/olx.js b/externs/olx.js index 0102779c48..b898b489f1 100644 --- a/externs/olx.js +++ b/externs/olx.js @@ -7383,7 +7383,7 @@ olx.view.FitOptions.prototype.maxZoom; /** * @typedef {{animate: boolean, * attributions: Object., - * coordinateToPixelMatrix: ol.Matrix, + * coordinateToPixelTransform: ol.Transform, * extent: (null|ol.Extent), * focus: ol.Coordinate, * index: number, @@ -7391,7 +7391,7 @@ olx.view.FitOptions.prototype.maxZoom; * layerStatesArray: Array., * logos: Object., * pixelRatio: number, - * pixelToCoordinateMatrix: ol.Matrix, + * pixelToCoordinateTransform: ol.Transform, * postRenderFunctions: Array., * size: ol.Size, * skippedFeatureUids: Object., diff --git a/src/ol/dom/dom.js b/src/ol/dom/dom.js index 222c838e3e..adb166bf41 100644 --- a/src/ol/dom/dom.js +++ b/src/ol/dom/dom.js @@ -127,7 +127,7 @@ ol.dom.setTransform = function(element, value) { /** * @param {!Element} element Element. - * @param {ol.Matrix} transform Matrix. + * @param {ol.Transform} transform Matrix. * @param {number=} opt_precision Precision. */ ol.dom.transformElement2D = function(element, transform, opt_precision) { diff --git a/src/ol/geom/flat/transformflatgeom.js b/src/ol/geom/flat/transformflatgeom.js index b28a9f68c2..ae097afe57 100644 --- a/src/ol/geom/flat/transformflatgeom.js +++ b/src/ol/geom/flat/transformflatgeom.js @@ -6,7 +6,7 @@ goog.provide('ol.geom.flat.transform'); * @param {number} offset Offset. * @param {number} end End. * @param {number} stride Stride. - * @param {ol.Matrix} transform Transform. + * @param {ol.Transform} transform Transform. * @param {Array.=} opt_dest Destination. * @return {Array.} Transformed coordinates. */ diff --git a/src/ol/geom/simplegeometry.js b/src/ol/geom/simplegeometry.js index c8c33f813f..ca634a9dc5 100644 --- a/src/ol/geom/simplegeometry.js +++ b/src/ol/geom/simplegeometry.js @@ -294,7 +294,7 @@ ol.geom.SimpleGeometry.prototype.translate = function(deltaX, deltaY) { /** * @param {ol.geom.SimpleGeometry} simpleGeometry Simple geometry. - * @param {ol.Matrix} transform Transform. + * @param {ol.Transform} transform Transform. * @param {Array.=} opt_dest Destination. * @return {Array.} Transformed flat coordinates. */ diff --git a/src/ol/map.js b/src/ol/map.js index 5042f91bac..a4b484b2b9 100644 --- a/src/ol/map.js +++ b/src/ol/map.js @@ -33,7 +33,7 @@ goog.require('ol.has'); goog.require('ol.interaction'); goog.require('ol.layer.Base'); goog.require('ol.layer.Group'); -goog.require('ol.matrix'); +goog.require('ol.transform'); goog.require('ol.object'); goog.require('ol.proj'); goog.require('ol.proj.common'); @@ -202,15 +202,15 @@ ol.Map = function(options) { /** * @private - * @type {ol.Matrix} + * @type {ol.Transform} */ - this.coordinateToPixelMatrix_ = ol.matrix.create(); + this.coordinateToPixelTransform_ = ol.transform.create(); /** * @private - * @type {ol.Matrix} + * @type {ol.Transform} */ - this.pixelToCoordinateMatrix_ = ol.matrix.create(); + this.pixelToCoordinateTransform_ = ol.transform.create(); /** * @private @@ -763,8 +763,7 @@ ol.Map.prototype.getCoordinateFromPixel = function(pixel) { if (!frameState) { return null; } else { - var vec2 = pixel.slice(); - return ol.matrix.multVec2(frameState.pixelToCoordinateMatrix, vec2, vec2); + return ol.transform.apply(frameState.pixelToCoordinateTransform, pixel.slice()); } }; @@ -852,8 +851,8 @@ ol.Map.prototype.getPixelFromCoordinate = function(coordinate) { if (!frameState) { return null; } else { - var vec2 = coordinate.slice(0, 2); - return ol.matrix.multVec2(frameState.coordinateToPixelMatrix, vec2, vec2); + return ol.transform.apply(frameState.coordinateToPixelTransform, + coordinate.slice(0, 2)); } }; @@ -1297,7 +1296,7 @@ ol.Map.prototype.renderFrame_ = function(time) { frameState = /** @type {olx.FrameState} */ ({ animate: false, attributions: {}, - coordinateToPixelMatrix: this.coordinateToPixelMatrix_, + coordinateToPixelTransform: this.coordinateToPixelTransform_, extent: extent, focus: !this.focus_ ? viewState.center : this.focus_, index: this.frameIndex_++, @@ -1305,7 +1304,7 @@ ol.Map.prototype.renderFrame_ = function(time) { layerStatesArray: layerStatesArray, logos: ol.object.assign({}, this.logos_), pixelRatio: this.pixelRatio_, - pixelToCoordinateMatrix: this.pixelToCoordinateMatrix_, + pixelToCoordinateTransform: this.pixelToCoordinateTransform_, postRenderFunctions: [], size: size, skippedFeatureUids: this.skippedFeatureUids_, diff --git a/src/ol/matrix.js b/src/ol/matrix.js deleted file mode 100644 index 7fac02b363..0000000000 --- a/src/ol/matrix.js +++ /dev/null @@ -1,247 +0,0 @@ -goog.provide('ol.matrix'); - -/** - * Collection of matrix transformation functions. The element order is - * compatible with the [SVGMatrix interface](https://developer.mozilla.org/en-US/docs/Web/API/SVGMatrix): - * ``` - * [ a c e ] - * [ b d f ] - * [ 0 0 1 ] - * ``` - */ - - -/** - * Create an identity matrix. - * @return {!ol.Matrix} Identity matrix. - */ -ol.matrix.create = function() { - return [1, 0, 0, 1, 0, 0]; -}; - - -/** - * Check if two matrices are equal. - * @param {!ol.Matrix} mat1 Matrix 1. - * @param {!ol.Matrix} mat2 Matrix 2. - * @return {boolean} Matrix 1 and Matrix 2 are equal. - */ -ol.matrix.equals = function(mat1, mat2) { - return mat1[0] == mat2[0] && - mat1[1] == mat2[1] && - mat1[2] == mat2[2] && - mat1[3] == mat2[3] && - mat1[4] == mat2[4] && - mat1[5] == mat2[5]; -}; - - -/** - * Resets the given matrix to an identity matrix. - * @param {!ol.Matrix} mat Matrix. - * @return {!ol.Matrix} Matrix. - */ -ol.matrix.makeIdentity = function(mat) { - return ol.matrix.setTransform(mat, 1, 0, 0, 1, 0, 0); -}; - - -/** - * Multiply two matrices with each other. - * @param {!ol.Matrix} mat1 Matrix 1. - * @param {!ol.Matrix} mat2 Matrix 2. - * @param {ol.Matrix=} opt_mat Optional matrix for the result. - * @return {!ol.Matrix} Result matrix. - */ -ol.matrix.multiply = function(mat1, mat2, opt_mat) { - var mat = opt_mat ? opt_mat : ol.matrix.create(); - ol.matrix.setTransform(mat, mat1[0], mat1[1], mat1[2], mat1[3], mat1[4], mat1[5]); - return ol.matrix.transform(mat, mat2[0], mat2[1], mat2[2], mat2[3], mat2[4], mat2[5]); -}; - -/** - * Set the transform for a given matrix. - * @param {!ol.Matrix} mat Matrix. - * @param {number} a The a component of the matrix. - * @param {number} b The b component of the matrix. - * @param {number} c The c component of the matrix. - * @param {number} d The d component of the matrix. - * @param {number} e The e component of the matrix. - * @param {number} f The f component of the matrix. - * @return {!ol.Matrix} Matrix with transform applied. - */ -ol.matrix.setTransform = function(mat, a, b, c, d, e, f) { - mat[0] = a; - mat[1] = b; - mat[2] = c; - mat[3] = d; - mat[4] = e; - mat[5] = f; - return mat; -}; - - -/** - * Set transform on one matrix from another matrix. - * @param {!ol.Matrix} mat1 Matrix to set transform to. - * @param {!ol.Matrix} mat2 Matrix to set transform from. - * @return {!ol.Matrix} mat1 with transform from mat2 applied. - */ -ol.matrix.setFromArray = function(mat1, mat2) { - mat1[0] = mat2[0]; - mat1[1] = mat2[1]; - mat1[2] = mat2[2]; - mat1[3] = mat2[3]; - mat1[4] = mat2[4]; - mat1[5] = mat2[5]; - return mat1; -}; - - -/** - * Rotates the given matrix. - * @param {!ol.Matrix} mat Matrix. - * @param {number} rotation Angle in radians. - * @return {!ol.Matrix} Rotated matrix. - */ -ol.matrix.rotate = function(mat, rotation) { - var cos = Math.cos(rotation); - var sin = Math.sin(rotation); - return ol.matrix.transform(mat, cos, sin, -sin, cos, 0, 0); -}; - - -/** - * Multiplies the given matrix with new matrix values. - * @see {@link ol.Matrix#multiply}. - * - * @param {!ol.Matrix} mat Matrix. - * @param {number} a The a component of the matrix. - * @param {number} b The b component of the matrix. - * @param {number} c The c component of the matrix. - * @param {number} d The d component of the matrix. - * @param {number} e The e component of the matrix. - * @param {number} f The f component of the matrix. - * @return {!ol.Matrix} Transformed matrix. - */ -ol.matrix.transform = function(mat, a, b, c, d, e, f) { - var matA = mat[0]; - var matB = mat[1]; - var matC = mat[2]; - var matD = mat[3]; - var matE = mat[4]; - var matF = mat[5]; - - mat[0] = matA * a + matC * b; - mat[1] = matB * a + matD * b; - mat[2] = matA * c + matC * d; - mat[3] = matB * c + matD * d; - mat[4] = matA * e + matC * f + matE; - mat[5] = matB * e + matD * f + matF; - - return mat; -}; - - -/** - * @param {!ol.Matrix} mat Matrix. - * @param {number} translateX1 Translate X1. - * @param {number} translateY1 Translate Y1. - * @param {number} scaleX Scale X. - * @param {number} scaleY Scale Y. - * @param {number} rotation Rotation. - * @param {number} translateX2 Translate X2. - * @param {number} translateY2 Translate Y2. - * @return {!ol.Matrix} Matrix. - */ -ol.matrix.makeTransform = function(mat, translateX1, translateY1, - scaleX, scaleY, rotation, translateX2, translateY2) { - ol.matrix.makeIdentity(mat); - if (translateX1 !== 0 || translateY1 !== 0) { - ol.matrix.translate(mat, translateX1, translateY1); - } - if (scaleX != 1 || scaleY != 1) { - ol.matrix.scale(mat, scaleX, scaleY); - } - if (rotation !== 0) { - ol.matrix.rotate(mat, rotation); - } - if (translateX2 !== 0 || translateY2 !== 0) { - ol.matrix.translate(mat, translateX2, translateY2); - } - return mat; -}; - - -/** - * Transforms the given vector with the given matrix storing the resulting, - * transformed vector into resultVec. - * - * @param {ol.Matrix} mat The matrix supplying the transformation. - * @param {Array.} vec The 2 element vector to transform. - * @param {Array.} resultVec The 2 element vector to receive the results - * (may be vec). - * @return {Array.} return resultVec so that operations can be - * chained together. - */ -ol.matrix.multVec2 = function(mat, vec, resultVec) { - var x = vec[0], y = vec[1]; - resultVec[0] = mat[0] * x + mat[2] * y + mat[4]; - resultVec[1] = mat[1] * x + mat[3] * y + mat[5]; - return resultVec; -}; - - -/** - * Scales the given matrix. - * @param {!ol.Matrix} mat Matrix. - * @param {number} sx Scale factor x. - * @param {number} sy Scale factor y. - * @return {!ol.Matrix} The scaled matrix. - */ -ol.matrix.scale = function(mat, sx, sy) { - return ol.matrix.transform(mat, sx, 0, 0, sy, 0, 0); -}; - - -/** - * Translate the given matrix. - * @param {!ol.Matrix} mat Matrix. - * @param {number} tx Translation x. - * @param {number} ty Translation y. - * @return {!ol.Matrix} The translated matrix. - */ -ol.matrix.translate = function(mat, tx, ty) { - return ol.matrix.transform(mat, 1, 0, 0, 1, tx, ty); -}; - - -/** - * Invert the given matrix. - * @param {!ol.Matrix} mat Matrix. - * @param {ol.Matrix=} opt_mat Optional matrix for the result. - * @return {!ol.Matrix} Inverse of the matrix. - */ -ol.matrix.invert = function(mat, opt_mat) { - var result = opt_mat ? opt_mat : ol.matrix.create(); - var det = ol.matrix.determinant(mat); - goog.asserts.assert(det !== 0, 'Matrix cannot be inverted.'); - - result[0] = mat[3] / det; - result[1] = -mat[1] / det; - result[2] = -mat[2] / det; - result[3] = mat[0] / det; - result[4] = (mat[2] * mat[5] - mat[3] * mat[4]) / det; - result[5] = -(mat[0] * mat[5] - mat[1] * mat[4]) / det; - return result; -}; - - -/** - * Returns the determinant of the given matrix. - * @param {!ol.Matrix} mat Matrix. - * @return {number} Determinant. - */ -ol.matrix.determinant = function(mat) { - return mat[0] * mat[3] - mat[1] * mat[2]; -}; diff --git a/src/ol/render.js b/src/ol/render.js index 81ec3fbcfa..d8c66a7b2d 100644 --- a/src/ol/render.js +++ b/src/ol/render.js @@ -1,6 +1,6 @@ goog.provide('ol.render'); -goog.require('ol.matrix'); +goog.require('ol.transform'); goog.require('ol.render.canvas.Immediate'); @@ -36,8 +36,7 @@ ol.render.toContext = function(context, opt_options) { canvas.style.height = size[1] + 'px'; } var extent = [0, 0, canvas.width, canvas.height]; - var transform = ol.matrix.makeTransform(ol.matrix.create(), - 0, 0, pixelRatio, pixelRatio, 0, 0, 0); + var transform = ol.transform.scale(ol.transform.create(), pixelRatio, pixelRatio); return new ol.render.canvas.Immediate(context, pixelRatio, extent, transform, 0); }; diff --git a/src/ol/render/canvas/canvasimmediate.js b/src/ol/render/canvas/canvasimmediate.js index e600c38cc6..c4dd336dda 100644 --- a/src/ol/render/canvas/canvasimmediate.js +++ b/src/ol/render/canvas/canvasimmediate.js @@ -5,7 +5,7 @@ goog.provide('ol.render.canvas.Immediate'); goog.require('goog.asserts'); -goog.require('ol.matrix'); +goog.require('ol.transform'); goog.require('ol.array'); goog.require('ol.color'); goog.require('ol.colorlike'); @@ -31,7 +31,7 @@ goog.require('ol.render.canvas'); * @param {CanvasRenderingContext2D} context Context. * @param {number} pixelRatio Pixel ratio. * @param {ol.Extent} extent Extent. - * @param {ol.Matrix} transform Transform. + * @param {ol.Transform} transform Transform. * @param {number} viewRotation View rotation. * @struct */ @@ -58,7 +58,7 @@ ol.render.canvas.Immediate = function(context, pixelRatio, extent, transform, vi /** * @private - * @type {ol.Matrix} + * @type {ol.Transform} */ this.transform_ = transform; @@ -226,9 +226,9 @@ ol.render.canvas.Immediate = function(context, pixelRatio, extent, transform, vi /** * @private - * @type {ol.Matrix} + * @type {ol.Transform} */ - this.tmpLocalTransform_ = ol.matrix.create(); + this.tmpLocalTransform_ = ol.transform.create(); }; ol.inherits(ol.render.canvas.Immediate, ol.render.VectorContext); @@ -272,9 +272,10 @@ ol.render.canvas.Immediate.prototype.drawImages_ = function(flatCoordinates, off if (rotation !== 0 || this.imageScale_ != 1) { var centerX = x + this.imageAnchorX_; var centerY = y + this.imageAnchorY_; - ol.matrix.makeTransform(localTransform, - centerX, centerY, this.imageScale_, this.imageScale_, - rotation, -centerX, -centerY); + ol.transform.translate(ol.transform.reset(localTransform), centerX, centerY); + ol.transform.scale(localTransform, this.imageScale_, this.imageScale_); + ol.transform.rotate(localTransform, rotation); + ol.transform.translate(localTransform, -centerX, -centerY); context.setTransform.apply(context, localTransform); } context.drawImage(this.image_, this.imageOriginX_, this.imageOriginY_, @@ -319,8 +320,11 @@ ol.render.canvas.Immediate.prototype.drawText_ = function(flatCoordinates, offse var x = pixelCoordinates[offset] + this.textOffsetX_; var y = pixelCoordinates[offset + 1] + this.textOffsetY_; if (this.textRotation_ !== 0 || this.textScale_ != 1) { - var localTransform = ol.matrix.makeTransform(this.tmpLocalTransform_, - x, y, this.textScale_, this.textScale_, this.textRotation_, -x, -y); + var localTransform = ol.transform.reset(this.tmpLocalTransform_); + ol.transform.translate(localTransform, x, y); + ol.transform.scale(localTransform, this.textScale_, this.textScale_); + ol.transform.rotate(localTransform, this.textRotation_); + ol.transform.translate(localTransform, -x, -y); context.setTransform.apply(context, localTransform); } if (this.textStrokeState_) { diff --git a/src/ol/render/canvas/canvasreplay.js b/src/ol/render/canvas/canvasreplay.js index 74e451dfab..9f1085ccae 100644 --- a/src/ol/render/canvas/canvasreplay.js +++ b/src/ol/render/canvas/canvasreplay.js @@ -9,7 +9,7 @@ goog.provide('ol.render.canvas.ReplayGroup'); goog.provide('ol.render.canvas.TextReplay'); goog.require('goog.asserts'); -goog.require('ol.matrix'); +goog.require('ol.transform'); goog.require('ol'); goog.require('ol.array'); goog.require('ol.color'); @@ -116,9 +116,9 @@ ol.render.canvas.Replay = function(tolerance, maxExtent, resolution) { /** * @private - * @type {ol.Matrix} + * @type {ol.Transform} */ - this.renderedTransform_ = ol.matrix.create(); + this.renderedTransform_ = ol.transform.create(); /** * @protected @@ -134,15 +134,15 @@ ol.render.canvas.Replay = function(tolerance, maxExtent, resolution) { /** * @private - * @type {ol.Matrix} + * @type {ol.Transform} */ - this.tmpLocalTransform_ = ol.matrix.create(); + this.tmpLocalTransform_ = ol.transform.create(); /** * @private - * @type {ol.Matrix} + * @type {ol.Transform} */ - this.tmpLocalTransformInv_ = ol.matrix.create(); + this.tmpLocalTransformInv_ = ol.transform.create(); }; ol.inherits(ol.render.canvas.Replay, ol.render.VectorContext); @@ -222,7 +222,7 @@ ol.render.canvas.Replay.prototype.beginGeometry = function(geometry, feature) { * @private * @param {CanvasRenderingContext2D} context Context. * @param {number} pixelRatio Pixel ratio. - * @param {ol.Matrix} transform Transform. + * @param {ol.Transform} transform Transform. * @param {number} viewRotation View rotation. * @param {Object.} skippedFeaturesHash Ids of features * to skip. @@ -239,13 +239,13 @@ ol.render.canvas.Replay.prototype.replay_ = function( instructions, featureCallback, opt_hitExtent) { /** @type {Array.} */ var pixelCoordinates; - if (ol.matrix.equals(transform, this.renderedTransform_)) { + if (ol.array.equals(transform, this.renderedTransform_)) { pixelCoordinates = this.pixelCoordinates_; } else { pixelCoordinates = ol.geom.flat.transform.transform2D( this.coordinates, 0, this.coordinates.length, 2, transform, this.pixelCoordinates_); - ol.matrix.setFromArray(this.renderedTransform_, transform); + ol.transform.setFromArray(this.renderedTransform_, transform); goog.asserts.assert(pixelCoordinates === this.pixelCoordinates_, 'pixelCoordinates should be the same as this.pixelCoordinates_'); } @@ -331,9 +331,10 @@ ol.render.canvas.Replay.prototype.replay_ = function( if (scale != 1 || rotation !== 0) { var centerX = x + anchorX; var centerY = y + anchorY; - ol.matrix.makeTransform( - localTransform, centerX, centerY, scale, scale, - rotation, -centerX, -centerY); + ol.transform.translate(ol.transform.reset(localTransform), centerX, centerY); + ol.transform.scale(localTransform, scale, scale); + ol.transform.rotate(localTransform, rotation); + ol.transform.translate(localTransform, -centerX, -centerY); context.transform.apply(context, localTransform); } var alpha = context.globalAlpha; @@ -351,7 +352,7 @@ ol.render.canvas.Replay.prototype.replay_ = function( context.globalAlpha = alpha; } if (scale != 1 || rotation !== 0) { - ol.matrix.invert(localTransform, localTransformInv); + ol.transform.invert(ol.transform.setFromArray(localTransformInv, localTransform)); context.transform.apply(context, localTransformInv); } } @@ -389,8 +390,10 @@ ol.render.canvas.Replay.prototype.replay_ = function( x = pixelCoordinates[d] + offsetX; y = pixelCoordinates[d + 1] + offsetY; if (scale != 1 || rotation !== 0) { - ol.matrix.makeTransform( - localTransform, x, y, scale, scale, rotation, -x, -y); + ol.transform.translate(ol.transform.reset(localTransform), x, y); + ol.transform.scale(localTransform, scale, scale); + ol.transform.rotate(localTransform, rotation); + ol.transform.translate(localTransform, -x, -y); context.transform.apply(context, localTransform); } @@ -422,7 +425,7 @@ ol.render.canvas.Replay.prototype.replay_ = function( } if (scale != 1 || rotation !== 0) { - ol.matrix.invert(localTransform, localTransformInv); + ol.transform.invert(ol.transform.setFromArray(localTransformInv, localTransform)); context.transform.apply(context, localTransformInv); } } @@ -540,7 +543,7 @@ ol.render.canvas.Replay.prototype.replay_ = function( /** * @param {CanvasRenderingContext2D} context Context. * @param {number} pixelRatio Pixel ratio. - * @param {ol.Matrix} transform Transform. + * @param {ol.Transform} transform Transform. * @param {number} viewRotation View rotation. * @param {Object.} skippedFeaturesHash Ids of features * to skip. @@ -555,7 +558,7 @@ ol.render.canvas.Replay.prototype.replay = function( /** * @param {CanvasRenderingContext2D} context Context. - * @param {ol.Matrix} transform Transform. + * @param {ol.Transform} transform Transform. * @param {number} viewRotation View rotation. * @param {Object.} skippedFeaturesHash Ids of features * to skip. @@ -1858,9 +1861,9 @@ ol.render.canvas.ReplayGroup = function( /** * @private - * @type {ol.Matrix} + * @type {ol.Transform} */ - this.hitDetectionTransform_ = ol.matrix.create(); + this.hitDetectionTransform_ = ol.transform.create(); }; @@ -1894,10 +1897,11 @@ ol.render.canvas.ReplayGroup.prototype.finish = function() { ol.render.canvas.ReplayGroup.prototype.forEachFeatureAtCoordinate = function( coordinate, resolution, rotation, skippedFeaturesHash, callback) { - var transform = this.hitDetectionTransform_; - ol.matrix.makeTransform(transform, 0.5, 0.5, - 1 / resolution, -1 / resolution, -rotation, - -coordinate[0], -coordinate[1]); + var transform = ol.transform.reset(this.hitDetectionTransform_); + ol.transform.translate(transform, 0.5, 0.5); + ol.transform.scale(transform, 1 / resolution, -1 / resolution); + ol.transform.rotate(transform, -rotation); + ol.transform.translate(transform, -coordinate[0], -coordinate[1]); var context = this.hitDetectionContext_; context.clearRect(0, 0, 1, 1); @@ -1966,7 +1970,7 @@ ol.render.canvas.ReplayGroup.prototype.isEmpty = function() { /** * @param {CanvasRenderingContext2D} context Context. * @param {number} pixelRatio Pixel ratio. - * @param {ol.Matrix} transform Transform. + * @param {ol.Transform} transform Transform. * @param {number} viewRotation View rotation. * @param {Object.} skippedFeaturesHash Ids of features * to skip. @@ -2019,7 +2023,7 @@ ol.render.canvas.ReplayGroup.prototype.replay = function(context, pixelRatio, /** * @private * @param {CanvasRenderingContext2D} context Context. - * @param {ol.Matrix} transform Transform. + * @param {ol.Transform} transform Transform. * @param {number} viewRotation View rotation. * @param {Object.} skippedFeaturesHash Ids of features * to skip. diff --git a/src/ol/render/webgl/webglreplay.js b/src/ol/render/webgl/webglreplay.js index a614ae537f..360e813f09 100644 --- a/src/ol/render/webgl/webglreplay.js +++ b/src/ol/render/webgl/webglreplay.js @@ -2,7 +2,7 @@ goog.provide('ol.render.webgl.ImageReplay'); goog.provide('ol.render.webgl.ReplayGroup'); goog.require('goog.asserts'); -goog.require('ol.matrix'); +goog.require('ol.transform'); goog.require('ol.extent'); goog.require('ol.object'); goog.require('ol.render.IReplayGroup'); @@ -116,16 +116,16 @@ ol.render.webgl.ImageReplay = function(tolerance, maxExtent) { this.opacity_ = undefined; /** - * @type {ol.Matrix} + * @type {ol.Transform} * @private */ - this.offsetRotateMatrix_ = ol.matrix.create(); + this.offsetRotateMatrix_ = ol.transform.create(); /** - * @type {ol.Matrix} + * @type {ol.Transform} * @private */ - this.offsetScaleMatrix_ = ol.matrix.create(); + this.offsetScaleMatrix_ = ol.transform.create(); /** * @type {number|undefined} @@ -140,10 +140,10 @@ ol.render.webgl.ImageReplay = function(tolerance, maxExtent) { this.originY_ = undefined; /** - * @type {ol.Matrix} + * @type {ol.Transform} * @private */ - this.projectionMatrix_ = ol.matrix.create(); + this.projectionMatrix_ = ol.transform.create(); /** * @private @@ -552,22 +552,17 @@ ol.render.webgl.ImageReplay.prototype.replay = function(context, false, 32, 28); // set the "uniform" values - var projectionMatrix = this.projectionMatrix_; - ol.matrix.makeTransform(projectionMatrix, - 0.0, 0.0, - 2 / (resolution * size[0]), - 2 / (resolution * size[1]), - -rotation, - -(center[0] - this.origin_[0]), -(center[1] - this.origin_[1])); + var projectionMatrix = ol.transform.reset(this.projectionMatrix_); + ol.transform.scale(projectionMatrix, 2 / (resolution * size[0]), 2 / (resolution * size[1])); + ol.transform.rotate(projectionMatrix, -rotation); + ol.transform.translate(projectionMatrix, -(center[0] - this.origin_[0]), -(center[1] - this.origin_[1])); - var offsetScaleMatrix = this.offsetScaleMatrix_; - ol.matrix.makeIdentity(offsetScaleMatrix); - ol.matrix.scale(offsetScaleMatrix, 2 / size[0], 2 / size[1]); + var offsetScaleMatrix = ol.transform.reset(this.offsetScaleMatrix_); + ol.transform.scale(offsetScaleMatrix, 2 / size[0], 2 / size[1]); - var offsetRotateMatrix = this.offsetRotateMatrix_; - ol.matrix.makeIdentity(offsetRotateMatrix); + var offsetRotateMatrix = ol.transform.reset(this.offsetRotateMatrix_); if (rotation !== 0) { - ol.matrix.rotate(offsetRotateMatrix, -rotation); + ol.transform.rotate(offsetRotateMatrix, -rotation); } gl.uniformMatrix4fv(locations.u_projectionMatrix, false, ol.vec.Mat4.fromMatrix(projectionMatrix)); diff --git a/src/ol/renderer/canvas/canvasimagelayerrenderer.js b/src/ol/renderer/canvas/canvasimagelayerrenderer.js index da32751b22..0dd67c827d 100644 --- a/src/ol/renderer/canvas/canvasimagelayerrenderer.js +++ b/src/ol/renderer/canvas/canvasimagelayerrenderer.js @@ -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; diff --git a/src/ol/renderer/canvas/canvaslayerrenderer.js b/src/ol/renderer/canvas/canvaslayerrenderer.js index b4b42fa79e..d4dbdfa296 100644 --- a/src/ol/renderer/canvas/canvaslayerrenderer.js +++ b/src/ol/renderer/canvas/canvaslayerrenderer.js @@ -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()); }; diff --git a/src/ol/renderer/canvas/canvasmaprenderer.js b/src/ol/renderer/canvas/canvasmaprenderer.js index 23afa5ac33..ee9199018c 100644 --- a/src/ol/renderer/canvas/canvasmaprenderer.js +++ b/src/ol/renderer/canvas/canvasmaprenderer.js @@ -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]); }; diff --git a/src/ol/renderer/canvas/canvastilelayerrenderer.js b/src/ol/renderer/canvas/canvastilelayerrenderer.js index 7b640f766b..d88fe8c725 100644 --- a/src/ol/renderer/canvas/canvastilelayerrenderer.js +++ b/src/ol/renderer/canvas/canvastilelayerrenderer.js @@ -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) { diff --git a/src/ol/renderer/canvas/canvasvectortilelayerrenderer.js b/src/ol/renderer/canvas/canvasvectortilelayerrenderer.js index e701955383..6b3bae9a00 100644 --- a/src/ol/renderer/canvas/canvasvectortilelayerrenderer.js +++ b/src/ol/renderer/canvas/canvasvectortilelayerrenderer.js @@ -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, diff --git a/src/ol/renderer/dom/domimagelayerrenderer.js b/src/ol/renderer/dom/domimagelayerrenderer.js index ec34d6a1f3..5fbdaa9dcd 100644 --- a/src/ol/renderer/dom/domimagelayerrenderer.js +++ b/src/ol/renderer/dom/domimagelayerrenderer.js @@ -1,7 +1,7 @@ goog.provide('ol.renderer.dom.ImageLayer'); goog.require('goog.asserts'); -goog.require('ol.matrix'); +goog.require('ol.transform'); goog.require('ol.ImageBase'); goog.require('ol.ViewHint'); goog.require('ol.dom'); @@ -31,9 +31,9 @@ ol.renderer.dom.ImageLayer = function(imageLayer) { /** * @private - * @type {ol.Matrix} + * @type {ol.Transform} */ - this.transform_ = ol.matrix.create(); + this.transform_ = ol.transform.create(); }; ol.inherits(ol.renderer.dom.ImageLayer, ol.renderer.dom.Layer); @@ -117,11 +117,13 @@ ol.renderer.dom.ImageLayer.prototype.prepareFrame = function(frameState, layerSt if (image) { var imageExtent = image.getExtent(); var imageResolution = image.getResolution(); - var transform = ol.matrix.create(); - ol.matrix.makeTransform(transform, - frameState.size[0] / 2, frameState.size[1] / 2, - imageResolution / viewResolution, imageResolution / viewResolution, - viewRotation, + var transform = ol.transform.create(); + ol.transform.translate(transform, + frameState.size[0] / 2, frameState.size[1] / 2); + ol.transform.scale(transform, + imageResolution / viewResolution, imageResolution / viewResolution); + ol.transform.rotate(transform, viewRotation); + ol.transform.translate(transform, (imageExtent[0] - viewCenter[0]) / imageResolution, (viewCenter[1] - imageExtent[3]) / imageResolution); if (image != this.image_) { @@ -145,12 +147,12 @@ ol.renderer.dom.ImageLayer.prototype.prepareFrame = function(frameState, layerSt /** - * @param {ol.Matrix} transform Transform. + * @param {ol.Transform} transform Transform. * @private */ ol.renderer.dom.ImageLayer.prototype.setTransform_ = function(transform) { - if (!ol.matrix.equals(transform, this.transform_)) { + if (!ol.array.equals(transform, this.transform_)) { ol.dom.transformElement2D(this.target, transform, 6); - ol.matrix.setFromArray(this.transform_, transform); + ol.transform.setFromArray(this.transform_, transform); } }; diff --git a/src/ol/renderer/dom/dommaprenderer.js b/src/ol/renderer/dom/dommaprenderer.js index 8186d26678..ce3f65758d 100644 --- a/src/ol/renderer/dom/dommaprenderer.js +++ b/src/ol/renderer/dom/dommaprenderer.js @@ -4,7 +4,7 @@ goog.require('goog.asserts'); goog.require('ol.events'); goog.require('ol.events.Event'); goog.require('ol.events.EventType'); -goog.require('ol.matrix'); +goog.require('ol.transform'); goog.require('ol'); goog.require('ol.RendererType'); goog.require('ol.array'); @@ -49,9 +49,9 @@ ol.renderer.dom.Map = function(container, map) { /** * @private - * @type {ol.Matrix} + * @type {ol.Transform} */ - this.transform_ = ol.matrix.create(); + this.transform_ = ol.transform.create(); /** * @type {!Element} @@ -123,12 +123,12 @@ ol.renderer.dom.Map.prototype.dispatchComposeEvent_ = function(type, frameState) var context = this.context_; var canvas = context.canvas; - ol.matrix.makeTransform(this.transform_, - canvas.width / 2, - canvas.height / 2, - pixelRatio / viewState.resolution, - -pixelRatio / viewState.resolution, - -viewState.rotation, + var transform = ol.transform.reset(this.transform_); + ol.transform.translate(transform, canvas.width / 2, canvas.height / 2); + ol.transform.scale(transform, + pixelRatio / viewState.resolution, -pixelRatio / viewState.resolution); + ol.transform.rotate(transform, -viewState.rotation); + ol.transform.translate(transform, -viewState.center[0], -viewState.center[1]); var vectorContext = new ol.render.canvas.Immediate(context, pixelRatio, extent, this.transform_, rotation); diff --git a/src/ol/renderer/dom/domtilelayerrenderer.js b/src/ol/renderer/dom/domtilelayerrenderer.js index 4ae1006c5c..2bb751eec7 100644 --- a/src/ol/renderer/dom/domtilelayerrenderer.js +++ b/src/ol/renderer/dom/domtilelayerrenderer.js @@ -4,7 +4,7 @@ goog.provide('ol.renderer.dom.TileLayer'); goog.require('goog.asserts'); -goog.require('ol.matrix'); +goog.require('ol.transform'); goog.require('ol'); goog.require('ol.TileRange'); goog.require('ol.TileState'); @@ -199,7 +199,7 @@ ol.renderer.dom.TileLayer.prototype.prepareFrame = function(frameState, layerSta tileLayerZKeys.sort(ol.array.numberSafeCompareFunction); var i, ii, j, origin, resolution; - var transform = ol.matrix.create(); + var transform = ol.transform.create(); for (i = 0, ii = tileLayerZKeys.length; i < ii; ++i) { tileLayerZKey = tileLayerZKeys[i]; tileLayerZ = this.tileLayerZs_[tileLayerZKey]; @@ -210,13 +210,13 @@ ol.renderer.dom.TileLayer.prototype.prepareFrame = function(frameState, layerSta } resolution = tileLayerZ.getResolution(); origin = tileLayerZ.getOrigin(); - ol.matrix.makeTransform(transform, - frameState.size[0] / 2, frameState.size[1] / 2, - resolution / viewState.resolution, - resolution / viewState.resolution, - viewState.rotation, - (origin[0] - center[0]) / resolution, - (center[1] - origin[1]) / resolution); + ol.transform.translate(ol.transform.reset(transform), + frameState.size[0] / 2, frameState.size[1] / 2); + ol.transform.scale(transform, + resolution / viewState.resolution, resolution / viewState.resolution); + ol.transform.rotate(transform, viewState.rotation); + ol.transform.translate(transform, + (origin[0] - center[0]) / resolution, (center[1] - origin[1]) / resolution); tileLayerZ.setTransform(transform); if (tileLayerZKey in newTileLayerZKeys) { for (j = tileLayerZKey - 1; j >= 0; --j) { @@ -313,9 +313,9 @@ ol.renderer.dom.TileLayerZ_ = function(tileGrid, tileCoordOrigin) { /** * @private - * @type {ol.Matrix} + * @type {ol.Transform} */ - this.transform_ = ol.matrix.create(); + this.transform_ = ol.transform.create(); /** * @private @@ -436,11 +436,11 @@ ol.renderer.dom.TileLayerZ_.prototype.removeTilesOutsideExtent = function(extent /** - * @param {ol.Matrix} transform Transform. + * @param {ol.Transform} transform Transform. */ ol.renderer.dom.TileLayerZ_.prototype.setTransform = function(transform) { - if (!ol.matrix.equals(transform, this.transform_)) { + if (!ol.array.equals(transform, this.transform_)) { ol.dom.transformElement2D(this.target, transform, 6); - ol.matrix.setFromArray(this.transform_, transform); + ol.transform.setFromArray(this.transform_, transform); } }; diff --git a/src/ol/renderer/dom/domvectorlayerrenderer.js b/src/ol/renderer/dom/domvectorlayerrenderer.js index c30e87f006..80186217ac 100644 --- a/src/ol/renderer/dom/domvectorlayerrenderer.js +++ b/src/ol/renderer/dom/domvectorlayerrenderer.js @@ -2,7 +2,7 @@ goog.provide('ol.renderer.dom.VectorLayer'); goog.require('goog.asserts'); goog.require('ol.events'); -goog.require('ol.matrix'); +goog.require('ol.transform'); goog.require('ol.ViewHint'); goog.require('ol.dom'); goog.require('ol.extent'); @@ -75,15 +75,15 @@ ol.renderer.dom.VectorLayer = function(vectorLayer) { /** * @private - * @type {ol.Matrix} + * @type {ol.Transform} */ - this.transform_ = ol.matrix.create(); + this.transform_ = ol.transform.create(); /** * @private - * @type {ol.Matrix} + * @type {ol.Transform} */ - this.elementTransform_ = ol.matrix.create(); + this.elementTransform_ = ol.transform.create(); }; ol.inherits(ol.renderer.dom.VectorLayer, ol.renderer.dom.Layer); @@ -119,13 +119,13 @@ ol.renderer.dom.VectorLayer.prototype.composeFrame = function(frameState, layerS var imageWidth = viewWidth * pixelRatio; var imageHeight = viewHeight * pixelRatio; - var transform = ol.matrix.makeTransform(this.transform_, - pixelRatio * viewWidth / 2, - pixelRatio * viewHeight / 2, - pixelRatio / viewResolution, - -pixelRatio / viewResolution, - -viewRotation, - -viewCenter[0], -viewCenter[1]); + var transform = ol.transform.reset(this.transform_); + ol.transform.translate(transform, + pixelRatio * viewWidth / 2, pixelRatio * viewHeight / 2); + ol.transform.scale(transform, + pixelRatio / viewResolution, -pixelRatio / viewResolution); + ol.transform.rotate(transform, -viewRotation); + ol.transform.translate(transform, -viewCenter[0], -viewCenter[1]); var context = this.context_; @@ -133,10 +133,9 @@ ol.renderer.dom.VectorLayer.prototype.composeFrame = function(frameState, layerS context.canvas.width = imageWidth; context.canvas.height = imageHeight; - var elementTransform = ol.matrix.makeTransform(this.elementTransform_, - 0, 0, - 1 / pixelRatio, 1 / pixelRatio, - 0, + var elementTransform = ol.transform.reset(this.elementTransform_); + ol.transform.scale(elementTransform, 1 / pixelRatio, 1 / pixelRatio); + ol.transform.translate(elementTransform, -(imageWidth - viewWidth) / 2 * pixelRatio, -(imageHeight - viewHeight) / 2 * pixelRatio); ol.dom.transformElement2D(context.canvas, elementTransform, 6); @@ -161,7 +160,7 @@ ol.renderer.dom.VectorLayer.prototype.composeFrame = function(frameState, layerS /** * @param {ol.render.EventType} type Event type. * @param {olx.FrameState} frameState Frame state. - * @param {ol.Matrix} transform Transform. + * @param {ol.Transform} transform Transform. * @private */ ol.renderer.dom.VectorLayer.prototype.dispatchEvent_ = function(type, frameState, transform) { diff --git a/src/ol/renderer/layerrenderer.js b/src/ol/renderer/layerrenderer.js index 3dc1df3c37..6a0d980d63 100644 --- a/src/ol/renderer/layerrenderer.js +++ b/src/ol/renderer/layerrenderer.js @@ -10,7 +10,7 @@ goog.require('ol.Observable'); goog.require('ol.TileRange'); goog.require('ol.TileState'); goog.require('ol.layer.Layer'); -goog.require('ol.matrix'); +goog.require('ol.transform'); goog.require('ol.source.State'); goog.require('ol.source.Tile'); @@ -57,9 +57,8 @@ ol.renderer.Layer.prototype.forEachFeatureAtCoordinate = ol.nullFunction; * @template S,T */ ol.renderer.Layer.prototype.forEachLayerAtPixel = function(pixel, frameState, callback, thisArg) { - 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); diff --git a/src/ol/renderer/maprenderer.js b/src/ol/renderer/maprenderer.js index d6a9e144d8..314a3321f7 100644 --- a/src/ol/renderer/maprenderer.js +++ b/src/ol/renderer/maprenderer.js @@ -2,7 +2,7 @@ goog.provide('ol.RendererType'); goog.provide('ol.renderer.Map'); goog.require('goog.asserts'); -goog.require('ol.matrix'); +goog.require('ol.transform'); goog.require('ol'); goog.require('ol.Disposable'); goog.require('ol.events'); @@ -65,17 +65,19 @@ ol.inherits(ol.renderer.Map, ol.Disposable); */ ol.renderer.Map.prototype.calculateMatrices2D = function(frameState) { var viewState = frameState.viewState; - var coordinateToPixelMatrix = frameState.coordinateToPixelMatrix; - goog.asserts.assert(coordinateToPixelMatrix, - 'frameState has a coordinateToPixelMatrix'); - ol.matrix.makeTransform(coordinateToPixelMatrix, - frameState.size[0] / 2, frameState.size[1] / 2, - 1 / viewState.resolution, -1 / viewState.resolution, - -viewState.rotation, + var coordinateToPixelTransform = frameState.coordinateToPixelTransform; + var pixelToCoordinateTransform = frameState.pixelToCoordinateTransform; + goog.asserts.assert(coordinateToPixelTransform, + 'frameState has a coordinateToPixelTransform'); + ol.transform.translate(ol.transform.reset(coordinateToPixelTransform), + frameState.size[0] / 2, frameState.size[1] / 2); + ol.transform.scale(coordinateToPixelTransform, + 1 / viewState.resolution, -1 / viewState.resolution); + ol.transform.rotate(coordinateToPixelTransform, -viewState.rotation); + ol.transform.translate(coordinateToPixelTransform, -viewState.center[0], -viewState.center[1]); - var inverted = ol.matrix.invert( - coordinateToPixelMatrix, frameState.pixelToCoordinateMatrix); - goog.asserts.assert(inverted, 'matrix could be inverted'); + ol.transform.invert( + ol.transform.setFromArray(pixelToCoordinateTransform, coordinateToPixelTransform)); }; diff --git a/src/ol/renderer/webgl/webglimagelayerrenderer.js b/src/ol/renderer/webgl/webglimagelayerrenderer.js index 5b10f1eb9c..cc57c79bb7 100644 --- a/src/ol/renderer/webgl/webglimagelayerrenderer.js +++ b/src/ol/renderer/webgl/webglimagelayerrenderer.js @@ -1,7 +1,7 @@ goog.provide('ol.renderer.webgl.ImageLayer'); goog.require('goog.asserts'); -goog.require('ol.matrix'); +goog.require('ol.transform'); goog.require('goog.webgl'); goog.require('ol.ImageBase'); goog.require('ol.ViewHint'); @@ -40,7 +40,7 @@ ol.renderer.webgl.ImageLayer = function(mapRenderer, imageLayer) { /** * @private - * @type {?ol.Matrix} + * @type {?ol.Transform} */ this.hitTransformationMatrix_ = null; @@ -164,9 +164,9 @@ ol.renderer.webgl.ImageLayer.prototype.prepareFrame = function(frameState, layer // Translate and scale to flip the Y coord. var texCoordMatrix = this.texCoordMatrix; - ol.matrix.makeIdentity(texCoordMatrix); - ol.matrix.scale(texCoordMatrix, 1, -1); - ol.matrix.translate(texCoordMatrix, 0, -1); + ol.transform.reset(texCoordMatrix); + ol.transform.scale(texCoordMatrix, 1, -1); + ol.transform.translate(texCoordMatrix, 0, -1); this.image_ = image; this.texture = texture; @@ -196,18 +196,18 @@ ol.renderer.webgl.ImageLayer.prototype.updateProjectionMatrix_ = function(canvas var canvasExtentHeight = canvasHeight * viewResolution; var projectionMatrix = this.projectionMatrix; - ol.matrix.makeIdentity(projectionMatrix); - ol.matrix.scale(projectionMatrix, + ol.transform.reset(projectionMatrix); + ol.transform.scale(projectionMatrix, pixelRatio * 2 / canvasExtentWidth, pixelRatio * 2 / canvasExtentHeight); - ol.matrix.rotate(projectionMatrix, -viewRotation); - ol.matrix.translate(projectionMatrix, + ol.transform.rotate(projectionMatrix, -viewRotation); + ol.transform.translate(projectionMatrix, imageExtent[0] - viewCenter[0], imageExtent[1] - viewCenter[1]); - ol.matrix.scale(projectionMatrix, + ol.transform.scale(projectionMatrix, (imageExtent[2] - imageExtent[0]) / 2, (imageExtent[3] - imageExtent[1]) / 2); - ol.matrix.translate(projectionMatrix, 1, 1); + ol.transform.translate(projectionMatrix, 1, 1); }; @@ -233,9 +233,8 @@ ol.renderer.webgl.ImageLayer.prototype.forEachLayerAtPixel = function(pixel, fra 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); @@ -253,9 +252,8 @@ ol.renderer.webgl.ImageLayer.prototype.forEachLayerAtPixel = function(pixel, fra frameState.size, imageSize); } - var pixelOnFrameBuffer = [0, 0]; - ol.matrix.multVec2( - this.hitTransformationMatrix_, pixel, pixelOnFrameBuffer); + var pixelOnFrameBuffer = ol.transform.apply( + this.hitTransformationMatrix_, pixel.slice()); if (pixelOnFrameBuffer[0] < 0 || pixelOnFrameBuffer[0] > imageSize[0] || pixelOnFrameBuffer[1] < 0 || pixelOnFrameBuffer[1] > imageSize[1]) { @@ -286,35 +284,31 @@ ol.renderer.webgl.ImageLayer.prototype.forEachLayerAtPixel = function(pixel, fra * pixel on the map. * @param {ol.Size} mapSize The map size. * @param {ol.Size} imageSize The image size. - * @return {ol.Matrix} The transformation matrix. + * @return {ol.Transform} The transformation matrix. * @private */ ol.renderer.webgl.ImageLayer.prototype.getHitTransformationMatrix_ = function(mapSize, imageSize) { // the first matrix takes a map pixel, flips the y-axis and scales to // a range between -1 ... 1 - var mapCoordMatrix = ol.matrix.create(); - ol.matrix.translate(mapCoordMatrix, -1, -1); - ol.matrix.scale(mapCoordMatrix, 2 / mapSize[0], 2 / mapSize[1]); - ol.matrix.translate(mapCoordMatrix, 0, mapSize[1]); - ol.matrix.scale(mapCoordMatrix, 1, -1); + var mapCoordTransform = ol.transform.create(); + ol.transform.translate(mapCoordTransform, -1, -1); + ol.transform.scale(mapCoordTransform, 2 / mapSize[0], 2 / mapSize[1]); + ol.transform.translate(mapCoordTransform, 0, mapSize[1]); + ol.transform.scale(mapCoordTransform, 1, -1); // the second matrix is the inverse of the projection matrix used in the // shader for drawing - var projectionMatrixInv = ol.matrix.create(); - ol.matrix.invert(this.projectionMatrix, projectionMatrixInv); + var projectionMatrixInv = ol.transform.invert(this.projectionMatrix.slice()); // the third matrix scales to the image dimensions and flips the y-axis again - var imageCoordMatrix = ol.matrix.create(); - ol.matrix.translate(imageCoordMatrix, 0, imageSize[1]); - ol.matrix.scale(imageCoordMatrix, 1, -1); - ol.matrix.scale(imageCoordMatrix, imageSize[0] / 2, imageSize[1] / 2); - ol.matrix.translate(imageCoordMatrix, 1, 1); + var transform = ol.transform.create(); + ol.transform.translate(transform, 0, imageSize[1]); + ol.transform.scale(transform, 1, -1); + ol.transform.scale(transform, imageSize[0] / 2, imageSize[1] / 2); + ol.transform.translate(transform, 1, 1); - var transformMatrix = ol.matrix.create(); - ol.matrix.multiply( - imageCoordMatrix, projectionMatrixInv, transformMatrix); - ol.matrix.multiply( - transformMatrix, mapCoordMatrix, transformMatrix); + ol.transform.multiply(transform, projectionMatrixInv); + ol.transform.multiply(transform, mapCoordTransform); - return transformMatrix; + return transform; }; diff --git a/src/ol/renderer/webgl/webgllayerrenderer.js b/src/ol/renderer/webgl/webgllayerrenderer.js index bd67d9bd8b..dce5d30658 100644 --- a/src/ol/renderer/webgl/webgllayerrenderer.js +++ b/src/ol/renderer/webgl/webgllayerrenderer.js @@ -2,7 +2,7 @@ goog.provide('ol.renderer.webgl.Layer'); goog.require('goog.webgl'); goog.require('ol.layer.Layer'); -goog.require('ol.matrix'); +goog.require('ol.transform'); goog.require('ol.render.Event'); goog.require('ol.render.EventType'); goog.require('ol.render.webgl.Immediate'); @@ -63,15 +63,15 @@ ol.renderer.webgl.Layer = function(mapRenderer, layer) { /** * @protected - * @type {ol.Matrix} + * @type {ol.Transform} */ - this.texCoordMatrix = ol.matrix.create(); + this.texCoordMatrix = ol.transform.create(); /** * @protected - * @type {ol.Matrix} + * @type {ol.Transform} */ - this.projectionMatrix = ol.matrix.create(); + this.projectionMatrix = ol.transform.create(); /** * @private @@ -209,7 +209,7 @@ ol.renderer.webgl.Layer.prototype.dispatchComposeEvent_ = function(type, context /** - * @return {!ol.Matrix} Matrix. + * @return {!ol.Transform} Matrix. */ ol.renderer.webgl.Layer.prototype.getTexCoordMatrix = function() { return this.texCoordMatrix; @@ -225,7 +225,7 @@ ol.renderer.webgl.Layer.prototype.getTexture = function() { /** - * @return {!ol.Matrix} Matrix. + * @return {!ol.Transform} Matrix. */ ol.renderer.webgl.Layer.prototype.getProjectionMatrix = function() { return this.projectionMatrix; diff --git a/src/ol/renderer/webgl/webgltilelayerrenderer.js b/src/ol/renderer/webgl/webgltilelayerrenderer.js index 64da99b499..3a8dcee8c1 100644 --- a/src/ol/renderer/webgl/webgltilelayerrenderer.js +++ b/src/ol/renderer/webgl/webgltilelayerrenderer.js @@ -4,7 +4,7 @@ goog.provide('ol.renderer.webgl.TileLayer'); goog.require('goog.asserts'); -goog.require('ol.matrix'); +goog.require('ol.transform'); goog.require('goog.webgl'); goog.require('ol.TileRange'); goog.require('ol.TileState'); @@ -351,21 +351,21 @@ ol.renderer.webgl.TileLayer.prototype.prepareFrame = function(frameState, layerS this.updateLogos(frameState, tileSource); var texCoordMatrix = this.texCoordMatrix; - ol.matrix.makeIdentity(texCoordMatrix); - ol.matrix.translate(texCoordMatrix, + ol.transform.reset(texCoordMatrix); + ol.transform.translate(texCoordMatrix, (center[0] - framebufferExtent[0]) / (framebufferExtent[2] - framebufferExtent[0]), (center[1] - framebufferExtent[1]) / (framebufferExtent[3] - framebufferExtent[1])); if (viewState.rotation !== 0) { - ol.matrix.rotate(texCoordMatrix, viewState.rotation); + ol.transform.rotate(texCoordMatrix, viewState.rotation); } - ol.matrix.scale(texCoordMatrix, + ol.transform.scale(texCoordMatrix, frameState.size[0] * viewState.resolution / (framebufferExtent[2] - framebufferExtent[0]), frameState.size[1] * viewState.resolution / (framebufferExtent[3] - framebufferExtent[1])); - ol.matrix.translate(texCoordMatrix, -0.5, -0.5); + ol.transform.translate(texCoordMatrix, -0.5, -0.5); return true; }; @@ -383,9 +383,8 @@ ol.renderer.webgl.TileLayer.prototype.forEachLayerAtPixel = function(pixel, fram pixel[0] / frameState.size[0], (frameState.size[1] - pixel[1]) / frameState.size[1]]; - var pixelOnFrameBufferScaled = [0, 0]; - ol.matrix.multVec2( - this.texCoordMatrix, pixelOnMapScaled, pixelOnFrameBufferScaled); + var pixelOnFrameBufferScaled = ol.transform.apply( + this.texCoordMatrix, pixelOnMapScaled.slice()); var pixelOnFrameBuffer = [ pixelOnFrameBufferScaled[0] * this.framebufferDimension, pixelOnFrameBufferScaled[1] * this.framebufferDimension]; diff --git a/src/ol/renderer/webgl/webglvectorlayerrenderer.js b/src/ol/renderer/webgl/webglvectorlayerrenderer.js index 6b9d04feb1..7e1c210975 100644 --- a/src/ol/renderer/webgl/webglvectorlayerrenderer.js +++ b/src/ol/renderer/webgl/webglvectorlayerrenderer.js @@ -5,7 +5,7 @@ goog.require('ol.events'); goog.require('ol.ViewHint'); goog.require('ol.extent'); goog.require('ol.layer.Vector'); -goog.require('ol.matrix'); +goog.require('ol.transform'); goog.require('ol.render.webgl.ReplayGroup'); goog.require('ol.renderer.vector'); goog.require('ol.renderer.webgl.Layer'); @@ -154,9 +154,8 @@ ol.renderer.webgl.VectorLayer.prototype.hasFeatureAtCoordinate = function(coordi * @inheritDoc */ ol.renderer.webgl.VectorLayer.prototype.forEachLayerAtPixel = function(pixel, frameState, callback, thisArg) { - var coordinate = pixel.slice(); - ol.matrix.multVec2( - frameState.pixelToCoordinateMatrix, coordinate, coordinate); + var coordinate = ol.transform.apply( + frameState.pixelToCoordinateTransform, pixel.slice()); var hasFeature = this.hasFeatureAtCoordinate(coordinate, frameState); if (hasFeature) { diff --git a/src/ol/source/imagevectorsource.js b/src/ol/source/imagevectorsource.js index cbf04b8e8a..d672ee254e 100644 --- a/src/ol/source/imagevectorsource.js +++ b/src/ol/source/imagevectorsource.js @@ -3,7 +3,7 @@ goog.provide('ol.source.ImageVector'); goog.require('goog.asserts'); goog.require('ol.events'); goog.require('ol.events.EventType'); -goog.require('ol.matrix'); +goog.require('ol.transform'); goog.require('ol.dom'); goog.require('ol.extent'); goog.require('ol.render.canvas.ReplayGroup'); @@ -40,9 +40,9 @@ ol.source.ImageVector = function(options) { /** * @private - * @type {ol.Matrix} + * @type {ol.Transform} */ - this.transform_ = ol.matrix.create(); + this.transform_ = ol.transform.create(); /** * @private @@ -211,15 +211,14 @@ ol.source.ImageVector.prototype.getStyleFunction = function() { * @param {number} resolution Resolution. * @param {number} pixelRatio Pixel ratio. * @param {ol.Size} size Size. - * @return {!ol.Matrix} Transform. + * @return {!ol.Transform} Transform. * @private */ ol.source.ImageVector.prototype.getTransform_ = function(center, resolution, pixelRatio, size) { - return ol.matrix.makeTransform(this.transform_, - size[0] / 2, size[1] / 2, - pixelRatio / resolution, -pixelRatio / resolution, - 0, - -center[0], -center[1]); + var transform = ol.transform.reset(this.transform_); + ol.transform.translate(transform, size[0] / 2, size[1] / 2); + ol.transform.scale(transform, pixelRatio / resolution, -pixelRatio / resolution); + return ol.transform.translate(transform, -center[0], -center[1]); }; diff --git a/src/ol/source/rastersource.js b/src/ol/source/rastersource.js index f59011b799..f6759297e2 100644 --- a/src/ol/source/rastersource.js +++ b/src/ol/source/rastersource.js @@ -4,7 +4,7 @@ goog.provide('ol.source.RasterEvent'); goog.provide('ol.source.RasterEventType'); goog.require('goog.asserts'); -goog.require('ol.matrix'); +goog.require('ol.transform'); goog.require('ol.ImageCanvas'); goog.require('ol.TileQueue'); goog.require('ol.dom'); @@ -120,7 +120,7 @@ ol.source.Raster = function(options) { this.frameState_ = { animate: false, attributions: {}, - coordinateToPixelMatrix: ol.matrix.create(), + coordinateToPixelTransform: ol.transform.create(), extent: null, focus: null, index: 0, @@ -128,7 +128,7 @@ ol.source.Raster = function(options) { layerStatesArray: layerStatesArray, logos: {}, pixelRatio: 1, - pixelToCoordinateMatrix: ol.matrix.create(), + pixelToCoordinateTransform: ol.transform.create(), postRenderFunctions: [], size: [0, 0], skippedFeatureUids: {}, diff --git a/src/ol/transform.js b/src/ol/transform.js new file mode 100644 index 0000000000..cdd9e13377 --- /dev/null +++ b/src/ol/transform.js @@ -0,0 +1,203 @@ +goog.provide('ol.transform'); + +/** + * Collection of affine 2d transformation functions. The functions work on an + * array of 6 elements. The element order is compatible with the [SVGMatrix + * interface](https://developer.mozilla.org/en-US/docs/Web/API/SVGMatrix) and is + * a subset (elements a to f) of a 3x3 martrix: + * ``` + * [ a c e ] + * [ b d f ] + * [ 0 0 1 ] + * ``` + */ + + +/** + * @private + * @type {ol.Transform} + */ +ol.transform.tmp_ = new Array(6); + + +/** + * Create an identity transform. + * @return {!ol.Transform} Identity transform. + */ +ol.transform.create = function() { + return [1, 0, 0, 1, 0, 0]; +}; + + +/** + * Resets the given transform to an identity transform. + * @param {!ol.Transform} transform Transform. + * @return {!ol.Transform} Transform. + */ +ol.transform.reset = function(transform) { + return ol.transform.set(transform, 1, 0, 0, 1, 0, 0); +}; + + +/** + * Multiply the underlying matrices of two transforms and return the result in + * the first transform. + * @param {!ol.Transform} transform1 Transform parameters of matrix 1. + * @param {!ol.Transform} transform2 Transform parameters of matrix 2. + * @return {!ol.Transform} transform1 multiplied with transform2. + */ +ol.transform.multiply = function(transform1, transform2) { + var a1 = transform1[0]; + var b1 = transform1[1]; + var c1 = transform1[2]; + var d1 = transform1[3]; + var e1 = transform1[4]; + var f1 = transform1[5]; + var a2 = transform2[0]; + var b2 = transform2[1]; + var c2 = transform2[2]; + var d2 = transform2[3]; + var e2 = transform2[4]; + var f2 = transform2[5]; + + transform1[0] = a1 * a2 + c1 * b2; + transform1[1] = b1 * a2 + d1 * b2; + transform1[2] = a1 * c2 + c1 * d2; + transform1[3] = b1 * c2 + d1 * d2; + transform1[4] = a1 * e2 + c1 * f2 + e1; + transform1[5] = b1 * e2 + d1 * f2 + f1; + + return transform1; +}; + +/** + * Set the transform components a-f on a given transform. + * @param {!ol.Transform} transform Transform. + * @param {number} a The a component of the transform. + * @param {number} b The b component of the transform. + * @param {number} c The c component of the transform. + * @param {number} d The d component of the transform. + * @param {number} e The e component of the transform. + * @param {number} f The f component of the transform. + * @return {!ol.Transform} Matrix with transform applied. + */ +ol.transform.set = function(transform, a, b, c, d, e, f) { + transform[0] = a; + transform[1] = b; + transform[2] = c; + transform[3] = d; + transform[4] = e; + transform[5] = f; + return transform; +}; + + +/** + * Set transform on one matrix from another matrix. + * @param {!ol.Transform} transform1 Matrix to set transform to. + * @param {!ol.Transform} transform2 Matrix to set transform from. + * @return {!ol.Transform} transform1 with transform from transform2 applied. + */ +ol.transform.setFromArray = function(transform1, transform2) { + transform1[0] = transform2[0]; + transform1[1] = transform2[1]; + transform1[2] = transform2[2]; + transform1[3] = transform2[3]; + transform1[4] = transform2[4]; + transform1[5] = transform2[5]; + return transform1; +}; + + +/** + * Transforms the given coordinate with the given transform returning the + * resulting, transformed coordinate. The coordinate will be modified in-place. + * + * @param {ol.Transform} transform The transformation. + * @param {ol.Coordinate|ol.Pixel} coordinate The coordinate to transform. + * @return {ol.Coordinate|ol.Pixel} return coordinate so that operations can be + * chained together. + */ +ol.transform.apply = function(transform, coordinate) { + var x = coordinate[0], y = coordinate[1]; + coordinate[0] = transform[0] * x + transform[2] * y + transform[4]; + coordinate[1] = transform[1] * x + transform[3] * y + transform[5]; + return coordinate; +}; + + +/** + * Applies rotation to the given transform. + * @param {!ol.Transform} transform Transform. + * @param {number} angle Angle in radians. + * @return {!ol.Transform} The rotated transform. + */ +ol.transform.rotate = function(transform, angle) { + var cos = Math.cos(angle); + var sin = Math.sin(angle); + return ol.transform.multiply(transform, + ol.transform.set(ol.transform.tmp_, cos, sin, -sin, cos, 0, 0)); +}; + + +/** + * Applies scale to a given transform. + * @param {!ol.Transform} transform Transform. + * @param {number} x Scale factor x. + * @param {number} y Scale factor y. + * @return {!ol.Transform} The scaled transform. + */ +ol.transform.scale = function(transform, x, y) { + return ol.transform.multiply(transform, + ol.transform.set(ol.transform.tmp_, x, 0, 0, y, 0, 0)); +}; + + +/** + * Applies translation to the given transform. + * @param {!ol.Transform} transform Transform. + * @param {number} dx Translation x. + * @param {number} dy Translation y. + * @return {!ol.Transform} The translated transform. + */ +ol.transform.translate = function(transform, dx, dy) { + return ol.transform.multiply(transform, + ol.transform.set(ol.transform.tmp_, 1, 0, 0, 1, dx, dy)); +}; + + +/** + * Invert the given transform. + * @param {!ol.Transform} transform Transform. + * @return {!ol.Transform} Inverse of the transform. + */ +ol.transform.invert = function(transform) { + var det = ol.transform.determinant(transform); + goog.asserts.assert(det !== 0, 'Transformation matrix cannot be inverted.'); + + var a = transform[0]; + var b = transform[1]; + var c = transform[2]; + var d = transform[3]; + var e = transform[4]; + var f = transform[5]; + + transform[0] = d / det; + transform[1] = -b / det; + transform[2] = -c / det; + transform[3] = a / det; + transform[4] = (c * f - d * e) / det; + transform[5] = -(a * f - b * e) / det; + + return transform; +}; + + +/** + * Returns the determinant of the given matrix. + * @param {!ol.Transform} mat Matrix. + * @return {number} Determinant. + */ +ol.transform.determinant = function(mat) { + return mat[0] * mat[3] - mat[1] * mat[2]; +}; diff --git a/src/ol/typedefs.js b/src/ol/typedefs.js index d2a60b3cf9..9f5449eaf4 100644 --- a/src/ol/typedefs.js +++ b/src/ol/typedefs.js @@ -330,11 +330,11 @@ ol.MapOptionsInternal; /** - * An array representing a matrix for use in {@link ol.matrix}. The array has - * 6 elements, and the element order is `[a, b, c, d, e, f]`. + * An array representing an affine 2d transformation for use with + * {@link ol.transform} functions. The array has 6 elements. * @typedef {Array.} */ -ol.Matrix; +ol.Transform; /** diff --git a/src/ol/vec/mat4.js b/src/ol/vec/mat4.js index eca4fcacc7..0525494378 100644 --- a/src/ol/vec/mat4.js +++ b/src/ol/vec/mat4.js @@ -8,7 +8,7 @@ ol.vec.Mat4.tmpMatrix_ = [1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1]; /** - * @param {ol.Matrix} mat Transformation matrix. + * @param {ol.Transform} mat Transformation matrix. * @return {Array.} 2D transformation matrix as flattened 4x4 matrix. */ ol.vec.Mat4.fromMatrix = function(mat) { diff --git a/test/spec/ol/dom/dom.test.js b/test/spec/ol/dom/dom.test.js index bf69cb012f..9a20b5ad7d 100644 --- a/test/spec/ol/dom/dom.test.js +++ b/test/spec/ol/dom/dom.test.js @@ -147,8 +147,8 @@ describe('ol.dom', function() { describe('ol.dom.transformElement2D', function() { var element = null; - var transform = ol.matrix.create(); - var transformFloat = ol.matrix.create(); + var transform = ol.transform.create(); + var transformFloat = ol.transform.create(); transformFloat[0] = 0.12345; beforeEach(function() { element = document.createElement('div'); @@ -564,5 +564,5 @@ describe('ol.dom', function() { }); goog.require('goog.userAgent'); -goog.require('ol.matrix'); +goog.require('ol.transform'); goog.require('ol.dom'); diff --git a/test/spec/ol/render.test.js b/test/spec/ol/render.test.js index e54ae580c0..890c8aa0f1 100644 --- a/test/spec/ol/render.test.js +++ b/test/spec/ol/render.test.js @@ -22,16 +22,16 @@ describe('ol.render', function() { [0, 0, size[0] * pixelRatio, size[1] * pixelRatio]); expect(canvas.style.width).to.be(size[0] + 'px'); expect(canvas.style.height).to.be(size[1] + 'px'); - var transform = ol.matrix.makeTransform(ol.matrix.create(), - 0, 0, pixelRatio, pixelRatio, 0, 0, 0); - expect(ol.matrix.equals(render.transform_, transform)).to.be.ok(); + var transform = ol.transform.scale(ol.transform.create(), + pixelRatio, pixelRatio); + expect(ol.array.equals(render.transform_, transform)).to.be.ok(); }); }); }); -goog.require('ol.matrix'); +goog.require('ol.transform'); goog.require('ol.render'); goog.require('ol.render.canvas.Immediate'); goog.require('ol.vec.Mat4'); diff --git a/test/spec/ol/renderer/canvas/canvaslayerrenderer.test.js b/test/spec/ol/renderer/canvas/canvaslayerrenderer.test.js index f760cd8e04..eb132a58cb 100644 --- a/test/spec/ol/renderer/canvas/canvaslayerrenderer.test.js +++ b/test/spec/ol/renderer/canvas/canvaslayerrenderer.test.js @@ -23,11 +23,11 @@ describe('ol.renderer.canvas.Layer', function() { }, size: [10, 10], pixelRatio: 1, - coordinateToPixelMatrix: ol.matrix.create(), - pixelToCoordinateMatrix: ol.matrix.create() + coordinateToPixelTransform: ol.transform.create(), + pixelToCoordinateTransform: ol.transform.create() }; renderer.getImageTransform = function() { - return ol.matrix.create(); + return ol.transform.create(); }; ol.renderer.Map.prototype.calculateMatrices2D(frameState); var layerState = layer.getLayerState(); @@ -62,7 +62,7 @@ describe('ol.renderer.canvas.Layer', function() { goog.require('ol.render.canvas'); -goog.require('ol.matrix'); +goog.require('ol.transform'); goog.require('ol.layer.Image'); goog.require('ol.renderer.Map'); goog.require('ol.renderer.canvas.Layer'); diff --git a/test/spec/ol/renderer/webgl/webglimagelayerrenderer.test.js b/test/spec/ol/renderer/webgl/webglimagelayerrenderer.test.js index d35dee0e75..b87b571838 100644 --- a/test/spec/ol/renderer/webgl/webglimagelayerrenderer.test.js +++ b/test/spec/ol/renderer/webgl/webglimagelayerrenderer.test.js @@ -49,32 +49,30 @@ describe('ol.renderer.webgl.ImageLayer', function() { pixelRatio, viewCenter, viewResolution, viewRotation, imageExtent); var matrix = renderer.getProjectionMatrix(); - var output = ol.matrix.create(); - - ol.matrix.multVec2(matrix, [-1, -1], output); + var output = ol.transform.apply(matrix, [-1, -1]); expect(output[0]).to.eql(-6); expect(output[1]).to.eql(-6); - ol.matrix.multVec2(matrix, [1, -1], output); + output = ol.transform.apply(matrix, [1, -1]); expect(output[0]).to.eql(2); expect(output[1]).to.eql(-6); - ol.matrix.multVec2(matrix, [-1, 1], output); + output = ol.transform.apply(matrix, [-1, 1]); expect(output[0]).to.eql(-6); expect(output[1]).to.eql(6); - ol.matrix.multVec2(matrix, [1, 1], output); + output = ol.transform.apply(matrix, [1, 1]); expect(output[0]).to.eql(2); expect(output[1]).to.eql(6); - ol.matrix.multVec2(matrix, [0, 0], output); + output = ol.transform.apply(matrix, [0, 0]); expect(output[0]).to.eql(-2); expect(output[1]).to.eql(0); }); }); }); -goog.require('ol.matrix'); +goog.require('ol.transform'); goog.require('ol.Map'); goog.require('ol.proj.common'); goog.require('ol.layer.Image');