@openglobus/og 0.16.3 → 0.17.1

package/src/og/entity/Billboard.js

@@ -1,7 +1,3 @@
-/**
- * @module og/entity/Billboard
- */
-
 "use strict";
 
 import { BaseBillboard } from "./BaseBillboard.js";

package/src/og/entity/BillboardHandler.js

@@ -1,7 +1,3 @@
-/**
- * @module og/entity/BillboardHandler
- */
-
 "use strict";
 
 import * as shaders from "../shaders/billboard.js";
@@ -95,7 +91,7 @@ class BillboardHandler {
     }
 
     static concArr(dest, curr) {
-        for (var i = 0; i < curr.length; i++) {
+        for (let i = 0; i < curr.length; i++) {
             dest.push(curr[i]);
         }
     }
@@ -467,7 +463,7 @@ class BillboardHandler {
 
     reindexBillbordsArray(startIndex) {
         var b = this._billboards;
-        for (var i = startIndex; i < b.length; i++) {
+        for (let i = startIndex; i < b.length; i++) {
             b[i]._handlerIndex = i;
         }
     }
@@ -870,7 +866,7 @@ class BillboardHandler {
         var bc = this._entityCollection;
         if (bc && this._renderer) {
             var ta = this._renderer.billboardsTextureAtlas;
-            for (var i = 0; i < this._billboards.length; i++) {
+            for (let i = 0; i < this._billboards.length; i++) {
                 var bi = this._billboards[i];
                 var img = bi._image;
                 if (img) {

package/src/og/entity/Entity.js

@@ -1,7 +1,3 @@
-/**
- * @module og/entity/Entity
- */
-
 "use strict";
 
 import { Extent } from "../Extent.js";
@@ -90,14 +86,14 @@ class Entity {
          * @protected
          * @type {LonLat}
          */
-        this._lonlat = utils.createLonLat(options.lonlat);
+        this._lonLat = utils.createLonLat(options.lonlat);
 
         /**
          * World Mercator entity coordinates.
          * @protected
          * @type {LonLat}
          */
-        this._lonlatMerc = null;
+        this._lonLatMerc = null;
 
         /**
          * Entity visible terrain altitude.
@@ -227,6 +223,10 @@ class Entity {
         this._counter = n;
     }
 
+    get layerIndex() {
+        return this._layerIndex;
+    }
+
     get instanceName() {
         return "Entity";
     }
@@ -343,12 +343,12 @@ class Entity {
         let ec = this._entityCollection;
 
         if (ec && ec.renderNode && ec.renderNode.ellipsoid) {
-            this._lonlat = ec.renderNode.ellipsoid.cartesianToLonLat(p);
+            this._lonLat = ec.renderNode.ellipsoid.cartesianToLonLat(p);
 
-            if (Math.abs(this._lonlat.lat) < mercator.MAX_LAT) {
-                this._lonlatMerc = this._lonlat.forwardMercator();
+            if (Math.abs(this._lonLat.lat) < mercator.MAX_LAT) {
+                this._lonLatMerc = this._lonLat.forwardMercator();
             } else {
-                this._lonlatMerc = null;
+                this._lonLatMerc = null;
             }
         }
 
@@ -384,12 +384,12 @@ class Entity {
         let ec = this._entityCollection;
 
         if (!skipLonLat && ec && ec.renderNode && ec.renderNode.ellipsoid) {
-            this._lonlat = ec.renderNode.ellipsoid.cartesianToLonLat(p);
+            this._lonLat = ec.renderNode.ellipsoid.cartesianToLonLat(p);
 
-            if (Math.abs(this._lonlat.lat) < mercator.MAX_LAT) {
-                this._lonlatMerc = this._lonlat.forwardMercator();
+            if (Math.abs(this._lonLat.lat) < mercator.MAX_LAT) {
+                this._lonLatMerc = this._lonLat.forwardMercator();
             } else {
-                this._lonlatMerc = null;
+                this._lonLatMerc = null;
             }
         }
     }
@@ -400,7 +400,7 @@ class Entity {
      * @returns {LonLat} -
      */
     getLonLat() {
-        return this._lonlat.clone();
+        return this._lonLat.clone();
     }
 
     /**
@@ -409,7 +409,7 @@ class Entity {
      * @param {LonLat} lonlat - WGS84 coordinates.
      */
     setLonLat(lonlat) {
-        let l = this._lonlat;
+        let l = this._lonLat;
 
         l.lon = lonlat.lon;
         l.lat = lonlat.lat;
@@ -418,9 +418,9 @@ class Entity {
         let ec = this._entityCollection;
         if (ec && ec.renderNode && ec.renderNode.ellipsoid) {
             if (Math.abs(l.lat) < mercator.MAX_LAT) {
-                this._lonlatMerc = l.forwardMercator();
+                this._lonLatMerc = l.forwardMercator();
             } else {
-                this._lonlatMerc = null;
+                this._lonLatMerc = null;
             }
 
             ec.renderNode.ellipsoid.lonLatToCartesianRes(l, this._cartesian);
@@ -436,7 +436,7 @@ class Entity {
      * @param {number} [height] - Height
      */
     setLonLat2(lon, lat, height) {
-        let l = this._lonlat;
+        let l = this._lonLat;
 
         l.lon = lon;
         l.lat = lat;
@@ -445,9 +445,9 @@ class Entity {
         let ec = this._entityCollection;
         if (ec && ec.renderNode && ec.renderNode.ellipsoid) {
             if (Math.abs(l.lat) < mercator.MAX_LAT) {
-                this._lonlatMerc = l.forwardMercator();
+                this._lonLatMerc = l.forwardMercator();
             } else {
-                this._lonlatMerc = null;
+                this._lonLatMerc = null;
             }
 
             ec.renderNode.ellipsoid.lonLatToCartesianRes(l, this._cartesian);
@@ -683,7 +683,7 @@ class Entity {
      */
     getExtent() {
         let res;
-        let c = this._lonlat;
+        let c = this._lonLat;
         if (this.billboard || this.label) {
             res = new Extent(new LonLat(c.lon, c.lat), new LonLat(c.lon, c.lat));
         } else {

package/src/og/entity/EntityCollection.js

@@ -1,7 +1,3 @@
-/**
- * @module og/entity/EntityCollection
- */
-
 "use strict";
 
 import { Events } from "../Events.js";
@@ -213,10 +209,6 @@ class EntityCollection {
         this._counter = n;
     }
 
-    // setPolygonOffset(factor, units) {
-    //     this.polygonOffsetUnits = units;
-    // }
-
     /**
      * Sets collection visibility.
      * @public
@@ -311,7 +303,7 @@ class EntityCollection {
 
         this.events.dispatch(this.events.entityadd, entity);
 
-        for (var i = 0; i < entity.childrenNodes.length; i++) {
+        for (let i = 0; i < entity.childrenNodes.length; i++) {
             entity.childrenNodes[i]._entityCollection = this;
             entity.childrenNodes[i]._entityCollectionIndex = entity._entityCollectionIndex;
             entity.childrenNodes[i]._pickingColor = entity._pickingColor;
@@ -334,7 +326,7 @@ class EntityCollection {
             if (rn) {
                 rn.renderer && rn.renderer.assignPickingColor(entity);
                 if (rn.ellipsoid && entity._cartesian.isZero()) {
-                    entity.setCartesian3v(rn.ellipsoid.lonLatToCartesian(entity._lonlat));
+                    entity.setCartesian3v(rn.ellipsoid.lonLatToCartesian(entity._lonLat));
                 }
             }
             this._addRecursively(entity);
@@ -394,7 +386,7 @@ class EntityCollection {
         // geoObject
         entity.geoObject && this.geoObjectHandler.remove(entity.geoObject);
 
-        for (var i = 0; i < entity.childrenNodes.length; i++) {
+        for (let i = 0; i < entity.childrenNodes.length; i++) {
             this._removeRecursively(entity.childrenNodes[i]);
         }
     }
@@ -442,7 +434,7 @@ class EntityCollection {
      */
     createPickingColors() {
         var e = this._entities;
-        for (var i = 0; i < e.length; i++) {
+        for (let i = 0; i < e.length; i++) {
             if (!e[i].parent) {
                 this.renderNode.renderer.assignPickingColor(e[i]);
                 e[i].setPickingColor();
@@ -457,7 +449,7 @@ class EntityCollection {
      */
     reindexEntitiesArray(startIndex) {
         var e = this._entities;
-        for (var i = startIndex; i < e.length; i++) {
+        for (let i = startIndex; i < e.length; i++) {
             e[i]._entityCollectionIndex = i;
         }
     }
@@ -472,10 +464,12 @@ class EntityCollection {
     addTo(renderNode, isHidden) {
         if (!this.renderNode) {
             this.renderNode = renderNode;
+
             if (!isHidden) {
                 this._renderNodeIndex = renderNode.entityCollections.length;
                 renderNode.entityCollections.push(this);
             }
+
             renderNode.ellipsoid && this._updateGeodeticCoordinates(renderNode.ellipsoid);
 
             this.bindRenderNode(renderNode);
@@ -490,10 +484,12 @@ class EntityCollection {
      * @param {RenderNode} renderNode
      */
     bindRenderNode(renderNode) {
-        if (renderNode.renderer) {
+        if (renderNode.renderer && renderNode.renderer.isInitialized()) {
+
             this.billboardHandler.setRenderer(renderNode.renderer);
             this.labelHandler.setRenderer(renderNode.renderer);
             this.rayHandler.setRenderer(renderNode.renderer);
+
             this.geoObjectHandler.setRenderNode(renderNode);
             this.polylineHandler.setRenderNode(renderNode);
             this.pointCloudHandler.setRenderNode(renderNode);
@@ -515,7 +511,7 @@ class EntityCollection {
         var i = e.length;
         while (i--) {
             var ei = e[i];
-            ei._lonlat && ei.setCartesian3v(ellipsoid.lonLatToCartesian(ei._lonlat));
+            ei._lonLat && ei.setCartesian3v(ellipsoid.lonLatToCartesian(ei._lonLat));
         }
     }
 
@@ -525,7 +521,7 @@ class EntityCollection {
      */
     updateBillboardsTextureAtlas() {
         var b = this.billboardHandler._billboards;
-        for (var i = 0; i < b.length; i++) {
+        for (let i = 0; i < b.length; i++) {
             b[i].setSrc(b[i]._src);
         }
     }
@@ -538,7 +534,7 @@ class EntityCollection {
         if (this.renderNode) {
             var l = [].concat(this.labelHandler._billboards);
             this.labelHandler._billboards = [];
-            for (var i = 0; i < l.length; i++) {
+            for (let i = 0; i < l.length; i++) {
                 this.labelHandler.assignFontAtlas(l[i]);
             }
         }
@@ -625,7 +621,7 @@ class EntityCollection {
     _clearEntity(entity) {
         entity._entityCollection = null;
         entity._entityCollectionIndex = -1;
-        for (var i = 0; i < entity.childrenNodes.length; i++) {
+        for (let i = 0; i < entity.childrenNodes.length; i++) {
             this._clearEntity(entity.childrenNodes[i]);
         }
     }

package/src/og/entity/GeoObject.js

@@ -1,7 +1,3 @@
-/**
- * @module og/entity/GeoObject
- */
-
 "use strict";
 
 import { Quat, Vec3 } from "../math/index.js";
@@ -236,10 +232,12 @@ class GeoObject {
     }
 
     updateDirection() {
-        this._qNorthFrame = Planet.getBearingNorthRotationQuat(this._position);
-        let qq = Quat.yRotation(this._yaw).mul(this._qNorthFrame).conjugate();
-        this._direction = qq.mulVec3(new Vec3(0.0, 0.0, -1.0)).normalize();
-        this._handler && this._handler.setDirectionArr(this._tagData, this._tagDataIndex, this._direction);
+        if (this._handler && this._handler._planet) {
+            this._qNorthFrame = this._handler._planet.getNorthFrameRotation(this._position);
+            let qq = Quat.yRotation(this._yaw).mul(this._qNorthFrame).conjugate();
+            this._direction = qq.mulVec3(new Vec3(0.0, 0.0, -1.0)).normalize();
+            this._handler.setDirectionArr(this._tagData, this._tagDataIndex, this._direction);
+        }
     }
 }
 

package/src/og/entity/GeoObjectHandler.js

@@ -1,9 +1,5 @@
 "use strict";
 
-/**
- * @module og/entity/GeoObjectHandler
- */
-
 import * as shaders from "../shaders/geoObject.js";
 import { concatArrays, loadImage, makeArrayTyped, spliceArray } from "../utils/shared.js";
 
@@ -116,24 +112,33 @@ class InstanceData {
         this._visibleArr = [];
         this._texCoordArr = [];
 
-        let h = this._geoObjectHandler._planet.renderer.handler, gl = h.gl;
-
-        h.deleteTexture(this._texture);
+        this._deleteBuffers();
 
-        this._texture = null;
+        this.isFree = false;
+        this._geoObjectHandler = null;
+    }
 
-        gl.deleteBuffer(this._pitchRollBuffer);
-        gl.deleteBuffer(this._sizeBuffer);
-        gl.deleteBuffer(this._vertexBuffer);
-        gl.deleteBuffer(this._positionHighBuffer);
-        gl.deleteBuffer(this._positionLowBuffer);
-        gl.deleteBuffer(this._directionBuffer);
-        gl.deleteBuffer(this._rgbaBuffer);
-        gl.deleteBuffer(this._normalsBuffer);
-        gl.deleteBuffer(this._indicesBuffer);
-        gl.deleteBuffer(this._pickingColorBuffer);
-        gl.deleteBuffer(this._visibleBuffer);
-        gl.deleteBuffer(this._texCoordBuffer);
+    _deleteBuffers() {
+        if (this._geoObjectHandler && this._geoObjectHandler._planet && this._geoObjectHandler._planet.renderer) {
+            let h = this._geoObjectHandler._planet.renderer.handler,
+                gl = h.gl;
+
+            h.deleteTexture(this._texture);
+            this._texture = null;
+
+            gl.deleteBuffer(this._pitchRollBuffer);
+            gl.deleteBuffer(this._sizeBuffer);
+            gl.deleteBuffer(this._vertexBuffer);
+            gl.deleteBuffer(this._positionHighBuffer);
+            gl.deleteBuffer(this._positionLowBuffer);
+            gl.deleteBuffer(this._directionBuffer);
+            gl.deleteBuffer(this._rgbaBuffer);
+            gl.deleteBuffer(this._normalsBuffer);
+            gl.deleteBuffer(this._indicesBuffer);
+            gl.deleteBuffer(this._pickingColorBuffer);
+            gl.deleteBuffer(this._visibleBuffer);
+            gl.deleteBuffer(this._texCoordBuffer);
+        }
 
         this._pitchRollBuffer = null;
         this._sizeBuffer = null;
@@ -147,9 +152,6 @@ class InstanceData {
         this._pickingColorBuffer = null;
         this._visibleBuffer = null;
         this._texCoordBuffer = null;
-
-        this.isFree = false;
-        this._geoObjectHandler = null;
     }
 
     createVertexBuffer() {
@@ -349,6 +351,10 @@ class GeoObjectHandler {
             this._loadDataTagTexture(this._instanceDataMapValues[i]);
         }
 
+        for (let i = 0; i < this._geoObjects.length; i++) {
+            this._geoObjects[i].updateDirection();
+        }
+
         this.update();
     }
 
@@ -639,7 +645,7 @@ class GeoObjectHandler {
         this._geoObjects.length = 0;
         this._geoObjects = [];
 
-        for (let i = 0; this._instanceDataMapValues.length; i++) {
+        for (let i = 0; i < this._instanceDataMapValues.length; i++) {
             this._instanceDataMapValues[i].clear();
         }
 

package/src/og/entity/Geometry.js

@@ -1,7 +1,3 @@
-/**
- * @module og/entity/Geometry
- */
-
 "use strict";
 
 import { Extent } from "../Extent.js";
@@ -192,6 +188,11 @@ class Geometry {
         return res;
     }
 
+    /**
+     * @todo ASAP need test for this method
+     * @param geoJson
+     * @returns {Geometry}
+     */
     setGeometry(geoJson) {
         var h = this._handler;
         this.remove();

package/src/og/entity/GeometryHandler.js

@@ -1,7 +1,3 @@
-/**
- * @module og/entity/GeometryHandler
- */
-
 "use strict";
 
 import { doubleToTwoFloatsV2 } from "../math/coder.js";
@@ -167,7 +163,7 @@ class GeometryHandler {
             sc = [strokeColor.x, strokeColor.y, strokeColor.z, strokeColor.w],
             p = [pickingColor.x, pickingColor.y, pickingColor.z, 1.0];
 
-        for (var j = 0; j < pathArr.length; j++) {
+        for (let j = 0; j < pathArr.length; j++) {
             var path = pathArr[j];
 
             if (path.length === 0) {
@@ -292,7 +288,7 @@ class GeometryHandler {
                 p[3]
             );
 
-            for (var i = 0; i < path.length; i++) {
+            for (let i = 0; i < path.length; i++) {
                 var cur = path[i];
 
                 doubleToTwoFloats(cur, tempHigh, tempLow);
@@ -527,6 +523,9 @@ class GeometryHandler {
     assignHandler(handler) {
         this._handler = handler;
         this.refresh();
+        if (handler.isInitialized()) {
+            this.update();
+        }
     }
 
     /**
@@ -555,7 +554,7 @@ class GeometryHandler {
                     let ci = [];
                     for (let j = 0; j < coordinates.length; j++) {
                         ci[j] = [];
-                        for (var k = 0; k < coordinates[j].length; k++) {
+                        for (let k = 0; k < coordinates[j].length; k++) {
                             ci[j][k] = [
                                 mercator.forward_lon(coordinates[j][k][0]),
                                 mercator.forward_lat(coordinates[j][k][1])
@@ -654,7 +653,7 @@ class GeometryHandler {
                     geometry._lineColorsHandlerIndex = this._lineColors.length;
                     geometry._lineThicknessHandlerIndex = this._lineThickness.length;
 
-                    for (var i = 0; i < coordinates.length; i++) {
+                    for (let i = 0; i < coordinates.length; i++) {
                         let cci = coordinates[i];
                         let ci = [];
                         for (let j = 0; j < cci.length; j++) {
@@ -884,7 +883,7 @@ class GeometryHandler {
                 geometry._polyIndexesLength
             );
             var di = geometry._polyVerticesLength * 0.5;
-            for (var i = geometry._polyIndexesHandlerIndex; i < this._polyIndexes.length; i++) {
+            for (let i = geometry._polyIndexesHandlerIndex; i < this._polyIndexes.length; i++) {
                 this._polyIndexes[i] -= di;
             }
 
@@ -976,7 +975,7 @@ class GeometryHandler {
     _refreshRecursevely(geometry, treeNode) {
         if (treeNode.ready) {
             var lid = this._layer._id;
-            for (var i = 0; i < treeNode.nodes.length; i++) {
+            for (let i = 0; i < treeNode.nodes.length; i++) {
                 var ni = treeNode.nodes[i];
                 if (geometry._extent.overlaps(ni.segment.getExtentLonLat())) {
                     this._refreshRecursevely(geometry, ni);
@@ -1000,7 +999,7 @@ class GeometryHandler {
     _refreshRecursevelyExt(extent, treeNode) {
         if (treeNode.ready) {
             var lid = this._layer._id;
-            for (var i = 0; i < treeNode.nodes.length; i++) {
+            for (let i = 0; i < treeNode.nodes.length; i++) {
                 var ni = treeNode.nodes[i];
                 if (extent.overlaps(ni.segment.getExtentLonLat())) {
                     this._refreshRecursevelyExt(extent, ni);
@@ -1077,7 +1076,7 @@ class GeometryHandler {
 
         var l = geometry._polyVerticesLength;
         var ind = geometry._polyVerticesHandlerIndex;
-        for (var i = 0; i < l; i++) {
+        for (let i = 0; i < l; i++) {
             a[ind + i] = geometry._polyVerticesHighMerc[i] * v;
             b[ind + i] = geometry._polyVerticesLowMerc[i] * v;
         }
@@ -1086,7 +1085,7 @@ class GeometryHandler {
         b = this._lineVerticesLowMerc;
         l = geometry._lineVerticesLength;
         ind = geometry._lineVerticesHandlerIndex;
-        for (i = 0; i < l; i++) {
+        for (let i = 0; i < l; i++) {
             a[ind + i] = geometry._lineVerticesHighMerc[i] * v;
             b[ind + i] = geometry._lineVerticesLowMerc[i] * v;
         }
@@ -1102,7 +1101,7 @@ class GeometryHandler {
         var index = geometry._polyVerticesHandlerIndex * 2, // ... / 2 * 4
             size = index + geometry._polyVerticesLength * 2; // ... / 2 * 4
         var a = this._polyColors;
-        for (var i = index; i < size; i += 4) {
+        for (let i = index; i < size; i += 4) {
             a[i] = color.x;
             a[i + 1] = color.y;
             a[i + 2] = color.z;
@@ -1117,7 +1116,7 @@ class GeometryHandler {
         var index = geometry._lineColorsHandlerIndex,
             size = index + geometry._lineColorsLength;
         var a = this._lineStrokeColors;
-        for (var i = index; i < size; i += 4) {
+        for (let i = index; i < size; i += 4) {
             a[i] = color.x;
             a[i + 1] = color.y;
             a[i + 2] = color.z;
@@ -1132,7 +1131,7 @@ class GeometryHandler {
         var index = geometry._lineColorsHandlerIndex,
             size = index + geometry._lineColorsLength;
         var a = this._lineColors;
-        for (var i = index; i < size; i += 4) {
+        for (let i = index; i < size; i += 4) {
             a[i] = color.x;
             a[i + 1] = color.y;
             a[i + 2] = color.z;
@@ -1147,7 +1146,7 @@ class GeometryHandler {
         var index = geometry._lineStrokesHandlerIndex,
             size = index + geometry._lineStrokesLength;
         var a = this._lineStrokes;
-        for (var i = index; i < size; i++) {
+        for (let i = index; i < size; i++) {
             a[i] = width;
         }
         this._changedBuffers[LINESTROKES_BUFFER] = true;
@@ -1159,7 +1158,7 @@ class GeometryHandler {
         var index = geometry._lineThicknessHandlerIndex,
             size = index + geometry._lineThicknessLength;
         var a = this._lineThickness;
-        for (var i = index; i < size; i++) {
+        for (let i = index; i < size; i++) {
             a[i] = width;
         }
         this._changedBuffers[LINETHICKNESS_BUFFER] = true;
@@ -1180,7 +1179,7 @@ class GeometryHandler {
         this._geometries.splice(geometry._handlerIndex, 1);
 
         var g = this._geometries;
-        for (var i = geometry._handlerIndex; i < g.length; i++) {
+        for (let i = geometry._handlerIndex; i < g.length; i++) {
             var gi = g[i];
             gi._handlerIndex = i;
             gi._polyIndexesHandlerIndex -= geometry._polyIndexesLength;

package/src/og/entity/Label.js

@@ -1,7 +1,3 @@
-/**
- * @module og/entity/Label
- */
-
 "use strict";
 
 import { Vec4 } from "../math/Vec4.js";

package/src/og/entity/LabelHandler.js

@@ -1,7 +1,3 @@
-/**
- * @module og/entity/LabelHandler
- */
-
 "use strict";
 
 import * as shaders from "../shaders/label.js";
@@ -514,7 +510,7 @@ class LabelHandler extends BillboardHandler {
             yl = positionLow.y,
             zl = positionLow.z;
 
-        for (var q = 0; q < this._maxLetters; q++) {
+        for (let q = 0; q < this._maxLetters; q++) {
             var j = i + q * 18;
             a[j] = x;
             a[j + 1] = y;
@@ -576,7 +572,7 @@ class LabelHandler extends BillboardHandler {
             y = color.y / 255,
             z = color.z / 255;
 
-        for (var q = 0; q < this._maxLetters; q++) {
+        for (let q = 0; q < this._maxLetters; q++) {
             var j = i + q * 18;
             a[j] = x;
             a[j + 1] = y;
@@ -610,7 +606,7 @@ class LabelHandler extends BillboardHandler {
         var i = index * 6 * this._maxLetters;
         var a = this._sizeArr;
 
-        for (var q = 0; q < this._maxLetters; q++) {
+        for (let q = 0; q < this._maxLetters; q++) {
             var j = i + q * 6;
             a[j] = size;
             a[j + 1] = size;
@@ -630,7 +626,7 @@ class LabelHandler extends BillboardHandler {
             y = offset.y,
             z = offset.z;
 
-        for (var q = 0; q < this._maxLetters; q++) {
+        for (let q = 0; q < this._maxLetters; q++) {
             var j = i + q * 18;
             a[j] = x;
             a[j + 1] = y;
@@ -668,7 +664,7 @@ class LabelHandler extends BillboardHandler {
             z = rgba.z,
             w = rgba.w;
 
-        for (var q = 0; q < this._maxLetters; q++) {
+        for (let q = 0; q < this._maxLetters; q++) {
             var j = i + q * 24;
 
             a[j] = x;
@@ -713,7 +709,7 @@ class LabelHandler extends BillboardHandler {
             z = rgba.z,
             w = rgba.w;
 
-        for (var q = 0; q < this._maxLetters; q++) {
+        for (let q = 0; q < this._maxLetters; q++) {
             var j = i + q * 24;
 
             a[j] = x;
@@ -754,7 +750,7 @@ class LabelHandler extends BillboardHandler {
         var i = index * 6 * this._maxLetters;
         var a = this._outlineArr;
 
-        for (var q = 0; q < this._maxLetters; q++) {
+        for (let q = 0; q < this._maxLetters; q++) {
             var j = i + q * 6;
             a[j] = outline;
             a[j + 1] = outline;
@@ -771,7 +767,7 @@ class LabelHandler extends BillboardHandler {
         var i = index * 6 * this._maxLetters;
         var a = this._rotationArr;
 
-        for (var q = 0; q < this._maxLetters; q++) {
+        for (let q = 0; q < this._maxLetters; q++) {
             var j = i + q * 6;
             a[j] = rotation;
             a[j + 1] = rotation;
@@ -798,7 +794,7 @@ class LabelHandler extends BillboardHandler {
         var i = index * 12 * this._maxLetters;
         var a = this._vertexArr;
 
-        for (var q = 0; q < this._maxLetters; q++) {
+        for (let q = 0; q < this._maxLetters; q++) {
             var j = i + q * 12;
 
             a[j] = vertexArr[0];
@@ -827,7 +823,7 @@ class LabelHandler extends BillboardHandler {
         var i = index * 6 * this._maxLetters;
         var a = this._fontIndexArr;
 
-        for (var q = 0; q < this._maxLetters; q++) {
+        for (let q = 0; q < this._maxLetters; q++) {
             var j = i + q * 6;
             a[j] = fontIndex;
             a[j + 1] = fontIndex;