@pirireis/webglobeplugins 0.17.1 → 1.0.2

package/pin/pin-point-totem1.js

@@ -1,60 +1,77 @@
-"use strict";
-/**
- * This class registered as globe plugin one for each globe. to the head of plugin call stack.
- */
-class PinPointTotem {
-    constructor(globe) {
-        this.objectArrayMap = new Map();
-    }
-    /**
-     * objectArray
-     * callbacks ={
-     *  mouseDown,
-     *  mouseMove,
-     *  mouseUp,
-     *  mouseClick,
-     *  mouseDbClick,
-     *  keyDown,
-     *  keyUp
-     * }
-     */
-    registerPinMap(objectArray, callbacks) {
-        this.objectArrayMap.set(objectArray, callbacks);
-    }
-    unregisterPinMap(objectArray) {
-        if (this.objectArrayMap.has(objectArray)) {
-            this.objectArrayMap.delete(objectArray);
-        }
-        else {
-            console.warn('PinPointTotem objectArrayMap does not contain the objectArray');
-        }
-    }
-    // GlobeMethods
-    // haritada sol butona basıldığında çağrılır
-    mouseDown(x, y, event) {
-        return false;
-    }
-    // mouse'a basılıp hareket ettirildiğinde, mouseDown'dan true dönmüşse çağrılır
-    mouseMove(x, y, event) {
-    }
-    // mouse up'ın left'i mouseDown'dan true dönmüşse çağrılır, edit mode içindir
-    // right'i ise sağ tıka basılıp bırakıldığında çağrılır
-    mouseUp(x, y, event) {
-    }
-    // harita üzerinde tıklandığında çağrılır
-    mouseClick(x, y, event) {
-        return false;
-    }
-    // harita üzerinde çift tıklandığında çağrılır
-    mouseDblClick(x, y, event) {
-        return false;
-    }
-    // klavyeden bir tuşa basıldığı anda ve tuşa basılı kalınmaya devam edildiği durumlarda çalışır
-    keyDown(event) {
-        return false;
-    }
-    // klavyedeki bir tuştan parmak çekildiği anda çalışır
-    keyUp(event) {
-        return false;
-    }
-}
+/**
+ * This class registered as globe plugin one for each globe. to the head of plugin call stack. 
+ */
+
+class PinPointTotem {
+    constructor(globe) {
+
+        this.objectArrayMap = new Map()
+    }
+
+
+    /**
+     * objectArray
+     * callbacks ={
+     *  mouseDown,
+     *  mouseMove,
+     *  mouseUp,
+     *  mouseClick,
+     *  mouseDbClick,
+     *  keyDown,
+     *  keyUp
+     * }
+     */
+    registerPinMap(objectArray, callbacks) {
+        this.objectArrayMap.set(objectArray, callbacks);
+    }
+
+    unregisterPinMap(objectArray) {
+        if (this.objectArrayMap.has(objectArray)) {
+            this.objectArrayMap.delete(objectArray);
+        } else {
+            console.warn('PinPointTotem objectArrayMap does not contain the objectArray')
+        }
+    }
+
+
+    // GlobeMethods
+    // haritada sol butona basıldığında çağrılır
+    mouseDown(x, y, event) {
+
+        return false
+    }
+
+    // mouse'a basılıp hareket ettirildiğinde, mouseDown'dan true dönmüşse çağrılır
+    mouseMove(x, y, event) {
+
+    }
+
+    // mouse up'ın left'i mouseDown'dan true dönmüşse çağrılır, edit mode içindir
+    // right'i ise sağ tıka basılıp bırakıldığında çağrılır
+    mouseUp(x, y, event) {
+
+    }
+
+    // harita üzerinde tıklandığında çağrılır
+    mouseClick(x, y, event) {
+
+        return false
+    }
+
+    // harita üzerinde çift tıklandığında çağrılır
+    mouseDblClick(x, y, event) {
+        return false
+    }
+
+    // klavyeden bir tuşa basıldığı anda ve tuşa basılı kalınmaya devam edildiği durumlarda çalışır
+    keyDown(event) {
+        return false
+    }
+
+    // klavyedeki bir tuştan parmak çekildiği anda çalışır
+    keyUp(event) {
+
+        return false
+    }
+
+}

