@openglobus/og 0.19.4 → 0.20.0

package/lib/js/math/Mat4.js

@@ -384,23 +384,24 @@ export class Mat4 {
      * @returns {Mat4} -
      */
     setPerspective(left, right, bottom, top, near, far) {
-        let h = right - left, i = top - bottom, j = far - near;
-        this._m[0] = (near * 2) / h;
-        this._m[1] = 0;
-        this._m[2] = 0;
-        this._m[3] = 0;
-        this._m[4] = 0;
-        this._m[5] = (near * 2) / i;
-        this._m[6] = 0;
-        this._m[7] = 0;
-        this._m[8] = (right + left) / h;
-        this._m[9] = (top + bottom) / i;
-        this._m[10] = -(far + near) / j;
-        this._m[11] = -1;
-        this._m[12] = 0;
-        this._m[13] = 0;
-        this._m[14] = -(far * near * 2) / j;
-        this._m[15] = 0;
+        let h = right - left, i = top - bottom, j = near - far, n2 = 2 * near;
+        let mm = this._m;
+        mm[0] = n2 / h;
+        mm[1] = 0;
+        mm[2] = 0;
+        mm[3] = 0;
+        mm[4] = 0;
+        mm[5] = n2 / i;
+        mm[6] = 0;
+        mm[7] = 0;
+        mm[8] = (right + left) / h;
+        mm[9] = (top + bottom) / i;
+        mm[10] = (far + near) / j;
+        mm[11] = -1;
+        mm[12] = 0;
+        mm[13] = 0;
+        mm[14] = (n2 * far) / j;
+        mm[15] = 0;
         return this;
     }
     /**

package/lib/js/mercator.js

@@ -102,7 +102,8 @@ export function forwardArray(lonlatArr) {
     return res;
 }
 export function getTileExtent(x, y, z) {
-    let size = POLE2 / Math.pow(2, z), sw = new LonLat(-POLE + x * size, POLE - y * size - size);
+    let size = POLE2 / (1 << z), //Math.pow(2, z),
+    sw = new LonLat(-POLE + x * size, POLE - y * size - size);
     return new Extent(sw, new LonLat(sw.lon + size, sw.lat + size));
 }
 /**

package/lib/js/quadTree/EPSG4326QuadTreeStrategy.js

@@ -1,4 +1,3 @@
-import * as quadTree from "../quadTree/quadTree";
 import { Extent } from "../Extent";
 import { EPSG4326 } from "../proj/EPSG4326";
 import { Node } from "../quadTree/Node";
@@ -9,9 +8,9 @@ export class EPSG4326QuadTreeStrategy extends QuadTreeStrategy {
         super(planet, "EPSG4326", EPSG4326);
     }
     init() {
-        let earthQuadTreeSouth = new Node(SegmentLonLatWgs84, this.planet, quadTree.NW, null, 0, 0, Extent.createFromArray([-180, -90, 0, 90]));
-        let earthQuadTreeWest = new Node(SegmentLonLatWgs84, this.planet, quadTree.NW, null, 0, 0, Extent.createFromArray([0, -90, 180, 90]));
-        this._quadTreeList.push(earthQuadTreeSouth);
-        this._quadTreeList.push(earthQuadTreeWest);
+        this._quadTreeList = [
+            new Node(SegmentLonLatWgs84, this.planet, 0, null, 0, Extent.createFromArray([-180, -90, 0, 90])),
+            new Node(SegmentLonLatWgs84, this.planet, 0, null, 0, Extent.createFromArray([0, -90, 180, 90]))
+        ];
     }
 }

package/lib/js/quadTree/EarthQuadTreeStrategy.d.ts

@@ -1,6 +1,9 @@
 import { Planet } from "../scene/Planet";
 import { QuadTreeStrategy } from "./QuadTreeStrategy";
+import { LonLat } from "../LonLat";
 export declare class EarthQuadTreeStrategy extends QuadTreeStrategy {
     constructor(planet: Planet);
     init(): void;
+    getTileXY(lonLat: LonLat, zoom: number): [number, number, number, number];
+    getLonLatTileOffset(lonLat: LonLat, x: number, y: number, z: number, gridSize: number): [number, number];
 }

package/lib/js/quadTree/EarthQuadTreeStrategy.js

@@ -1,9 +1,8 @@
 import * as mercator from "../mercator";
-import * as quadTree from "../quadTree/quadTree";
 import { Extent } from "../Extent";
 import { Node } from "../quadTree/Node";
 import { QuadTreeStrategy } from "./QuadTreeStrategy";
-import { Segment } from "../segment/Segment";
+import { Segment, TILEGROUP_NORTH, TILEGROUP_SOUTH, getTileGroupByLat, getTileCellExtent, getTileCellIndex } from "../segment/Segment";
 import { SegmentLonLat } from "../segment/SegmentLonLat";
 export class EarthQuadTreeStrategy extends QuadTreeStrategy {
     constructor(planet) {
@@ -11,9 +10,45 @@ export class EarthQuadTreeStrategy extends QuadTreeStrategy {
     }
     init() {
         this._quadTreeList = [
-            new Node(Segment, this.planet, quadTree.NW, null, 0, 0, Extent.createFromArray([-20037508.34, -20037508.34, 20037508.34, 20037508.34])),
-            new Node(SegmentLonLat, this.planet, quadTree.NW, null, 0, 0, Extent.createFromArray([-180, mercator.MAX_LAT, 180, 90])),
-            new Node(SegmentLonLat, this.planet, quadTree.NW, null, 0, 0, Extent.createFromArray([-180, -90, 180, mercator.MIN_LAT]))
+            new Node(Segment, this.planet, 0, null, 0, Extent.createFromArray([-20037508.34, -20037508.34, 20037508.34, 20037508.34])),
+            new Node(SegmentLonLat, this.planet, 0, null, 0, Extent.createFromArray([-180, mercator.MAX_LAT, 180, 90])),
+            new Node(SegmentLonLat, this.planet, 0, null, 0, Extent.createFromArray([-180, -90, 180, mercator.MIN_LAT]))
         ];
     }
+    getTileXY(lonLat, zoom) {
+        let tileGroup = getTileGroupByLat(lonLat.lat, mercator.MAX_LAT), z = zoom, x = -1, y = -1, pz = (1 << z) /*Math.pow(2, z)*/;
+        if (tileGroup === TILEGROUP_NORTH) {
+            x = getTileCellIndex(lonLat.lon, 360 / pz, -180);
+            y = getTileCellIndex(lonLat.lat, (90 - mercator.MAX_LAT) / pz, 90);
+        }
+        else if (tileGroup === TILEGROUP_SOUTH) {
+            x = getTileCellIndex(lonLat.lon, 360 / pz, -180);
+            y = getTileCellIndex(lonLat.lat, (90 - mercator.MAX_LAT) / pz, mercator.MIN_LAT);
+        }
+        else {
+            let merc = mercator.forward(lonLat);
+            x = getTileCellIndex(merc.lon, mercator.POLE2 / pz, -mercator.POLE);
+            y = getTileCellIndex(merc.lat, mercator.POLE2 / pz, mercator.POLE);
+        }
+        return [x, y, z, tileGroup];
+    }
+    getLonLatTileOffset(lonLat, x, y, z, gridSize) {
+        let coords = lonLat;
+        let extent = new Extent();
+        if (lonLat.lat > mercator.MAX_LAT) {
+            let worldExtent = Extent.createFromArray([-180, mercator.MAX_LAT, 180, 90]);
+            extent = getTileCellExtent(x, y, z, worldExtent);
+        }
+        else if (lonLat.lat < mercator.MIN_LAT) {
+            let worldExtent = Extent.createFromArray([-180, -90, 180, mercator.MIN_LAT]);
+            extent = getTileCellExtent(x, y, z, worldExtent);
+        }
+        else {
+            coords = mercator.forward(lonLat);
+            extent = mercator.getTileExtent(x, y, z);
+        }
+        let sizeImgW = extent.getWidth() / (gridSize - 1), sizeImgH = extent.getHeight() / (gridSize - 1);
+        let i = gridSize - Math.ceil((coords.lat - extent.southWest.lat) / sizeImgH) - 1, j = Math.floor((coords.lon - extent.southWest.lon) / sizeImgW);
+        return [i, j];
+    }
 }

