Make createTransformToString a standalone function

src/ol/renderer/canvas/ImageLayer.js

@@ -8,6 +8,7 @@ import {fromUserExtent} from '../../proj.js';
 import {getIntersection, isEmpty} from '../../extent.js';
 import CanvasLayerRenderer from './Layer.js';
 import {compose as composeTransform, makeInverse} from '../../transform.js';
+import {createTransformString} from '../../render/canvas.js';
 
 /**
  * @classdesc
@@ -109,7 +110,7 @@ class CanvasImageLayerRenderer extends CanvasLayerRenderer {
     );
     makeInverse(this.inversePixelTransform, this.pixelTransform);
 
-    const canvasTransform = this.createTransformString(this.pixelTransform);
+    const canvasTransform = createTransformString(this.pixelTransform);
 
     this.useContainer(target, canvasTransform, layerState.opacity);
 

src/ol/renderer/canvas/Layer.js

@@ -7,7 +7,7 @@ import RenderEvent from '../../render/Event.js';
 import RenderEventType from '../../render/EventType.js';
 import {rotateAtOffset} from '../../render/canvas.js';
 import LayerRenderer from '../Layer.js';
-import {create as createTransform, apply as applyTransform, compose as composeTransform, toString} from '../../transform.js';
+import {create as createTransform, apply as applyTransform, compose as composeTransform} from '../../transform.js';
 
 /**
  * @abstract
@@ -69,12 +69,6 @@ class CanvasLayerRenderer extends LayerRenderer {
      */
     this.containerReused = false;
 
-    /**
-     * @type {HTMLCanvasElement}
-     * @private
-     */
-    this.createTransformStringCanvas_ = 'document' in self ? createCanvasContext2D(1, 1).canvas : null;
-
   }
 
   /**
@@ -269,19 +263,7 @@ class CanvasLayerRenderer extends LayerRenderer {
     return data;
   }
 
-  /**
-   * @param {import("../../transform.js").Transform} transform Transform.
-   * @return {string} CSS transform.
-   */
-  createTransformString(transform) {
-    if (this.createTransformStringCanvas_) {
-      this.createTransformStringCanvas_.style.transform = toString(transform);
-      return this.createTransformStringCanvas_.style.transform;
-    } else {
-      return toString(transform);
-    }
-  }
-
 }
 
 export default CanvasLayerRenderer;
+

src/ol/renderer/canvas/TileLayer.js

@@ -9,6 +9,7 @@ import {createEmpty, equals, getIntersection, getTopLeft} from '../../extent.js'
 import CanvasLayerRenderer from './Layer.js';
 import {apply as applyTransform, compose as composeTransform, makeInverse} from '../../transform.js';
 import {numberSafeCompareFunction} from '../../array.js';
+import {createTransformString} from '../../render/canvas.js';
 
 /**
  * @classdesc
@@ -243,7 +244,7 @@ class CanvasTileLayerRenderer extends CanvasLayerRenderer {
       -width / 2, -height / 2
     );
 
-    const canvasTransform = this.createTransformString(this.pixelTransform);
+    const canvasTransform = createTransformString(this.pixelTransform);
 
     this.useContainer(target, canvasTransform, layerState.opacity);
     const context = this.context;