From 3a2133c130ca9856b9852012797a35e3a8144156 Mon Sep 17 00:00:00 2001 From: Tom Payne Date: Thu, 31 Oct 2013 19:50:01 +0100 Subject: [PATCH] Add and use ol.renderer.canvas.Layer#composeFrame --- src/ol/renderer/canvas/canvaslayerrenderer.js | 39 +++++++++++++++++++ src/ol/renderer/canvas/canvasmaprenderer.js | 35 +---------------- 2 files changed, 41 insertions(+), 33 deletions(-) diff --git a/src/ol/renderer/canvas/canvaslayerrenderer.js b/src/ol/renderer/canvas/canvaslayerrenderer.js index 074e1b87a1..340965d3be 100644 --- a/src/ol/renderer/canvas/canvaslayerrenderer.js +++ b/src/ol/renderer/canvas/canvaslayerrenderer.js @@ -1,5 +1,6 @@ goog.provide('ol.renderer.canvas.Layer'); +goog.require('goog.vec.Mat4'); goog.require('ol.layer.Layer'); goog.require('ol.renderer.Layer'); @@ -17,6 +18,44 @@ ol.renderer.canvas.Layer = function(mapRenderer, layer) { goog.inherits(ol.renderer.canvas.Layer, ol.renderer.Layer); +/** + * @param {ol.FrameState} frameState Frame state. + * @param {ol.layer.LayerState} layerState Layer state. + * @param {CanvasRenderingContext2D} context Context. + */ +ol.renderer.canvas.Layer.prototype.composeFrame = + function(frameState, layerState, context) { + + var image = this.getImage(); + if (!goog.isNull(image)) { + var transform = this.getTransform(); + context.globalAlpha = layerState.opacity; + + // for performance reasons, context.setTransform is only used + // when the view is rotated. see http://jsperf.com/canvas-transform + if (frameState.view2DState.rotation === 0) { + var dx = goog.vec.Mat4.getElement(transform, 0, 3); + var dy = goog.vec.Mat4.getElement(transform, 1, 3); + var dw = image.width * goog.vec.Mat4.getElement(transform, 0, 0); + var dh = image.height * goog.vec.Mat4.getElement(transform, 1, 1); + context.drawImage(image, 0, 0, +image.width, +image.height, + Math.round(dx), Math.round(dy), Math.round(dw), Math.round(dh)); + } else { + context.setTransform( + goog.vec.Mat4.getElement(transform, 0, 0), + goog.vec.Mat4.getElement(transform, 1, 0), + goog.vec.Mat4.getElement(transform, 0, 1), + goog.vec.Mat4.getElement(transform, 1, 1), + goog.vec.Mat4.getElement(transform, 0, 3), + goog.vec.Mat4.getElement(transform, 1, 3)); + context.drawImage(image, 0, 0); + context.setTransform(1, 0, 0, 1, 0, 0); + } + } + +}; + + /** * @return {HTMLCanvasElement|HTMLVideoElement|Image} Canvas. */ diff --git a/src/ol/renderer/canvas/canvasmaprenderer.js b/src/ol/renderer/canvas/canvasmaprenderer.js index a032bf0245..e48d99d654 100644 --- a/src/ol/renderer/canvas/canvasmaprenderer.js +++ b/src/ol/renderer/canvas/canvasmaprenderer.js @@ -107,9 +107,8 @@ ol.renderer.canvas.Map.prototype.renderFrame = function(frameState) { var layerStates = frameState.layerStates; var layersArray = frameState.layersArray; var viewResolution = frameState.view2DState.resolution; - var i, ii, image, layer, layerRenderer, layerState, transform; + var i, ii, layer, layerRenderer, layerState; for (i = 0, ii = layersArray.length; i < ii; ++i) { - layer = layersArray[i]; layerRenderer = /** @type {ol.renderer.canvas.Layer} */ (this.getLayerRenderer(layer)); @@ -121,37 +120,7 @@ ol.renderer.canvas.Map.prototype.renderFrame = function(frameState) { continue; } layerRenderer.prepareFrame(frameState, layerState); - - image = layerRenderer.getImage(); - if (!goog.isNull(image)) { - transform = layerRenderer.getTransform(); - context.globalAlpha = layerState.opacity; - - // for performance reasons, context.setTransform is only used - // when the view is rotated. see http://jsperf.com/canvas-transform - if (frameState.view2DState.rotation === 0) { - var dx = goog.vec.Mat4.getElement(transform, 0, 3); - var dy = goog.vec.Mat4.getElement(transform, 1, 3); - var dw = image.width * goog.vec.Mat4.getElement(transform, 0, 0); - var dh = image.height * goog.vec.Mat4.getElement(transform, 1, 1); - goog.asserts.assert(goog.isNumber(image.width)); - goog.asserts.assert(goog.isNumber(image.height)); - context.drawImage(image, 0, 0, image.width, image.height, - Math.round(dx), Math.round(dy), Math.round(dw), Math.round(dh)); - } else { - context.setTransform( - goog.vec.Mat4.getElement(transform, 0, 0), - goog.vec.Mat4.getElement(transform, 1, 0), - goog.vec.Mat4.getElement(transform, 0, 1), - goog.vec.Mat4.getElement(transform, 1, 1), - goog.vec.Mat4.getElement(transform, 0, 3), - goog.vec.Mat4.getElement(transform, 1, 3)); - - context.drawImage(image, 0, 0); - context.setTransform(1, 0, 0, 1, 0, 0); - } - } - + layerRenderer.composeFrame(frameState, layerState, context); } if (!this.renderedVisible_) {