package/lib/js/quadTree/EntityCollectionNode.d.ts

@@ -25,7 +25,7 @@ declare class EntityCollectionNode {
     zoom: number;
     bsphere: Sphere;
     _inTheQueue: boolean;
-    constructor(layer: Vector, partId: number, parent: EntityCollectionNode | null, id: number, extent: Extent, planet: Planet, zoom: number);
+    constructor(layer: Vector, partId: number, parent: EntityCollectionNode | null, extent: Extent, planet: Planet, zoom: number);
     insertEntity(entity: Entity, rightNow?: boolean): void;
     protected _addEntitiesToCollection(entities: Entity[], rightNow?: boolean): void;
     protected _setExtentBounds(): void;
@@ -43,7 +43,7 @@ declare class EntityCollectionNode {
 }
 declare class EntityCollectionNodeWGS84 extends EntityCollectionNode {
     isNorth: boolean;
-    constructor(layer: Vector, partId: number, parent: EntityCollectionNodeWGS84 | null, id: number, extent: Extent, planet: Planet, zoom: number);
+    constructor(layer: Vector, partId: number, parent: EntityCollectionNodeWGS84 | null, extent: Extent, planet: Planet, zoom: number);
     createChildrenNodes(): void;
     protected _setExtentBounds(): void;
     __setLonLat__(entity: Entity): LonLat;

package/lib/js/quadTree/EntityCollectionNode.js

@@ -9,12 +9,13 @@ import { Vec3 } from '../math/Vec3';
  * @todo: remove planet parameter. It's already available in the layer.
  */
 class EntityCollectionNode {
-    constructor(layer, partId, parent, id, extent, planet, zoom) {
+    constructor(layer, partId, parent, extent, planet, zoom) {
         this.layer = layer;
         this.parentNode = parent;
         this.childrenNodes = [];
         this.partId = partId;
-        this.nodeId = partId + id;
+        //this.nodeId = partId + id;
+        this.nodeId = partId + (parent ? parent.nodeId * 4 + 1 : 0);
         this.state = null;
         this.extent = extent;
         this.count = 0;
@@ -125,15 +126,14 @@ class EntityCollectionNode {
         const size_y = ext.getHeight() * 0.5;
         const ne = ext.northEast;
         const sw = ext.southWest;
-        const id = this.nodeId * 4 + 1;
         const c = new LonLat(sw.lon + size_x, sw.lat + size_y);
         const nd = this.childrenNodes;
         const p = this.layer._planet;
         const z = this.zoom + 1;
-        nd[NW] = new EntityCollectionNode(l, NW, this, id, new Extent(new LonLat(sw.lon, sw.lat + size_y), new LonLat(sw.lon + size_x, ne.lat)), p, z);
-        nd[NE] = new EntityCollectionNode(l, NE, this, id, new Extent(c, new LonLat(ne.lon, ne.lat)), p, z);
-        nd[SW] = new EntityCollectionNode(l, SW, this, id, new Extent(new LonLat(sw.lon, sw.lat), c), p, z);
-        nd[SE] = new EntityCollectionNode(l, SE, this, id, new Extent(new LonLat(sw.lon + size_x, sw.lat), new LonLat(ne.lon, sw.lat + size_y)), p, z);
+        nd[NW] = new EntityCollectionNode(l, NW, this, new Extent(new LonLat(sw.lon, sw.lat + size_y), new LonLat(sw.lon + size_x, ne.lat)), p, z);
+        nd[NE] = new EntityCollectionNode(l, NE, this, new Extent(c, new LonLat(ne.lon, ne.lat)), p, z);
+        nd[SW] = new EntityCollectionNode(l, SW, this, new Extent(new LonLat(sw.lon, sw.lat), c), p, z);
+        nd[SE] = new EntityCollectionNode(l, SE, this, new Extent(new LonLat(sw.lon + size_x, sw.lat), new LonLat(ne.lon, sw.lat + size_y)), p, z);
     }
     collectRenderCollectionsPASS1(visibleNodes, outArr) {
         const n = visibleNodes[this.nodeId];
@@ -258,8 +258,8 @@ class EntityCollectionNode {
     }
 }
 class EntityCollectionNodeWGS84 extends EntityCollectionNode {
-    constructor(layer, partId, parent, id, extent, planet, zoom) {
-        super(layer, partId, parent, id, extent, planet, zoom);
+    constructor(layer, partId, parent, extent, planet, zoom) {
+        super(layer, partId, parent, extent, planet, zoom);
         this.isNorth = false;
     }
     createChildrenNodes() {
@@ -269,15 +269,14 @@ class EntityCollectionNodeWGS84 extends EntityCollectionNode {
         const size_y = ext.getHeight() * 0.5;
         const ne = ext.northEast;
         const sw = ext.southWest;
-        const id = this.nodeId * 4 + 1;
         const c = new LonLat(sw.lon + size_x, sw.lat + size_y);
         const nd = this.childrenNodes;
         const p = this.layer._planet;
         const z = this.zoom + 1;
-        nd[NW] = new EntityCollectionNodeWGS84(l, NW, this, id, new Extent(new LonLat(sw.lon, sw.lat + size_y), new LonLat(sw.lon + size_x, ne.lat)), p, z);
-        nd[NE] = new EntityCollectionNodeWGS84(l, NE, this, id, new Extent(c, new LonLat(ne.lon, ne.lat)), p, z);
-        nd[SW] = new EntityCollectionNodeWGS84(l, SW, this, id, new Extent(new LonLat(sw.lon, sw.lat), c), p, z);
-        nd[SE] = new EntityCollectionNodeWGS84(l, SE, this, id, new Extent(new LonLat(sw.lon + size_x, sw.lat), new LonLat(ne.lon, sw.lat + size_y)), p, z);
+        nd[NW] = new EntityCollectionNodeWGS84(l, NW, this, new Extent(new LonLat(sw.lon, sw.lat + size_y), new LonLat(sw.lon + size_x, ne.lat)), p, z);
+        nd[NE] = new EntityCollectionNodeWGS84(l, NE, this, new Extent(c, new LonLat(ne.lon, ne.lat)), p, z);
+        nd[SW] = new EntityCollectionNodeWGS84(l, SW, this, new Extent(new LonLat(sw.lon, sw.lat), c), p, z);
+        nd[SE] = new EntityCollectionNodeWGS84(l, SE, this, new Extent(new LonLat(sw.lon + size_x, sw.lat), new LonLat(ne.lon, sw.lat + size_y)), p, z);
     }
     _setExtentBounds() {
         if (this.extent.northEast.lat > 0) {

package/lib/js/quadTree/MarsQuadTreeStrategy.d.ts

@@ -1,6 +1,11 @@
 import { Planet } from "../scene/Planet";
 import { QuadTreeStrategy } from "./QuadTreeStrategy";
+import { LonLat } from "../LonLat";
 export declare class MarsQuadTreeStrategy extends QuadTreeStrategy {
+    private _westExtent;
+    private _eastExtent;
     constructor(planet: Planet);
     init(): void;
+    getTileXY(lonLat: LonLat, zoom: number): [number, number, number, number];
+    getLonLatTileOffset(lonLat: LonLat, x: number, y: number, z: number, gridSize: number): [number, number];
 }

package/lib/js/quadTree/MarsQuadTreeStrategy.js

@@ -1,17 +1,43 @@
-import * as quadTree from "../quadTree/quadTree";
 import { Extent } from "../Extent";
 import { EPSG4326 } from "../proj/EPSG4326";
 import { Node } from "../quadTree/Node";
 import { SegmentLonLatWgs84 } from "../segment/SegmentLonLatWgs84";
 import { QuadTreeStrategy } from "./QuadTreeStrategy";
+import { getTileCellExtent, getTileCellIndex, TILEGROUP_COMMON } from "../segment/Segment";
 export class MarsQuadTreeStrategy extends QuadTreeStrategy {
     constructor(planet) {
         super(planet, "Mars", EPSG4326);
+        this._westExtent = Extent.createFromArray([-180, -90, 0, 90]);
+        this._eastExtent = Extent.createFromArray([0, -90, 180, 90]);
     }
     init() {
-        let earthQuadTreeSouth = new Node(SegmentLonLatWgs84, this.planet, quadTree.NW, null, 0, 0, Extent.createFromArray([-180, -90, 0, 90]));
-        let earthQuadTreeWest = new Node(SegmentLonLatWgs84, this.planet, quadTree.NW, null, 0, 0, Extent.createFromArray([0, -90, 180, 90]));
-        this._quadTreeList.push(earthQuadTreeSouth);
-        this._quadTreeList.push(earthQuadTreeWest);
+        this._quadTreeList = [
+            new Node(SegmentLonLatWgs84, this.planet, 0, null, 0, this._westExtent),
+            new Node(SegmentLonLatWgs84, this.planet, 0, null, 0, this._eastExtent)
+        ];
+    }
+    getTileXY(lonLat, zoom) {
+        let z = zoom, x = -1, y = -1, pz = (1 << z);
+        if (lonLat.lon > 0) {
+            x = getTileCellIndex(lonLat.lon, 180 / pz, 0) + pz;
+        }
+        else {
+            x = getTileCellIndex(lonLat.lon, 180 / pz, -180);
+        }
+        y = getTileCellIndex(lonLat.lat, 180 / pz, 90);
+        return [x, y, z, TILEGROUP_COMMON];
+    }
+    getLonLatTileOffset(lonLat, x, y, z, gridSize) {
+        let coords = lonLat;
+        let extent = new Extent();
+        if (lonLat.lon > 0) {
+            extent = getTileCellExtent(x - (1 << z), y, z, this._westExtent);
+        }
+        else {
+            extent = getTileCellExtent(x, y, z, this._eastExtent);
+        }
+        let sizeImgW = extent.getWidth() / (gridSize - 1), sizeImgH = extent.getHeight() / (gridSize - 1);
+        let i = gridSize - Math.ceil((coords.lat - extent.southWest.lat) / sizeImgH) - 1, j = Math.floor((coords.lon - extent.southWest.lon) / sizeImgW);
+        return [i, j];
     }
 }

package/lib/js/quadTree/Node.d.ts

@@ -14,6 +14,7 @@ import { PlanetCamera } from "../camera/PlanetCamera";
  * @param {Extent} extent - Planet segment extent.
  */
 declare class Node {
+    __id: number;
     SegmentPrototype: typeof Segment;
     planet: Planet;
     parentNode: Node | null;
@@ -31,7 +32,7 @@ declare class Node {
     _cameraInside: boolean;
     inFrustum: number;
     _fadingNodes: Node[];
-    constructor(SegmentPrototype: typeof Segment, planet: Planet, partId: number, parent: Node | null, id: number, tileZoom: number, extent: Extent);
+    constructor(SegmentPrototype: typeof Segment, planet: Planet, partId: number, parent: Node | null, tileZoom: number, extent: Extent);
     createChildrenNodes(): void;
     createBounds(): void;
     getState(): number | null;

package/lib/js/quadTree/Node.js

@@ -19,6 +19,7 @@ let BOUNDS = {
     xmin: 0.0, ymin: 0.0, zmin: 0.0,
     xmax: 0.0, ymax: 0.0, zmax: 0.0
 };
+let __staticCounter = 0;
 /**
  * Quad tree planet segment node.
  * @constructor
@@ -31,13 +32,14 @@ let BOUNDS = {
  * @param {Extent} extent - Planet segment extent.
  */
 class Node {
-    constructor(SegmentPrototype, planet, partId, parent, id, tileZoom, extent) {
+    constructor(SegmentPrototype, planet, partId, parent, tileZoom, extent) {
         planet._createdNodesCount++;
+        this.__id = __staticCounter++;
         this.SegmentPrototype = SegmentPrototype;
         this.planet = planet;
         this.parentNode = parent;
         this.partId = partId;
-        this.nodeId = partId + id;
+        this.nodeId = partId + (parent ? parent.nodeId * 4 + 1 : 0);
         this.state = null;
         this.prevState = null;
         this.appliedTerrainNodeId = -1;
@@ -63,13 +65,12 @@ class Node {
         const size_y = ext.getHeight() * 0.5;
         const ne = ext.northEast;
         const sw = ext.southWest;
-        const id = this.nodeId * 4 + 1;
         const c = new LonLat(sw.lon + size_x, sw.lat + size_y);
         const nd = this.nodes;
-        nd[NW] = new Node(this.SegmentPrototype, p, NW, this, id, z, new Extent(new LonLat(sw.lon, sw.lat + size_y), new LonLat(sw.lon + size_x, ne.lat)));
-        nd[NE] = new Node(this.SegmentPrototype, p, NE, this, id, z, new Extent(c, new LonLat(ne.lon, ne.lat)));
-        nd[SW] = new Node(this.SegmentPrototype, p, SW, this, id, z, new Extent(new LonLat(sw.lon, sw.lat), c));
-        nd[SE] = new Node(this.SegmentPrototype, p, SE, this, id, z, new Extent(new LonLat(sw.lon + size_x, sw.lat), new LonLat(ne.lon, sw.lat + size_y)));
+        nd[NW] = new Node(this.SegmentPrototype, p, NW, this, z, new Extent(new LonLat(sw.lon, sw.lat + size_y), new LonLat(sw.lon + size_x, ne.lat)));
+        nd[NE] = new Node(this.SegmentPrototype, p, NE, this, z, new Extent(c, new LonLat(ne.lon, ne.lat)));
+        nd[SW] = new Node(this.SegmentPrototype, p, SW, this, z, new Extent(new LonLat(sw.lon, sw.lat), c));
+        nd[SE] = new Node(this.SegmentPrototype, p, SE, this, z, new Extent(new LonLat(sw.lon + size_x, sw.lat), new LonLat(ne.lon, sw.lat + size_y)));
     }
     createBounds() {
         let seg = this.segment;
@@ -155,9 +156,6 @@ class Node {
         }
         this.state = WALKTHROUGH;
         this.clearNeighbors();
-        // for (let i = 0; i < this._fadingNodes.length; i++) {
-        //     this._fadingNodes[i].neighbors && this._fadingNodes[i].clearNeighbors();
-        // }
         let seg = this.segment, planet = this.planet;
         this._cameraInside = false;
         // Search a node which the camera is flying over.
@@ -207,7 +205,7 @@ class Node {
             let altVis = seg.tileZoom < 2 || seg.tileZoom > 19 ||
                 /* Could be replaced with camera frustum always looking down check,
                 and not to go througn nodes from the oppositeside of the globe*/
-                (seg.tileZoom < 5 && !seg.terrainReady);
+                (seg.tileZoom < 6 && !seg.terrainReady);
             altVis = altVis ||
                 cam.eye.distance2(seg._sw) < horizonDist ||
                 cam.eye.distance2(seg._nw) < horizonDist ||
@@ -316,7 +314,7 @@ class Node {
                         pn = pn.parentNode;
                     }
                     // not sure it's necessary here
-                    //this.parentNode.whileTerrainLoading();
+                    this.parentNode.whileTerrainLoading();
                     this._fadingNodes.push(this.parentNode);
                     this.parentNode.segment._transitionOpacity = 2.0;
                     this.parentNode.segment._transitionTimestamp = timestamp;
@@ -327,7 +325,7 @@ class Node {
                         for (let i = 0; i < this.nodes.length; i++) {
                             let ni = this.nodes[i];
                             // not sure it's necessary here
-                            //ni.whileTerrainLoading();
+                            ni.whileTerrainLoading();
                             this._fadingNodes.push(ni);
                             ni.segment._transitionOpacity = 2.0;
                             ni.segment._transitionTimestamp = timestamp;
@@ -341,12 +339,14 @@ class Node {
     }
     clearNeighbors() {
         //this.sideSizeLog2[0] = this.sideSizeLog2[1] = this.sideSizeLog2[2] = this.sideSizeLog2[3] = Math.log2(this.segment.gridSize);
-        // @ts-ignore
-        this.neighbors[0] = this.neighbors[1] = this.neighbors[2] = this.neighbors[3] = null;
-        this.neighbors[0] = [];
-        this.neighbors[1] = [];
-        this.neighbors[2] = [];
-        this.neighbors[3] = [];
+        if (this.neighbors) {
+            // @ts-ignore
+            this.neighbors[0] = this.neighbors[1] = this.neighbors[2] = this.neighbors[3] = null;
+            this.neighbors[0] = [];
+            this.neighbors[1] = [];
+            this.neighbors[2] = [];
+            this.neighbors[3] = [];
+        }
     }
     _refreshTransitionOpacity() {
         if (this._fadingNodes.length === 0) {
@@ -358,6 +358,13 @@ class Node {
                 this._fadingNodes = [];
             }
             else {
+                // Looks like a bug fix for suddenly empty spaces
+                for (let i = 0; i < this._fadingNodes.length; i++) {
+                    if (this.segment._transitionOpacity < 1.0 && this._fadingNodes[i].segment._transitionOpacity === 0) {
+                        this._fadingNodes[i].segment._transitionOpacity = 0;
+                        this.segment._transitionOpacity = 1.0;
+                    }
+                }
                 this.segment.increaseTransitionOpacity();
             }
         }
@@ -457,23 +464,25 @@ class Node {
                 else if (a_sw_lat === b_ne_lat && ((a_sw_lon >= b_sw_lon && a_ne_lon <= b_ne_lon) || (a_sw_lon <= b_sw_lon && a_ne_lon >= b_ne_lon))) {
                     return S;
                 }
-                else if (bs.tileX === 0 && as.tileX === Math.pow(2, as.tileZoom) - 1 && ((a_ne_lat <= b_ne_lat && a_sw_lat >= b_sw_lat) || (a_ne_lat >= b_ne_lat && a_sw_lat <= b_sw_lat))) {
+                // World edge 180 to -180
+                else if (bs.tileX === 0 && b_sw_lon === -a_ne_lon && ((a_ne_lat <= b_ne_lat && a_sw_lat >= b_sw_lat) || (a_ne_lat >= b_ne_lat && a_sw_lat <= b_sw_lat))) {
                     return E;
                 }
-                else if (as.tileX === 0 && bs.tileX === Math.pow(2, bs.tileZoom) - 1 && ((a_ne_lat <= b_ne_lat && a_sw_lat >= b_sw_lat) || (a_ne_lat >= b_ne_lat && a_sw_lat <= b_sw_lat))) {
+                else if (as.tileX === 0 && a_sw_lon === -b_ne_lon && ((a_ne_lat <= b_ne_lat && a_sw_lat >= b_sw_lat) || (a_ne_lat >= b_ne_lat && a_sw_lat <= b_sw_lat))) {
                     return W;
                 }
             }
-            if (as._tileGroup === TILEGROUP_COMMON && bs._tileGroup === TILEGROUP_NORTH && as.tileY === 0 && bs.tileY === Math.pow(2, bs.tileZoom) - 1 && ((a_sw_lon >= b_sw_lon && a_ne_lon <= b_ne_lon) || (a_sw_lon <= b_sw_lon && a_ne_lon >= b_ne_lon))) {
+            // @todo: replace to the default strategy
+            if (as._tileGroup === TILEGROUP_COMMON && bs._tileGroup === TILEGROUP_NORTH && as.tileY === 0 && bs.tileY === bs.powTileZoom /*Math.pow(2, bs.tileZoom)*/ - 1 && ((a_sw_lon >= b_sw_lon && a_ne_lon <= b_ne_lon) || (a_sw_lon <= b_sw_lon && a_ne_lon >= b_ne_lon))) {
                 return N;
             }
-            else if (as._tileGroup === TILEGROUP_SOUTH && bs._tileGroup === TILEGROUP_COMMON && as.tileY === 0 && bs.tileY === Math.pow(2, bs.tileZoom) - 1 && ((a_sw_lon >= b_sw_lon && a_ne_lon <= b_ne_lon) || (a_sw_lon <= b_sw_lon && a_ne_lon >= b_ne_lon))) {
-                return N;
-            }
-            else if (bs._tileGroup === TILEGROUP_NORTH && as._tileGroup === TILEGROUP_COMMON && as.tileY === Math.pow(2, as.tileZoom) - 1 && bs.tileY === 0 && ((a_sw_lon >= b_sw_lon && a_ne_lon <= b_ne_lon) || (a_sw_lon <= b_sw_lon && a_ne_lon >= b_ne_lon))) {
+            else if (as._tileGroup === TILEGROUP_COMMON && bs._tileGroup === TILEGROUP_SOUTH && as.tileY === as.powTileZoom /*Math.pow(2, as.tileZoom)*/ - 1 && bs.tileY === 0 && ((a_sw_lon >= b_sw_lon && a_ne_lon <= b_ne_lon) || (a_sw_lon <= b_sw_lon && a_ne_lon >= b_ne_lon))) {
                 return S;
             }
-            else if (as._tileGroup === TILEGROUP_NORTH && bs._tileGroup === TILEGROUP_COMMON && as.tileY === Math.pow(2, as.tileZoom) - 1 && bs.tileY === 0 && ((a_sw_lon >= b_sw_lon && a_ne_lon <= b_ne_lon) || (a_sw_lon <= b_sw_lon && a_ne_lon >= b_ne_lon))) {
+            else if (as._tileGroup === TILEGROUP_SOUTH && bs._tileGroup === TILEGROUP_COMMON && as.tileY === 0 && bs.tileY === bs.powTileZoom /*Math.pow(2, bs.tileZoom)*/ - 1 && ((a_sw_lon >= b_sw_lon && a_ne_lon <= b_ne_lon) || (a_sw_lon <= b_sw_lon && a_ne_lon >= b_ne_lon))) {
+                return N;
+            }
+            else if (as._tileGroup === TILEGROUP_NORTH && bs._tileGroup === TILEGROUP_COMMON && as.tileY === as.powTileZoom /*Math.pow(2, as.tileZoom)*/ - 1 && bs.tileY === 0 && ((a_sw_lon >= b_sw_lon && a_ne_lon <= b_ne_lon) || (a_sw_lon <= b_sw_lon && a_ne_lon >= b_ne_lon))) {
                 return S;
             }
         }
@@ -506,7 +515,8 @@ class Node {
             }
         }
         if (pn.segment.terrainReady && this.appliedTerrainNodeId !== pn.nodeId) {
-            let dZ2 = 2 << (seg.tileZoom - pn.segment.tileZoom - 1), offsetX = seg.tileX - pn.segment.tileX * dZ2, offsetY = seg.tileY - pn.segment.tileY * dZ2;
+            let dZ2 = 2 << (seg.tileZoom - pn.segment.tileZoom - 1), // 2 * Math.pow(2, dZ-1)
+            offsetX = seg.tileX - pn.segment.tileX * dZ2, offsetY = seg.tileY - pn.segment.tileY * dZ2;
             const pseg = pn.segment;
             let tempVertices, tempVerticesHigh, tempVerticesLow, noDataVertices;
             this.appliedTerrainNodeId = pn.nodeId;

package/lib/js/quadTree/QuadTreeStrategy.d.ts

@@ -2,6 +2,7 @@ import { Layer } from "../layer/Layer";
 import { Node } from "../quadTree/Node";
 import { Planet } from "../scene/Planet";
 import { Proj } from "../proj/Proj";
+import { LonLat } from "../LonLat";
 export declare class QuadTreeStrategy {
     name: string;
     projection: Proj;
@@ -22,4 +23,6 @@ export declare class QuadTreeStrategy {
     collectRenderNodes(): void;
     clear(): void;
     get quadTreeList(): Node[];
+    getTileXY(lonLat: LonLat, zoom: number): [number, number, number, number];
+    getLonLatTileOffset(lonLat: LonLat, x: number, y: number, z: number, gridSize: number): [number, number];
 }

package/lib/js/quadTree/QuadTreeStrategy.js

@@ -1,4 +1,6 @@
 import { EPSG3857 } from "../proj/EPSG3857";
+import { getTileCellExtent, getTileCellIndex, TILEGROUP_COMMON } from "../segment/Segment";
+import { Extent } from "../Extent";
 export class QuadTreeStrategy {
     constructor(planet, name = "", proj = EPSG3857) {
         this.name = name;
@@ -66,4 +68,19 @@ export class QuadTreeStrategy {
     get quadTreeList() {
         return this._quadTreeList;
     }
+    getTileXY(lonLat, zoom) {
+        let z = zoom, x = -1, y = -1, pz = (1 << z);
+        x = getTileCellIndex(lonLat.lon, 360 / pz, -180);
+        y = getTileCellIndex(lonLat.lat, 180 / pz, 90);
+        return [x, y, z, TILEGROUP_COMMON];
+    }
+    getLonLatTileOffset(lonLat, x, y, z, gridSize) {
+        let coords = lonLat;
+        let extent = new Extent();
+        let worldExtent = Extent.createFromArray([-180, -90, 180, 90]);
+        extent = getTileCellExtent(x, y, z, worldExtent);
+        let sizeImgW = extent.getWidth() / (gridSize - 1), sizeImgH = extent.getHeight() / (gridSize - 1);
+        let i = gridSize - Math.ceil((coords.lat - extent.southWest.lat) / sizeImgH) - 1, j = Math.floor((coords.lon - extent.southWest.lon) / sizeImgW);
+        return [i, j];
+    }
 }

package/lib/js/quadTree/Wgs84QuadTreeStrategy.js

@@ -1,4 +1,3 @@
-import * as quadTree from "../quadTree/quadTree";
 import { Extent } from "../Extent";
 import { EPSG4326 } from "../proj/EPSG4326";
 import { Node } from "../quadTree/Node";
@@ -9,7 +8,8 @@ export class Wgs84QuadTreeStrategy extends QuadTreeStrategy {
         super(planet, "wgs84", EPSG4326);
     }
     init() {
-        let wgs84QuadTree = new Node(SegmentLonLatWgs84, this.planet, quadTree.NW, null, 0, 0, Extent.createFromArray([-180, -90, 180, 90]));
-        this._quadTreeList.push(wgs84QuadTree);
+        this._quadTreeList = [
+            new Node(SegmentLonLatWgs84, this.planet, 0, null, 0, Extent.createFromArray([-180, -90, 180, 90]))
+        ];
     }
 }

package/lib/js/renderer/Renderer.js

@@ -954,6 +954,7 @@ class Renderer {
         //this.geoObjectsTextureAtlas.clear()
         //this.fontAtlas.clear();
         this._entityCollections = [];
+        this.handler.ONCANVASRESIZE = null;
         this.handler.destroy();
         // @ts-ignore
         this.handler = null;

package/lib/js/scene/Planet.js

@@ -63,8 +63,8 @@ export class Planet extends RenderNode {
             let isEq = this.terrain.equalizeVertices;
             for (let j = 0, len = currentNode._fadingNodes.length; j < len; j++) {
                 let f = currentNode._fadingNodes[j].segment;
-                if (this._fadingNodes.has(currentNode._fadingNodes[0].nodeId) && !nodes.has(f.node.nodeId)) {
-                    nodes.set(f.node.nodeId, true);
+                if (this._fadingNodes.has(currentNode._fadingNodes[0].__id) && !nodes.has(f.node.__id)) {
+                    nodes.set(f.node.__id, true);
                     if (f._transitionOpacity < 1.0) {
                         outTransparentSegments.push(f);
                     }
@@ -88,8 +88,8 @@ export class Planet extends RenderNode {
             gl.disable(gl.DEPTH_TEST);
             for (let j = 0, len = currentNode._fadingNodes.length; j < len; j++) {
                 let f = currentNode._fadingNodes[j].segment;
-                if (this._fadingNodes.has(currentNode._fadingNodes[0].nodeId) && !nodes.has(f.node.nodeId)) {
-                    nodes.set(f.node.nodeId, true);
+                if (this._fadingNodes.has(currentNode._fadingNodes[0].__id) && !nodes.has(f.node.__id)) {
+                    nodes.set(f.node.__id, true);
                     if (isFirstPass) {
                         isEq && f.equalize();
                         f.readyToEngage && f.engage();
@@ -803,6 +803,7 @@ export class Planet extends RenderNode {
                 ri._collectFadingNodes();
                 ri._refreshTransitionOpacity();
                 if (ri.segment._transitionOpacity >= 1.0) {
+                    ri.clearNeighbors();
                     ri.getRenderedNodesNeighbors(opaqueNodes);
                     opaqueNodes.push(ri);
                 }
@@ -810,6 +811,7 @@ export class Planet extends RenderNode {
                     for (let j = 0; j < ri._fadingNodes.length; j++) {
                         let rij = ri._fadingNodes[j];
                         if (rij.segment && rij.segment._transitionOpacity >= 1.0) {
+                            rij.clearNeighbors();
                             rij.getRenderedNodesNeighbors(opaqueNodes);
                             opaqueNodes.push(rij);
                         }

package/lib/js/segment/Segment.d.ts

@@ -16,9 +16,12 @@ import { NumberArray6, Sphere } from "../bv/Sphere";
 import { Slice } from "./Slice";
 import { Vec3 } from "../math/Vec3";
 import { IPlainSegmentWorkerData } from "../utils/PlainSegmentWorker";
+export declare function getTileCellIndex(coordinate: number, tileSize: number, worldEdge: number): number;
+export declare function getTileCellExtent(x: number, y: number, z: number, worldExtent: Extent): Extent;
 export declare const TILEGROUP_COMMON = 0;
-export declare const TILEGROUP_NORTH = 1;
-export declare const TILEGROUP_SOUTH = 2;
+export declare const TILEGROUP_NORTH = 20;
+export declare const TILEGROUP_SOUTH = 300;
+export declare function getTileGroupByLat(lat: number, maxLat?: number): number;
 /**
  * Planet segment Web Mercator tile class that stored and rendered with a quad-tree.
  * @class
@@ -32,6 +35,7 @@ declare class Segment {
     isPole: boolean;
     _tileGroup: number;
     _projection: Proj;
+    elevationData: TypedArray | null;
     /**
      * Quad tree node of the segment.
      * @type {Node}
@@ -81,6 +85,11 @@ declare class Segment {
      * @type {number}
      */
     tileZoom: number;
+    /**
+     * Equals to pow(2, tileZoom).
+     * @type {number}
+     */
+    powTileZoom: number;
     /**
      * Horizontal tile index.
      * @type {number}
@@ -243,6 +252,7 @@ declare class Segment {
     createPlainSegmentAsync(): void;
     _plainSegmentWorkerCallback(data: IPlainSegmentWorkerData): void;
     createPlainSegment(): void;
+    protected _projToDeg(lon: number, lat: number): LonLat;
     protected _createPlainVertices(): void;
     /**
      * Gets specific layer material.
@@ -267,19 +277,12 @@ declare class Segment {
     colorPickingRendering(sh: Program, layerSlice: Layer[], sliceIndex: number, defaultTexture?: WebGLTextureExt | null, isOverlay?: boolean): void;
     depthRendering(sh: Program, layerSlice: Layer[]): void;
     protected _getIndexBuffer(): WebGLBufferExt;
-    /**
-     * @todo: replace to the strategy
-     */
     _collectVisibleNodes(): void;
     layerOverlap(layer: Layer): boolean;
     getDefaultTexture(): WebGLTextureExt | null;
     getExtentLonLat(): Extent;
     getExtentMerc(): Extent;
     getExtent(): Extent;
-    /**
-     * @todo replace to the strategy
-     */
-    getNodeState(): number;
     getNeighborSide(b: Segment): 0 | 1 | 2 | 3 | -1;
 }
 export { Segment };