package/programs/arrowfield/arrow-field.js

@@ -1,60 +1,89 @@
-// this contains vao, drawCount, ArrowBufferBlock, vao,
-// how to, where to set instanced parameters
-// the vectorfield buffer should be managed outside, since it can be static or dynamic.
-import Logic from './logic';
-import { globeProgramCache } from '../programcache';
-import { longlatbbox2normalbbox } from "../util";
-export class ArrowField {
-    constructor(gl, globe, { minLon = -180, maxLon = 180, minLat = -90, maxLat = 90, height = 0, opacity = 1, color = [0.04, 0.2, 0.8], targetWidth = 100, targetHeight = 100, dataWidth = null, dataHeight = null, tailLengthRatio = 1, wingLengthRatio = 0.5, noDataValue = null,
-    // maxMagnitude = null
-     } = {}) {
-        this.gl = gl;
-        this.globe = globe;
-        this.program = globeProgramCache.getProgram(globe, Logic);
-        this.arrowBlockManager = this.program.getArrowBlockBufferManager();
-        this.instanceCount = targetWidth * targetHeight;
-        this.arrowBlockManager.update({ resolution: [targetWidth, targetHeight] });
-        this.textureManager = this.program.getTextureManager(dataWidth, dataHeight);
-        this.setBBox({ minLon, maxLon, minLat, maxLat });
-        this.update({ height, opacity, color, tailLengthRatio, wingLengthRatio, noDataValue });
-    }
-    setBBox({ minLon = -180, maxLon = 180, minLat = -90, maxLat = 90 } = {}) {
-        this.bbox = { minLon, maxLon, minLat, maxLat };
-        const { bboxSizeRad, bboxOffsetRad } = longlatbbox2normalbbox(this.bbox);
-        this.arrowBlockManager.update({ bboxSizeRad, bboxOffsetRad });
-        this.globe.DrawRender();
-    }
-    update({ height, opacity, color, resolution, tailLengthRatio, wingLengthRatio, noDataValue } = {}) {
-        if (resolution) {
-            this.instanceCount = resolution[0] * resolution[1];
-        }
-        this.arrowBlockManager.update({
-            color,
-            resolution,
-            height,
-            opacity,
-            tailLengthRatio,
-            wingLengthRatio,
-            noDataValue,
-        });
-        this.globe.DrawRender();
-    }
-    setTargetResolution(width, height) {
-        this.instanceCount = width * height;
-        this.arrowBlockManager.update({ resolution: [width, height] });
-        this.globe.DrawRender();
-    }
-    draw() {
-        const { program, arrowBlockManager, textureManager, instanceCount } = this;
-        program.draw(arrowBlockManager, textureManager, instanceCount);
-    }
-    setData(rotation) {
-        this.textureManager.setData(rotation);
-        this.globe.DrawRender();
-    }
-    free() {
-        this.arrowBlockManager.free();
-        this.textureManager.free();
-        globeProgramCache.releaseProgram(this.gl, Logic);
-    }
-}
+// this contains vao, drawCount, ArrowBufferBlock, vao,
+// how to, where to set instanced parameters
+// the vectorfield buffer should be managed outside, since it can be static or dynamic.
+
+import Logic from './logic';
+import { globeProgramCache } from '../programcache';
+import { longlatbbox2normalbbox } from "../util";
+
+export class ArrowField {
+    constructor(gl, globe, {
+        minLon = -180,
+        maxLon = 180,
+        minLat = -90,
+        maxLat = 90,
+        height = 0,
+        opacity = 1,
+        color = [0.04, 0.2, 0.8],
+        targetWidth = 100,
+        targetHeight = 100,
+        dataWidth = null,
+        dataHeight = null,
+        tailLengthRatio = 1,
+        wingLengthRatio = 0.5,
+        noDataValue = null,
+        // maxMagnitude = null
+    } = {}) {
+        this.gl = gl;
+        this.globe = globe;
+
+        this.program = globeProgramCache.getProgram(globe, Logic);
+        this.arrowBlockManager = this.program.getArrowBlockBufferManager();
+        this.instanceCount = targetWidth * targetHeight;
+        this.arrowBlockManager.update({ resolution: [targetWidth, targetHeight] });
+        this.textureManager = this.program.getTextureManager(dataWidth, dataHeight);
+        this.setBBox({ minLon, maxLon, minLat, maxLat });
+        this.update({ height, opacity, color, tailLengthRatio, wingLengthRatio, noDataValue });
+    }
+
+
+    setBBox({ minLon = -180, maxLon = 180, minLat = -90, maxLat = 90 } = {}) {
+        this.bbox = { minLon, maxLon, minLat, maxLat };
+        const { bboxSizeRad, bboxOffsetRad } = longlatbbox2normalbbox(this.bbox);
+        this.arrowBlockManager.update({ bboxSizeRad, bboxOffsetRad });
+        this.globe.DrawRender();
+    }
+
+
+    update({ height, opacity, color, resolution, tailLengthRatio, wingLengthRatio, noDataValue } = {}) {
+        if (resolution) {
+            this.instanceCount = resolution[0] * resolution[1];
+        }
+        this.arrowBlockManager.update({
+            color,
+            resolution,
+            height,
+            opacity,
+            tailLengthRatio,
+            wingLengthRatio,
+            noDataValue,
+        });
+        this.globe.DrawRender();
+    }
+
+    setTargetResolution(width, height) {
+        this.instanceCount = width * height;
+        this.arrowBlockManager.update({ resolution: [width, height] });
+
+        this.globe.DrawRender();
+    }
+
+    draw() {
+        const { program, arrowBlockManager, textureManager, instanceCount } = this;
+        program.draw(arrowBlockManager, textureManager, instanceCount);
+    }
+
+
+    setData(rotation) {
+        this.textureManager.setData(rotation);
+        this.globe.DrawRender();
+    }
+
+
+    free() {
+        this.arrowBlockManager.free();
+        this.textureManager.free();
+        globeProgramCache.releaseProgram(this.gl, Logic);
+    }
+}
+

