@openglobus/og 0.11.2 → 0.11.7

package/src/og/shapes/BaseShape.js

@@ -2,27 +2,25 @@
  * @module og/shape/BaseShape
  */
 
-'use strict';
+"use strict";
 
-import { Vec3 } from '../math/Vec3.js';
-import { Quat } from '../math/Quat.js';
-import { Mat4 } from '../math/Mat4.js';
+import { Vec3 } from "../math/Vec3.js";
+import { Quat } from "../math/Quat.js";
+import { Mat4 } from "../math/Mat4.js";
 
 /**
  * Base geometry shape class.
  * @class
  * @param {Object} options - Shape parameters:
- * @param {og.Vec3} [options.position] - Shape position.
- * @param {og.Quat} [options.orientation] - Shape orientation(rotation).
- * @param {og.Vec3} [options.scale] - Scale vector.
+ * @param {Vec3} [options.position] - Shape position.
+ * @param {Quat} [options.orientation] - Shape orientation(rotation).
+ * @param {Vec3} [options.scale] - Scale vector.
  * @param {Array.<number>} [options.color] - Shape RGBA color. (exactly 4 entries)
  * @param {string} [options.src] - Texture image url source.
  * @param {boolean} [options.visibility] - Shape visibility.
  */
 class BaseShape {
-
     constructor(options) {
-
         options = options || {};
 
         /**
@@ -36,21 +34,21 @@ class BaseShape {
         /**
          * Shape position.
          * @public
-         * @type {og.Vec3}
+         * @type {Vec3}
          */
         this.position = options.position || new Vec3();
 
         /**
          * Shape orientation(rotation)
          * @public
-         * @type {og.Quat}
+         * @type {Quat}
          */
         this.orientation = options.orientation || new Quat(0.0, 0.0, 0.0, 1.0);
 
         /**
          * Scale.
          * @public
-         * @type {og.Vec3}
+         * @type {Vec3}
          */
         this.scale = options.scale || new Vec3(1.0, 1.0, 1.0);
 
@@ -59,14 +57,16 @@ class BaseShape {
          * @public
          * @type {Array.<number>} - (exactly 4 entries)
          */
-        this.color = options.color ? new Float32Array(options.color) : new Float32Array([1.0, 1.0, 1.0, 1.0]);
+        this.color = options.color
+            ? new Float32Array(options.color)
+            : new Float32Array([1.0, 1.0, 1.0, 1.0]);
 
         /**
          * Shape visibility.
          * @public
          * @type {boolean}
          */
-        this.visibility = (options.visibility != undefined ? options.visibility : true);
+        this.visibility = options.visibility != undefined ? options.visibility : true;
 
         /**
          * Image url source.
@@ -130,21 +130,21 @@ class BaseShape {
         /**
          * Scale matrix.
          * @protected
-         * @type {og.Mat4}
+         * @type {Mat4}
          */
         this._mxScale = new Mat4().setIdentity().scale(this.scale);
 
         /**
          * Translation matrix.
          * @protected
-         * @type {og.Mat4}
+         * @type {Mat4}
          */
         this._mxTranslation = new Mat4().setIdentity();
 
         /**
          * Model matrix.
          * @protected
-         * @type {og.Mat4}
+         * @type {Mat4}
          */
         this._mxModel = new Mat4().setIdentity();
 
@@ -157,7 +157,7 @@ class BaseShape {
         /**
          * Assigned render node.
          * @protected
-         * @type {og.scene.RenderNode}
+         * @type {RenderNode}
          */
         this._renderNode = null;
 
@@ -171,14 +171,14 @@ class BaseShape {
         /**
          * Entity instance that holds this shape.
          * @protected
-         * @type {og.Entity}
+         * @type {Entity}
          */
         this._entity = null;
 
         /**
          * Handler that stores and renders this shape object.
          * @protected
-         * @type {og.ShapeHandler}
+         * @type {ShapeHandler}
          */
         this._handler = null;
 
@@ -206,7 +206,6 @@ class BaseShape {
      * @public
      */
     clear() {
-
         this.position.set(0.0, 0.0, 0.0);
         this.orientation.set(0.0, 0.0, 0.0, 1.0);
         this.scale.set(1.0, 1.0, 1.0);
@@ -240,7 +239,7 @@ class BaseShape {
     /**
      * Sets shape color.
      * @public
-     * @param {og.Vec4} color - RGBA color vector.
+     * @param {Vec4} color - RGBA color vector.
      */
     setColor4v(color) {
         this.color[0] = color.x;
@@ -296,7 +295,7 @@ class BaseShape {
     /**
      * Assign render node.
      * @public
-     * @param {og.scene.RenderNode} renderNode - Render node to assign.
+     * @param {RenderNode} renderNode - Render node to assign.
      */
     setRenderNode(renderNode) {
         this._renderNode = renderNode;
@@ -305,7 +304,7 @@ class BaseShape {
             var img = new Image();
             var that = this;
             img.onload = function () {
-                that.texture = renderNode.renderer.handler.createTexture(this);
+                that.texture = renderNode.renderer.handler.createTextureDefault(this);
             };
             img.src = this._src;
         }
@@ -314,7 +313,7 @@ class BaseShape {
     /**
      * Sets shape position.
      * @public
-     * @param {og.Vec3} position - Shape position.
+     * @param {Vec3} position - Shape position.
      */
     setPosition3v(position) {
         this.position.copy(position);
@@ -325,7 +324,7 @@ class BaseShape {
     /**
      * Translate shape position to vector.
      * @public
-     * @param {og.Vec3} vec - Translation vector.
+     * @param {Vec3} vec - Translation vector.
      */
     translate3v(vec) {
         this.position.addA(vec);
@@ -334,7 +333,7 @@ class BaseShape {
 
     /**
      * Sets shape scale.
-     * @param {og.Vec3} scale - Scale vector.
+     * @param {Vec3} scale - Scale vector.
      */
     setScale3v(scale) {
         this.scale.copy(scale);
@@ -358,7 +357,7 @@ class BaseShape {
     /**
      * Assign picking color.
      * @protected
-     * @param {og.Vec3} color - Picking RGB color.
+     * @param {Vec3} color - Picking RGB color.
      */
     setPickingColor3v(color) {
         //...
@@ -377,10 +376,26 @@ class BaseShape {
     _createBuffers() {
         this._deleteBuffers();
         var r = this._renderNode.renderer;
-        this._positionBuffer = r.handler.createArrayBuffer(new Float32Array(this._positionData), 3, this._positionData.length / 3);
-        this._normalBuffer = r.handler.createArrayBuffer(new Float32Array(this._normalData), 3, this._normalData.length / 3);
-        this._indexBuffer = r.handler.createElementArrayBuffer(new Uint16Array(this._indexData), 1, this._indexData.length);
-        this._textureCoordBuffer = r.handler.createArrayBuffer(new Float32Array(this._textureCoordData), 2, this._textureCoordData.length / 2);
+        this._positionBuffer = r.handler.createArrayBuffer(
+            new Float32Array(this._positionData),
+            3,
+            this._positionData.length / 3
+        );
+        this._normalBuffer = r.handler.createArrayBuffer(
+            new Float32Array(this._normalData),
+            3,
+            this._normalData.length / 3
+        );
+        this._indexBuffer = r.handler.createElementArrayBuffer(
+            new Uint16Array(this._indexData),
+            1,
+            this._indexData.length
+        );
+        this._textureCoordBuffer = r.handler.createArrayBuffer(
+            new Float32Array(this._textureCoordData),
+            2,
+            this._textureCoordData.length / 2
+        );
     }
 
     /**
@@ -400,9 +415,11 @@ class BaseShape {
             let rn = this._renderNode;
             let r = rn.renderer;
 
-            let sh, p,
+            let sh,
+                p,
                 gl = r.handler.gl,
-                sha, shu;
+                sha,
+                shu;
 
             if (rn.lightEnabled) {
                 sh = r.handler.programs.shape_wl;
@@ -415,12 +432,23 @@ class BaseShape {
                 gl.uniform4fv(shu.lightsPositions, rn._lightsTransformedPositions);
                 gl.uniform3fv(shu.lightsParamsv, rn._lightsParamsv);
                 gl.uniform1fv(shu.lightsParamsf, rn._lightsParamsf);
-                gl.uniformMatrix4fv(shu.projectionMatrix, false, r.activeCamera.getProjectionMatrix());
+                gl.uniformMatrix4fv(
+                    shu.projectionMatrix,
+                    false,
+                    r.activeCamera.getProjectionMatrix()
+                );
                 gl.uniformMatrix4fv(shu.viewMatrix, false, r.activeCamera.getViewMatrix());
                 gl.uniformMatrix3fv(shu.normalMatrix, false, r.activeCamera.getNormalMatrix());
 
                 gl.bindBuffer(gl.ARRAY_BUFFER, this._normalBuffer);
-                gl.vertexAttribPointer(sha.aVertexNormal, this._normalBuffer.itemSize, gl.FLOAT, false, 0, 0);
+                gl.vertexAttribPointer(
+                    sha.aVertexNormal,
+                    this._normalBuffer.itemSize,
+                    gl.FLOAT,
+                    false,
+                    0,
+                    0
+                );
             } else {
                 sh = r.handler.programs.shape_nl;
                 p = sh._program;
@@ -429,13 +457,24 @@ class BaseShape {
 
                 sh.activate();
 
-                gl.uniformMatrix4fv(shu.projectionViewMatrix, false, r.activeCamera.getProjectionViewMatrix());
+                gl.uniformMatrix4fv(
+                    shu.projectionViewMatrix,
+                    false,
+                    r.activeCamera.getProjectionViewMatrix()
+                );
             }
 
             gl.uniform4fv(shu.uColor, this.color);
 
             gl.bindBuffer(gl.ARRAY_BUFFER, this._positionBuffer);
-            gl.vertexAttribPointer(sha.aVertexPosition, this._positionBuffer.itemSize, gl.FLOAT, false, 0, 0);
+            gl.vertexAttribPointer(
+                sha.aVertexPosition,
+                this._positionBuffer.itemSize,
+                gl.FLOAT,
+                false,
+                0,
+                0
+            );
             gl.uniformMatrix4fv(shu.modelMatrix, false, this._mxModel._m);
 
             gl.activeTexture(gl.TEXTURE0);
@@ -443,41 +482,74 @@ class BaseShape {
             gl.uniform1i(shu.uSampler, 0);
 
             gl.bindBuffer(gl.ARRAY_BUFFER, this._textureCoordBuffer);
-            gl.vertexAttribPointer(sha.aTextureCoord, this._textureCoordBuffer.itemSize, gl.FLOAT, false, 0, 0);
+            gl.vertexAttribPointer(
+                sha.aTextureCoord,
+                this._textureCoordBuffer.itemSize,
+                gl.FLOAT,
+                false,
+                0,
+                0
+            );
 
             gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this._indexBuffer);
-            gl.drawElements(r.handler.gl.TRIANGLES, this._indexBuffer.numItems, gl.UNSIGNED_SHORT, 0);
+            gl.drawElements(
+                r.handler.gl.TRIANGLES,
+                this._indexBuffer.numItems,
+                gl.UNSIGNED_SHORT,
+                0
+            );
         }
     }
 
-drawPicking() {
+    drawPicking() {
         if (this.visibility) {
             let rn = this._renderNode;
             let r = rn.renderer;
 
-            let sh, p,
+            let sh,
+                p,
                 gl = r.handler.gl,
-                sha, shu;
+                sha,
+                shu;
 
+            sh = r.handler.programs.shape_picking;
+            p = sh._program;
+            shu = p.uniforms;
+            sha = p.attributes;
 
+            sh.activate();
 
-                sh = r.handler.programs.shape_picking;
-                p = sh._program;
-                shu = p.uniforms;
-                sha = p.attributes;
-
-                sh.activate();
-
-            gl.uniformMatrix4fv(shu.projectionViewMatrix, false, r.activeCamera.getProjectionViewMatrix());
+            gl.uniformMatrix4fv(
+                shu.projectionViewMatrix,
+                false,
+                r.activeCamera.getProjectionViewMatrix()
+            );
 
-            gl.uniform4fv(shu.uColor, [this._pickingColor[0], this._pickingColor[1], this._pickingColor[2], 1.0]);
+            gl.uniform4fv(shu.uColor, [
+                this._pickingColor[0],
+                this._pickingColor[1],
+                this._pickingColor[2],
+                1.0
+            ]);
 
             gl.bindBuffer(gl.ARRAY_BUFFER, this._positionBuffer);
-            gl.vertexAttribPointer(sha.aVertexPosition, this._positionBuffer.itemSize, gl.FLOAT, false, 0, 0);
+            gl.vertexAttribPointer(
+                sha.aVertexPosition,
+                this._positionBuffer.itemSize,
+                gl.FLOAT,
+                false,
+                0,
+                0
+            );
             gl.uniformMatrix4fv(shu.modelMatrix, false, this._mxModel._m);
 
             gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this._indexBuffer);
-            gl.drawElements(r.handler.gl.TRIANGLES, this._indexBuffer.numItems, gl.UNSIGNED_SHORT, 0);
+            gl.drawElements(
+                r.handler.gl.TRIANGLES,
+                this._indexBuffer.numItems,
+                gl.UNSIGNED_SHORT,
+                0
+            );
         }
     }
 }

package/src/og/shapes/Icosphere.js

@@ -2,17 +2,17 @@
  * @module og/shape/BaseShape
  */
 
-'use strict';
+"use strict";
 
-import { BaseShape } from './BaseShape.js';
+import { BaseShape } from "./BaseShape.js";
 
 /**
  * @class
- * @extends {og.shape.BaseShape}
+ * @extends {BaseShape}
  * @param {Object} options - Icosphere parameters:
- * @param {og.Vec3} [options.position] - Icosphere position.
- * @param {og.Quat} [options.orientation] - Icosphere orientation(rotation).
- * @param {og.Vec3} [options.scale] - Scale vector.
+ * @param {Vec3} [options.position] - Icosphere position.
+ * @param {Quat} [options.orientation] - Icosphere orientation(rotation).
+ * @param {Vec3} [options.scale] - Scale vector.
  * @param {Array.<number>} [options.color] - Icosphere RGBA color. (exactly 4 entries)
  * @param {string} [options.src] - Texture image url source.
  * @param {boolean} [options.visibility] - Icosphere visibility.
@@ -45,7 +45,11 @@ class Icosphere extends BaseShape {
     // add vertex to mesh, fix position to be on unit sphere, return index
     _addVertex(p) {
         var length = Math.sqrt(p[0] * p[0] + p[1] * p[1] + p[2] * p[2]);
-        this._positionData.push(this._size * p[0] / length, this._size * p[1] / length, this._size * p[2] / length);
+        this._positionData.push(
+            (this._size * p[0]) / length,
+            (this._size * p[1]) / length,
+            (this._size * p[2]) / length
+        );
         return this._index++;
     }
 
@@ -63,9 +67,21 @@ class Icosphere extends BaseShape {
             return ret;
         }
 
-        var point1 = [this._positionData[p1 * 3], this._positionData[p1 * 3 + 1], this._positionData[p1 * 3 + 2]];
-        var point2 = [this._positionData[p2 * 3], this._positionData[p2 * 3 + 1], this._positionData[p2 * 3 + 2]];
-        var middle = [(point1[0] + point2[0]) / 2.0, (point1[1] + point2[1]) / 2.0, (point1[2] + point2[2]) / 2.0];
+        var point1 = [
+            this._positionData[p1 * 3],
+            this._positionData[p1 * 3 + 1],
+            this._positionData[p1 * 3 + 2]
+        ];
+        var point2 = [
+            this._positionData[p2 * 3],
+            this._positionData[p2 * 3 + 1],
+            this._positionData[p2 * 3 + 2]
+        ];
+        var middle = [
+            (point1[0] + point2[0]) / 2.0,
+            (point1[1] + point2[1]) / 2.0,
+            (point1[2] + point2[2]) / 2.0
+        ];
 
         // add vertex makes sure point is on unit sphere
         var i = this._addVertex(middle);
@@ -79,7 +95,6 @@ class Icosphere extends BaseShape {
      * @virtual
      */
     _createData() {
-
         this._positionData = [];
         this._indexData = [];
         this._index = 0;
@@ -113,7 +128,7 @@ class Icosphere extends BaseShape {
         faces.push([0, 7, 10]);
         faces.push([0, 10, 11]);
 
-        // 5 adjacent faces 
+        // 5 adjacent faces
         faces.push([1, 5, 9]);
         faces.push([5, 11, 4]);
         faces.push([11, 10, 2]);
@@ -127,7 +142,7 @@ class Icosphere extends BaseShape {
         faces.push([3, 6, 8]);
         faces.push([3, 8, 9]);
 
-        // 5 adjacent faces 
+        // 5 adjacent faces
         faces.push([4, 9, 5]);
         faces.push([2, 4, 11]);
         faces.push([6, 2, 10]);
@@ -161,4 +176,4 @@ class Icosphere extends BaseShape {
     }
 }
 
-export { Icosphere };
+export { Icosphere };

package/src/og/shapes/Sphere.js

@@ -2,17 +2,17 @@
  * @module og/shape/BaseShape
  */
 
-'use strict';
+"use strict";
 
-import { BaseShape } from './BaseShape.js';
+import { BaseShape } from "./BaseShape.js";
 
 /**
  * @class
- * @extends {og.shape.BaseShape}
+ * @extends {BaseShape}
  * @param {Object} options - Sphere parameters:
- * @param {og.Vec3} [options.position] - Sphere position.
- * @param {og.Quat} [options.orientation] - Sphere orientation(rotation).
- * @param {og.Vec3} [options.scale] - Scale vector.
+ * @param {Vec3} [options.position] - Sphere position.
+ * @param {Quat} [options.orientation] - Sphere orientation(rotation).
+ * @param {Vec3} [options.scale] - Scale vector.
  * @param {Array.<number>} [options.color] - Sphere RGBA color. (exactly 4 entries)
  * @param {string} [options.src] - Texture image url source.
  * @param {boolean} [options.visibility] - Sphere visibility.
@@ -21,11 +21,9 @@ import { BaseShape } from './BaseShape.js';
  * @param {number} [options.lonBands=16] - Number of longitude bands.
  */
 class Sphere extends BaseShape {
-
     constructor(options) {
-
         super(options);
-        
+
         /**
          * Sphere radius.
          * @protected
@@ -57,20 +55,19 @@ class Sphere extends BaseShape {
      * @virtual
      */
     _createData() {
-
         for (let latNumber = 0; latNumber <= this._latBands; latNumber++) {
-            var theta = latNumber * Math.PI / this._latBands;
+            var theta = (latNumber * Math.PI) / this._latBands;
             var sinTheta = Math.sin(theta);
             var cosTheta = Math.cos(theta);
 
             for (let longNumber = 0; longNumber <= this._lonBands; longNumber++) {
-                var phi = longNumber * 2 * Math.PI / this._lonBands;
+                var phi = (longNumber * 2 * Math.PI) / this._lonBands;
                 var sinPhi = Math.sin(phi);
                 var cosPhi = Math.cos(phi);
                 var x = cosPhi * sinTheta;
                 var y = cosTheta;
                 var z = sinPhi * sinTheta;
-                var u = 1 - (longNumber / this._lonBands);
+                var u = 1 - longNumber / this._lonBands;
                 var v = latNumber / this._latBands;
                 this._normalData.push(x);
                 this._normalData.push(y);
@@ -85,7 +82,7 @@ class Sphere extends BaseShape {
 
         for (let latNumber = 0; latNumber < this._latBands; latNumber++) {
             for (let longNumber = 0; longNumber < this._lonBands; longNumber++) {
-                var first = (latNumber * (this._lonBands + 1)) + longNumber;
+                var first = latNumber * (this._lonBands + 1) + longNumber;
                 var second = first + this._lonBands + 1;
 
                 this._indexData.push(first);
@@ -100,4 +97,4 @@ class Sphere extends BaseShape {
     }
 }
 
-export { Sphere };
+export { Sphere };

package/src/og/terrain/BilTerrain.js

@@ -4,6 +4,7 @@ import { GlobusTerrain } from "./GlobusTerrain.js";
 import { WMS } from "../layer/WMS.js";
 import { isPowerOfTwo, nextHighestPowerOfTwo } from "../math.js";
 import { getTileExtent } from "../mercator.js";
+import { Layer } from "../layer/Layer.js";
 
 class BilTerrain extends GlobusTerrain {
     constructor(options) {

package/src/og/terrain/EmptyTerrain.js

@@ -58,7 +58,7 @@ class EmptyTerrain {
         /**
          * Planet node.
          * @protected
-         * @type {og.scene.Planet}
+         * @type {Planet}
          */
         this._planet = null;
 
@@ -117,7 +117,7 @@ class EmptyTerrain {
      * Loads or creates segment elevation data.
      * @public
      * @virtual
-     * @param {og.planetSegment.Segment} segment - Segment to create elevation data.
+     * @param {Segment} segment - Segment to create elevation data.
      */
     handleSegmentTerrain(segment) {
         segment.terrainIsLoading = false;

package/src/og/terrain/GlobusTerrain.js

@@ -17,7 +17,6 @@ import { Vec3 } from "../math/Vec3.js";
 import { Ray } from "../math/Ray.js";
 import { Extent } from "../Extent.js";
 import { LonLat } from "../LonLat.js";
-import { MAX_NORMAL_ZOOM } from "../segment/Segment.js";
 
 const EVENT_NAMES = [
     /**
@@ -36,7 +35,7 @@ const EVENT_NAMES = [
 /**
  * Class that loads segment elevation data, converts it to the array and passes it to the planet segment.
  * @class
- * @extends {og.terrain.EmptyTerrain}
+ * @extends {EmptyTerrain}
  * @param {string} [name=""] - Terrain provider name.
  * @param {Object} [options] - Provider options:
  * @param {number} [options.minZoom=3] - Minimal visible zoom index when terrain handler works.
@@ -63,7 +62,7 @@ class GlobusTerrain extends EmptyTerrain {
         /**
          * Events handler.
          * @public
-         * @type {og.Events}
+         * @type {Events}
          */
         this.events = new Events(EVENT_NAMES, this);
 
@@ -140,7 +139,7 @@ class GlobusTerrain extends EmptyTerrain {
          * Rewrites elevation storage url query.
          * @private
          * @callback og.terrain.GlobusTerrain~_urlRewriteCallback
-         * @param {og.planetSegment.Segment} segment - Segment to load.
+         * @param {Segment} segment - Segment to load.
          * @param {string} url - Created url.
          * @returns {string} - Url query string.
          */
@@ -350,7 +349,8 @@ class GlobusTerrain extends EmptyTerrain {
      * Starts to load segment data.
      * @public
      * @virtual
-     * @param {og.planetSegment.Segment} segment - Segment that wants a terrain data.
+     * @param {Segment} segment - Segment that wants a terrain data.
+     * @param {boolean} forceLoading
      */
     loadTerrain(segment, forceLoading) {
         if (this._planet.terrainLock.isFree()) {
@@ -400,7 +400,7 @@ class GlobusTerrain extends EmptyTerrain {
      * Creates query url.
      * @protected
      * @virtual
-     * @param {og.planetSegment.Segment} segment -
+     * @param {Segment} segment -
      * @returns {string} -
      */
     _createUrl(segment) {
@@ -414,7 +414,7 @@ class GlobusTerrain extends EmptyTerrain {
     /**
      * Returns actual url query string.
      * @protected
-     * @param {og.planetSegment.Segment} segment - Segment that loads image data.
+     * @param {Segment} segment - Segment that loads image data.
      * @returns {string} - Url string.
      */
     _getHTTPRequestString(segment) {
@@ -426,7 +426,7 @@ class GlobusTerrain extends EmptyTerrain {
     /**
      * Sets url rewrite callback, used for custom url rewriting for every tile laoding.
      * @public
-     * @param {og.terrain.GlobusTerrain~_urlRewriteCallback} ur - The callback that returns tile custom created url.
+     * @param {GlobusTerrain~_urlRewriteCallback} ur - The callback that returns tile custom created url.
      */
     setUrlRewriteCallback(ur) {
         this._urlRewriteCallback = ur;
@@ -445,7 +445,7 @@ class GlobusTerrain extends EmptyTerrain {
 
     /**
      * @protected
-     * @param {og.planetSegment.Segment} segment -
+     * @param {Segment} segment -
      * @param {*} data -
      */
     _applyElevationsData(segment, elevations) {

package/src/og/utils/FontAtlas.js

@@ -138,10 +138,14 @@ class FontAtlas {
 
         let img = new Image();
         img.onload = () => {
-            atlas.createTexture(img);
+            this._createTexture(atlas, img);
             def.resolve(index);
         };
         img.src = ARIAL_FONT_B64;
+    }
+
+    _createTexture(atlas, img) {
+        atlas.createTexture(img);
     }
 
     loadFont(faceName, srcDir, atlasUrl) {
@@ -183,7 +187,7 @@ class FontAtlas {
 
                 let img = new Image();
                 img.onload = () => {
-                    atlas.createTexture(img);
+                    this._createTexture(atlas, img);
                     def.resolve(index);
                 };