package/programs/arrowfield/logic.js

@@ -1,6 +1,7 @@
-import { createProgram } from "../../util/webglobjectbuilders";
-import { globeProgramCache } from "../programcache";
-import { CameraUniformBlockTotem } from "../totems";
+import { createProgram } from "../../util/webglobjectbuilders";
+import { globeProgramCache } from "../programcache";
+import { CameraUniformBlockTotem } from "../totems";
+
 const arrowVertexShader = `#version 300 es
 #define R 6378.137
 #define PI 3.1415926535897932384626433832795
@@ -106,7 +107,9 @@ void main() {
     v_color = u_color;
     gl_PointSize = 4.0;
 }
-`;
+`;
+
+
 const arrowFragmentShader = `#version 300 es
 precision highp float;
 in vec4 v_color;
@@ -115,140 +118,169 @@ out vec4 outColor;
 void main() {
     outColor = v_color;
 }
-`;
-export default class ArrowFieldLogic {
-    constructor() {
-        this.gl = null;
-        this.globe = null;
-        this.cameraUniformBlockTotem = null;
-        this.program = null;
-        this.cameraBlockBindingPoint = 0;
-        this.arrayBlockBindingPoint = 1;
-    }
-    init(globe, gl) {
-        this.gl = gl;
-        this.globe = globe;
-        this.cameraUniformBlockTotem = globeProgramCache.getProgram(globe, CameraUniformBlockTotem);
-        this.program = this._createProgram();
-    }
-    _createProgram() {
-        const gl = this.gl;
-        const program = createProgram(gl, arrowVertexShader, arrowFragmentShader);
-        const cameraBlockIndex = gl.getUniformBlockIndex(program, "CameraBlock");
-        gl.uniformBlockBinding(program, cameraBlockIndex, this.cameraBlockBindingPoint);
-        const arrowBlockIndex = gl.getUniformBlockIndex(program, "ArrowBlock");
-        gl.uniformBlockBinding(program, arrowBlockIndex, this.arrayBlockBindingPoint);
-        this.textureLocations = {
-            rotationLocation: gl.getUniformLocation(program, "rotation"),
-        };
-        return program;
-    }
-    getArrowBlockBufferManager() {
-        return new ArrowBlockBufferManager(this.gl, this.arrayBlockBindingPoint);
-    }
-    // initial load type is static. 
-    // after that, it is dynamic.
-    getTextureManager(width, height) {
-        return new TextureManager(this.gl, width, height, this.textureLocations);
-    }
-    draw(arrowBlockManager, textureManager, instanceCount) {
-        const { gl, cameraBlockBindingPoint, cameraUniformBlockTotem } = this;
-        gl.useProgram(this.program);
-        arrowBlockManager.bind();
-        textureManager.activate();
-        cameraUniformBlockTotem.bind(cameraBlockBindingPoint);
-        gl.drawArraysInstanced(gl.LINES, 0, 6, instanceCount);
-        // gl.drawArraysInstanced(gl.POINTS, 0, 4, instanceCount);
-        cameraUniformBlockTotem.unbind(cameraBlockBindingPoint);
-        arrowBlockManager.unbind();
-    }
-    free() {
-        const { gl, program } = this;
-        gl.deleteProgram(program);
-        globeProgramCache.releaseProgram(this.globe, CameraUniformBlockTotem);
-    }
-}
-class ArrowBlockBufferManager {
-    constructor(gl, bindingPoint) {
-        this.gl = gl;
-        this.bindingPoint = bindingPoint;
-        this.ubo = gl.createBuffer();
-        gl.bindBuffer(gl.UNIFORM_BUFFER, this.ubo);
-        // 4 + 2+ 2 + 2 + 1 +1 +1 +1+1= 15 ~= 16
-        gl.bufferData(gl.UNIFORM_BUFFER, 56, gl.DYNAMIC_DRAW);
-        gl.bindBuffer(gl.UNIFORM_BUFFER, null);
-    }
-    update({ color = null, bboxOffsetRad = null, bboxSizeRad = null, resolution = null, tailLengthRatio = null, wingLengthRatio = null, height = null, opacity = null, noDataValue = null, } = {}) {
-        const { gl, ubo } = this;
-        gl.bindBuffer(gl.UNIFORM_BUFFER, ubo);
-        if (color !== null)
-            gl.bufferSubData(gl.UNIFORM_BUFFER, 0, new Float32Array(color));
-        if (opacity !== null)
-            gl.bufferSubData(gl.UNIFORM_BUFFER, 12, new Float32Array([opacity]));
-        if (bboxOffsetRad !== null)
-            gl.bufferSubData(gl.UNIFORM_BUFFER, 16, new Float32Array(bboxOffsetRad));
-        if (bboxSizeRad !== null)
-            gl.bufferSubData(gl.UNIFORM_BUFFER, 24, new Float32Array(bboxSizeRad));
-        if (resolution !== null)
-            gl.bufferSubData(gl.UNIFORM_BUFFER, 32, new Float32Array(resolution));
-        if (tailLengthRatio !== null)
-            gl.bufferSubData(gl.UNIFORM_BUFFER, 40, new Float32Array([tailLengthRatio]));
-        if (wingLengthRatio !== null)
-            gl.bufferSubData(gl.UNIFORM_BUFFER, 44, new Float32Array([wingLengthRatio]));
-        if (height !== null)
-            gl.bufferSubData(gl.UNIFORM_BUFFER, 48, new Float32Array([height]));
-        if (noDataValue !== null)
-            gl.bufferSubData(gl.UNIFORM_BUFFER, 52, new Float32Array([noDataValue]));
-        gl.bindBuffer(gl.UNIFORM_BUFFER, null);
-    }
-    bind() {
-        const { gl, ubo, bindingPoint } = this;
-        gl.bindBufferBase(gl.UNIFORM_BUFFER, bindingPoint, ubo);
-    }
-    unbind() {
-        const { gl, bindingPoint } = this;
-        gl.bindBufferBase(gl.UNIFORM_BUFFER, bindingPoint, null);
-    }
-    free() {
-        const { gl, ubo } = this;
-        gl.deleteBuffer(ubo);
-    }
-}
-class TextureManager {
-    constructor(gl, width, height, { rotationLocation }) {
-        this.gl = gl;
-        this.width = width;
-        this.height = height;
-        this.rotationLocation = rotationLocation;
-        this.rotationTexture = this._createFloatTexture();
-    }
-    _createFloatTexture() {
-        const { gl, width, height } = this;
-        const texture = gl.createTexture();
-        gl.bindTexture(gl.TEXTURE_2D, texture);
-        gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST);
-        gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST);
-        gl.texImage2D(gl.TEXTURE_2D, 0, gl.R32F, width, height, 0, gl.RED, gl.FLOAT, null);
-        gl.bindTexture(gl.TEXTURE_2D, null);
-        return texture;
-    }
-    setData(rotation) {
-        const { gl, rotationTexture, width, height } = this;
-        // gl flip y axis
-        gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, true);
-        gl.bindTexture(gl.TEXTURE_2D, rotationTexture);
-        gl.texImage2D(gl.TEXTURE_2D, 0, gl.R32F, width, height, 0, gl.RED, gl.FLOAT, rotation);
-        gl.bindTexture(gl.TEXTURE_2D, null);
-        gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, false);
-    }
-    activate() {
-        const { gl, rotationTexture } = this;
-        gl.activeTexture(gl.TEXTURE0);
-        gl.bindTexture(gl.TEXTURE_2D, rotationTexture);
-        gl.uniform1i(this.rotationLocation, 0);
-    }
-    free() {
-        const { gl, rotationTexture } = this;
-        gl.deleteTexture(rotationTexture);
-    }
-}
+`;
+
+
+export default class ArrowFieldLogic {
+
+    constructor() {
+        this.gl = null;
+        this.globe = null;
+        this.cameraUniformBlockTotem = null;
+        this.program = null;
+        this.cameraBlockBindingPoint = 0;
+        this.arrayBlockBindingPoint = 1;
+    }
+
+    init(globe, gl) {
+        this.gl = gl;
+        this.globe = globe;
+        this.cameraUniformBlockTotem = globeProgramCache.getProgram(globe, CameraUniformBlockTotem);
+        this.program = this._createProgram();
+    }
+
+    _createProgram() {
+        const gl = this.gl;
+        const program = createProgram(gl, arrowVertexShader, arrowFragmentShader);
+
+        const cameraBlockIndex = gl.getUniformBlockIndex(program, "CameraBlock");
+        gl.uniformBlockBinding(program, cameraBlockIndex, this.cameraBlockBindingPoint);
+
+
+
+        const arrowBlockIndex = gl.getUniformBlockIndex(program, "ArrowBlock");
+        gl.uniformBlockBinding(program, arrowBlockIndex, this.arrayBlockBindingPoint);
+
+        this.textureLocations = {
+            rotationLocation: gl.getUniformLocation(program, "rotation"),
+        }
+
+        return program;
+    }
+
+    getArrowBlockBufferManager() {
+        return new ArrowBlockBufferManager(this.gl, this.arrayBlockBindingPoint);
+    }
+
+    // initial load type is static. 
+    // after that, it is dynamic.
+    getTextureManager(width, height) {
+        return new TextureManager(this.gl, width, height, this.textureLocations);
+    }
+
+    draw(arrowBlockManager, textureManager, instanceCount) {
+        const { gl, cameraBlockBindingPoint, cameraUniformBlockTotem } = this;
+        gl.useProgram(this.program);
+        arrowBlockManager.bind();
+        textureManager.activate();
+        cameraUniformBlockTotem.bind(cameraBlockBindingPoint);
+        gl.drawArraysInstanced(gl.LINES, 0, 6, instanceCount);
+        // gl.drawArraysInstanced(gl.POINTS, 0, 4, instanceCount);
+        cameraUniformBlockTotem.unbind(cameraBlockBindingPoint);
+        arrowBlockManager.unbind();
+    }
+
+    free() {
+        const { gl, program } = this;
+        gl.deleteProgram(program);
+        globeProgramCache.releaseProgram(this.globe, CameraUniformBlockTotem);
+    }
+}
+
+
+class ArrowBlockBufferManager {
+    constructor(gl, bindingPoint) {
+        this.gl = gl;
+        this.bindingPoint = bindingPoint;
+        this.ubo = gl.createBuffer();
+        gl.bindBuffer(gl.UNIFORM_BUFFER, this.ubo);
+        // 4 + 2+ 2 + 2 + 1 +1 +1 +1+1= 15 ~= 16
+        gl.bufferData(gl.UNIFORM_BUFFER, 56, gl.DYNAMIC_DRAW);
+        gl.bindBuffer(gl.UNIFORM_BUFFER, null);
+    }
+
+    update({
+        color = null,
+        bboxOffsetRad = null,
+        bboxSizeRad = null,
+        resolution = null,
+        tailLengthRatio = null,
+        wingLengthRatio = null,
+        height = null,
+        opacity = null,
+        noDataValue = null,
+    } = {}) {
+        const { gl, ubo } = this;
+        gl.bindBuffer(gl.UNIFORM_BUFFER, ubo);
+        if (color !== null) gl.bufferSubData(gl.UNIFORM_BUFFER, 0, new Float32Array(color));
+        if (opacity !== null) gl.bufferSubData(gl.UNIFORM_BUFFER, 12, new Float32Array([opacity]));
+        if (bboxOffsetRad !== null) gl.bufferSubData(gl.UNIFORM_BUFFER, 16, new Float32Array(bboxOffsetRad));
+        if (bboxSizeRad !== null) gl.bufferSubData(gl.UNIFORM_BUFFER, 24, new Float32Array(bboxSizeRad));
+        if (resolution !== null) gl.bufferSubData(gl.UNIFORM_BUFFER, 32, new Float32Array(resolution));
+        if (tailLengthRatio !== null) gl.bufferSubData(gl.UNIFORM_BUFFER, 40, new Float32Array([tailLengthRatio]));
+        if (wingLengthRatio !== null) gl.bufferSubData(gl.UNIFORM_BUFFER, 44, new Float32Array([wingLengthRatio]));
+        if (height !== null) gl.bufferSubData(gl.UNIFORM_BUFFER, 48, new Float32Array([height]));
+        if (noDataValue !== null) gl.bufferSubData(gl.UNIFORM_BUFFER, 52, new Float32Array([noDataValue]));
+        gl.bindBuffer(gl.UNIFORM_BUFFER, null);
+    }
+
+    bind() {
+        const { gl, ubo, bindingPoint } = this;
+        gl.bindBufferBase(gl.UNIFORM_BUFFER, bindingPoint, ubo);
+    }
+
+    unbind() {
+        const { gl, bindingPoint } = this;
+        gl.bindBufferBase(gl.UNIFORM_BUFFER, bindingPoint, null);
+    }
+
+    free() {
+        const { gl, ubo } = this;
+        gl.deleteBuffer(ubo);
+    }
+}
+
+class TextureManager {
+
+    constructor(gl, width, height, { rotationLocation }) {
+        this.gl = gl;
+        this.width = width;
+        this.height = height;
+        this.rotationLocation = rotationLocation;
+        this.rotationTexture = this._createFloatTexture();
+    }
+
+    _createFloatTexture() {
+        const { gl, width, height } = this;
+        const texture = gl.createTexture();
+        gl.bindTexture(gl.TEXTURE_2D, texture);
+        gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST);
+        gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST);
+        gl.texImage2D(gl.TEXTURE_2D, 0, gl.R32F, width, height, 0, gl.RED, gl.FLOAT, null);
+        gl.bindTexture(gl.TEXTURE_2D, null);
+        return texture;
+    }
+
+    setData(rotation) {
+        const { gl, rotationTexture, width, height } = this;
+        // gl flip y axis
+        gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, true);
+        gl.bindTexture(gl.TEXTURE_2D, rotationTexture);
+        gl.texImage2D(gl.TEXTURE_2D, 0, gl.R32F, width, height, 0, gl.RED, gl.FLOAT, rotation);
+        gl.bindTexture(gl.TEXTURE_2D, null);
+        gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, false);
+    }
+
+    activate() {
+        const { gl, rotationTexture } = this;
+
+        gl.activeTexture(gl.TEXTURE0);
+        gl.bindTexture(gl.TEXTURE_2D, rotationTexture);
+        gl.uniform1i(this.rotationLocation, 0);
+    }
+
+    free() {
+        const { gl, rotationTexture } = this;
+        gl.deleteTexture(rotationTexture);
+    }
+}