@openglobus/og 0.16.3 → 0.17.0

package/src/og/utils/VectorTileCreator.js

@@ -1,7 +1,3 @@
-/**
- * @module og/utils/VectorTileCreator
- */
-
 'use strict';
 
 import { doubleToTwoFloats2 } from '../math/coder.js';
@@ -14,19 +10,17 @@ let tempArr = new Float32Array(2);
 const MAX_FRAME_TIME = 25.0;
 
 export class VectorTileCreator {
-
     constructor(planet, width = 512, height = 512) {
-
         this._width = width;
         this._height = height;
-        this._handler = planet.renderer.handler;
         this._planet = planet;
         this._framebuffer = null;
         this._queue = [];
-        this._initialize();
     }
 
-    _initialize() {
+    init() {
+
+        this._handler = this._planet.renderer.handler;
 
         //Line
         if (!this._handler.programs.vectorTileLineRasterization) {

package/src/og/utils/shared.js

@@ -956,6 +956,7 @@ export async function loadImage(url) {
             resolve(image);
         });
         image.src = url;
+        image.crossOrigin = ""
         return image;
     });
 }
@@ -967,4 +968,22 @@ export async function loadImage(url) {
  */
 export function isImageLoaded(image) {
     return image.complete && image.naturalHeight !== 0;
-}
+}
+
+export function distanceFormat(v) {
+    if (v > 1000) {
+        return `${(v / 1000).toFixed(1)} km`;
+    } else if (v > 9) {
+        return `${Math.round(v)} m`;
+    } else {
+        return `${v.toFixed(1)} m`;
+    }
+}
+
+export function getUrlParam(paramName) {
+    let urlParams = new URLSearchParams(location.search);
+    let param = urlParams.get(paramName);
+    if (param) {
+        return Number(param);
+    }
+}

package/src/og/webgl/Framebuffer.js

@@ -1,7 +1,3 @@
-/**
- * @module og/webgl/Framebuffer
- */
-
 "use strict";
 
 import { ImageCanvas } from "../ImageCanvas.js";

package/src/og/webgl/Handler.js

@@ -1,7 +1,3 @@
-/**
- * @module og/webgl/Handler
- */
-
 "use strict";
 
 import { Clock } from "../Clock.js";
@@ -10,7 +6,7 @@ import { Events } from "../Events.js";
 import { ImageCanvas } from "../ImageCanvas.js";
 import { Vec2 } from "../math/Vec2.js";
 import { Stack } from "../Stack.js";
-import { isEmpty } from "../utils/shared.js";
+import { getUrlParam, isEmpty } from "../utils/shared.js";
 import { ProgramController } from "./ProgramController.js";
 
 const vendorPrefixes = ["", "WEBKIT_", "MOZ_"];
@@ -23,7 +19,7 @@ const MAX_LEVELS = 2;
 /**
  * A WebGL handler for accessing low-level WebGL capabilities.
  * @class
- * @param {string} id - Canvas element id that WebGL handler assing with. If it's null
+ * @param {string | HTMLCanvasElement} canvasTarget - Canvas element target.
  * or undefined creates hidden canvas and handler bacomes hidden.
  * @param {Object} [params] - Handler options:
  * @param {number} [params.anisotropy] - Anisotropy filter degree. 8 is default.
@@ -32,7 +28,7 @@ const MAX_LEVELS = 2;
  * @param {Array.<string>} [params.extensions] - Additional WebGL extension list. Available by default: EXT_texture_filter_anisotropic.
  */
 class Handler {
-    constructor(id, params = {}) {
+    constructor(canvasTarget, params = {}) {
 
         this.events = new Events(["visibilitychange", "resize"]);
         /**
@@ -94,7 +90,7 @@ class Handler {
         this._params.anisotropy = this._params.anisotropy || 4;
         this._params.width = this._params.width || 256;
         this._params.height = this._params.height || 256;
-        this._params.pixelRatio = this._params.pixelRatio || 1.0;
+        this._params.pixelRatio = getUrlParam('og_dpi') || this._params.pixelRatio || 1.0;
         this._params.context = this._params.context || {};
         this._params.extensions = this._params.extensions || [];
         this._oneByHeight = 1.0 / (this._params.height * this._params.pixelRatio);
@@ -109,11 +105,11 @@ class Handler {
         this.extensions = {};
 
         /**
-         * HTML Canvas object id.
+         * HTML Canvas target.
          * @private
          * @type {Object}
          */
-        this._id = id;
+        this._canvasTarget = canvasTarget;
 
         this._lastAnimationFrameTime = 0;
 
@@ -144,11 +140,31 @@ class Handler {
 
         this.ONCANVASRESIZE = null;
 
+        this._createCanvas();
+
         if (params.autoActivate || isEmpty(params.autoActivate)) {
             this.initialize();
         }
     }
 
+    isInitialized() {
+        return this._initialized;
+    }
+
+    _createCanvas() {
+        if (this._canvasTarget) {
+            if (this._canvasTarget instanceof HTMLElement) {
+                this.canvas = this._canvasTarget;
+            } else {
+                this.canvas = document.getElementById(this._canvasTarget) || document.querySelector(this._canvasTarget);
+            }
+        } else {
+            this.canvas = document.createElement("canvas");
+            this.canvas.width = this._params.width;
+            this.canvas.height = this._params.height;
+        }
+    }
+
     /**
      * The return value is null if the extension is not supported, or an extension object otherwise.
      * @param {Object} gl - WebGl context pointer.
@@ -611,17 +627,12 @@ class Handler {
      * @public
      */
     initialize() {
-        if (this._id) {
-            this.canvas = document.getElementById(this._id);
-        } else {
-            this.canvas = document.createElement("canvas");
-            this.canvas.width = this._params.width;
-            this.canvas.height = this._params.height;
-        }
+
+        if (this._initialized) return;
 
         this.gl = Handler.getContext(this.canvas, this._params.context);
 
-        if(this.gl) {
+        if (this.gl) {
             this._initialized = true;
 
             /** Sets default extensions */
@@ -1017,6 +1028,9 @@ class Handler {
 
         this.stop();
 
+        //
+        // Dispose shaders
+        //
         for (let p in this.programs) {
             this.removeProgram(p);
         }
@@ -1030,6 +1044,9 @@ class Handler {
         this.framebufferStack = null;
         this.framebufferStack = new Stack();
 
+        //
+        // Destroy canvas
+        //
         if (this.canvas.parentNode) {
             this.canvas.parentNode.removeChild(this.canvas);
         }
@@ -1037,6 +1054,9 @@ class Handler {
         this.canvas.height = 1;
         this.canvas = null;
 
+        //
+        // Clear attrib pointers
+        //
         let numAttribs = gl.getParameter(gl.MAX_VERTEX_ATTRIBS);
         let tmp = gl.createBuffer();
         gl.bindBuffer(gl.ARRAY_BUFFER, tmp);
@@ -1047,13 +1067,19 @@ class Handler {
         }
         gl.deleteBuffer(tmp);
 
-        let numTextureUnits = gl.getParameter(gl.MAX_TEXTlURE_IMAGE_UNITS);
+        //
+        // Clear all possible textures
+        //
+        let numTextureUnits = gl.getParameter(gl.MAX_TEXTURE_IMAGE_UNITS);
         for (let ii = 0; ii < numTextureUnits; ++ii) {
             gl.activeTexture(gl.TEXTURE0 + ii);
             gl.bindTexture(gl.TEXTURE_CUBE_MAP, null);
             gl.bindTexture(gl.TEXTURE_2D, null);
         }
 
+        //
+        // Hard reset
+        //
         gl.activeTexture(gl.TEXTURE0);
         gl.useProgram(null);
         gl.bindBuffer(gl.ARRAY_BUFFER, null);

package/src/og/webgl/Multisample.js

@@ -1,7 +1,3 @@
-/**
- * @module og/webgl/Multisample
- */
-
 "use strict";
 
 /**

package/src/og/webgl/Program.js

@@ -1,7 +1,3 @@
-/**
- * @module og/webgl/Program
- */
-
 "use strict";
 
 import { cons } from "../cons.js";

package/src/og/webgl/ProgramController.js

@@ -1,8 +1,8 @@
+"use strict";
+
 import { Handler } from "./Handler.js";
 import { Program } from "./Program.js";
 
-"use strict";
-
 /**
  * This is shader program controller that used by hadler object to access the shader
  * program capabilities, like switching program during the rendering.

package/types/Clock.d.ts

@@ -5,7 +5,7 @@
  * @param {number} [params.startDate=0.0] - Julian start date.
  * @param {number} [params.endDate=0.0] - Julian end date.
  * @param {number} [params.currentDate] - Julian current date. Default: current date.
- * @param {number} [params.multiplier=1.0] - Time speed multiolier.
+ * @param {number} [params.multiplier=1.0] - Time speed multiplier.
  */
 export class Clock {
     static set _staticCounter(arg: any);

package/types/Extent.d.ts

@@ -1,8 +1,8 @@
 /**
  * Represents geographical coordinates extent.
  * @class
- * @param {LonLat} [sw] - South West extent corner coordiantes.
- * @param {LonLat} [ne] - North East extent corner coordiantes.
+ * @param {LonLat} [sw] - South West extent corner coordinates.
+ * @param {LonLat} [ne] - North East extent corner coordinates.
  */
 export class Extent {
     /**
@@ -35,7 +35,7 @@ export class Extent {
      */
     static createByCoordinates(arr: Array<LonLat>): Extent;
     /**
-     * Creates bound extent instance by coordinate array.
+     * Creates bound extent instance by coordinates array.
      * @static
      * @param {Array.<Array<number>>} arr - Coordinate array. (exactly 2 entries)
      * @return {Extent} Extent object.
@@ -53,8 +53,8 @@ export class Extent {
      */
     static fromTile(x: number, y: number, z: number, width: number, height: number): Extent;
     /**
-     * @param {LonLat} [sw] - South West extent corner coordiantes.
-     * @param {LonLat} [ne] - North East extent corner coordiantes.
+     * @param {LonLat} [sw] - South West extent corner coordinates.
+     * @param {LonLat} [ne] - North East extent corner coordinates.
      */
     constructor(sw?: LonLat, ne?: LonLat);
     /**

package/types/Globe.d.ts

@@ -45,16 +45,26 @@
  * @param {Number} [options.quadTreeStrategyPrototype] - Prototype of quadTree. QuadTreeStrategy for Earth is default.
  * @param {Number} [options.msaa] - MSAA antialiasing parameter: 2,4,8,16. Default is 4.
  * @param {Number} [options.dpi] - Device pixel ratio. Default is current screen DPI.
+ * @param {Boolean} [options.atmosphereEnabled] - Enables atmosphere effect.
  */
 export class Globe {
+    static set __staticCounter(arg: any);
+    static get __staticCounter(): any;
     static set _staticCounter(arg: any);
     static get _staticCounter(): any;
     /**
      * @param {*} options
      */
     constructor(options: any);
+    $target: any;
+    _instanceID: string;
     _canvas: HTMLCanvasElement;
-    div: any;
+    /**
+     * Dom element where WebGL canvas creates
+     * @public
+     * @type {Element}
+     */
+    public $inner: Element;
     /**
      * Interface for the renderer context(events, input states, renderer nodes etc.)
      * @public
@@ -78,6 +88,7 @@ export class Globe {
     _opacityCounter: number;
     _fadeHandler: any;
     _stopHandler: any;
+    start(): void;
     /**
      * Starts screen brightness fading in effect by the duration time.
      * @public
@@ -89,6 +100,9 @@ export class Globe {
      * @param {number} duration - Fadeout duration time.
      */
     public fadeOut(): void;
+    attachTo(target: any): void;
+    detach(): void;
+    destroy(): void;
 }
 import { Renderer } from "./renderer/Renderer.js";
 import { Planet } from "./scene/Planet.js";

package/types/ImageCanvas.d.ts

@@ -37,6 +37,11 @@ export class ImageCanvas {
      * @public
      */
     public fillEmpty(): void;
+    /**
+     * Fills canvas RGBA with color.
+     * @public
+     */
+    public fill(c: any): void;
     /**
      * Gets canvas pixels RGBA data.
      * @public

package/types/bv/Box.d.ts

@@ -21,7 +21,7 @@ export class Box {
      */
     setFromBoundsArr(bounds: Array<number>): void;
     /**
-     * Sets bounding box coordiantes by ellipsoid geodetic extend.
+     * Sets bounding box coordinates by ellipsoid geodetic extend.
      * @param {Ellipsoid} ellipsoid - Ellipsoid.
      * @param {Extent} extent - Geodetic extent.
      */

package/types/bv/Sphere.d.ts

@@ -2,7 +2,7 @@
  * Bounding sphere class.
  * @class
  * @param {Number} [radius] - Bounding sphere radius.
- * @param {Vec3} [center] - Bounding sphere coordiantes.
+ * @param {Vec3} [center] - Bounding sphere coordinates.
  */
 export class Sphere {
     /**
@@ -18,7 +18,7 @@ export class Sphere {
      */
     public radius: number;
     /**
-     * Sphere coordiantes.
+     * Sphere coordinates.
      * @public
      * @type {Vec3}
      */
@@ -29,7 +29,7 @@ export class Sphere {
      */
     setFromBounds(bounds: Array<number>): void;
     /**
-     * Sets bounding sphere coordiantes by ellipsoid geodetic extend.
+     * Sets bounding sphere coordinates by ellipsoid geodetic extend.
      * @param {Ellipsoid} ellipsoid - Ellipsoid.
      * @param {Extent} extent - Geodetic extent.
      */

package/types/camera/Camera.d.ts

@@ -105,6 +105,7 @@ export class Camera {
     currentFrustumIndex: number;
     isFirstPass: boolean;
     checkMoveEnd(): void;
+    bindRenderer(renderer: any): void;
     /**
      * Camera initialization.
      * @public
@@ -225,9 +226,9 @@ export class Camera {
      */
     public unproject(x: number, y: number): Vec3;
     /**
-     * Gets projected 3d point to the 2d screen coordiantes
+     * Gets projected 3d point to the 2d screen coordinates
      * @public
-     * @param {Vec3} v - Cartesian 3d coordiantes
+     * @param {Vec3} v - Cartesian 3d coordinates
      * @returns {Vec2} - Screen point coordinates
      */
     public project(v: Vec3): Vec2;

package/types/camera/PlanetCamera.d.ts

@@ -7,9 +7,9 @@
  * @param {Object} [options.name] - Camera name.
  * @param {number} [options.viewAngle] - Camera angle of view.
  * @param {number} [options.near] - Camera near plane distance. Default is 1.0
- * @param {number} [options.far] - Camera far plane distance. Deafult is og.math.MAX
- * @param {number} [options.minAltitude] - Minimal altitude for the camera. Deafult is 5
- * @param {number} [options.maxAltitude] - Maximal altitude for the camera. Deafult is 20000000
+ * @param {number} [options.far] - Camera far plane distance. Default is og.math.MAX
+ * @param {number} [options.minAltitude] - Minimal altitude for the camera. Default is 5
+ * @param {number} [options.maxAltitude] - Maximal altitude for the camera. Default is 20000000
  * @param {Vec3} [options.eye] - Camera eye position. Default (0,0,0)
  * @param {Vec3} [options.look] - Camera look position. Default (0,0,0)
  * @param {Vec3} [options.up] - Camera eye position. Default (0,1,0)
@@ -152,7 +152,7 @@ export class PlanetCamera extends Camera {
     public flyCartesian(cartesian: Vec3, look?: Vec3, up?: Vec3, ampl?: number, completeCallback?: cameraCallback, startCallback?: cameraCallback, frameCallback?: () => void): void;
     _frameCallback: () => void;
     /**
-     * Flies to the geo coordiantes.
+     * Flies to the geo coordinates.
      * @public
      * @param {LonLat} lonlat - Finish coordinates.
      * @param {Vec3} [look] - Camera LOOK in the end of flying. Default - (0,0,0)

package/types/control/DrawingSwitcher.d.ts

@@ -0,0 +1,13 @@
+/**
+ * Activate drawing control
+ * @class
+ * @extends {Control}
+ * @param {Object} [options] - Control options.
+ */
+export class DrawingSwitcher extends Control {
+    constructor(options?: {});
+    drawingControl: DrawingControl;
+    _createMenu(): void;
+}
+import { Control } from "./Control.js";
+import { DrawingControl } from "./drawing/DrawingControl.js";

package/types/control/EarthCoordinates.d.ts

@@ -3,7 +3,7 @@
  * @class
  * @extends {og.control.Control}
  * @param {Object} [options] - Options:
- * @param {Boolean} [options.center] - Earth coordiantes by screen center otherwise mouse pointer. False is default.
+ * @param {Boolean} [options.center] - Earth coordinates by screen center otherwise mouse pointer. False is default.
  * @param {Boolean} [options.type] - Coordinates shown: 0 - is decimal degrees, 1 - degrees, 2 - mercator geodetic coordinates.
  */
 export class EarthCoordinates {

package/types/control/Lighting.d.ts

@@ -21,14 +21,14 @@ export class Lighting extends Control {
     _specular_b: Slider;
     _shininess: Slider;
     bindLayer(layer: any): void;
-    $atmosphereOpacity: Element;
-    $gamma: Element;
-    $exposure: Element;
-    $opacity: Element;
-    $diffuse: Element;
-    $ambient: Element;
-    $specular: Element;
-    $night: Element;
+    $atmosphereOpacity: any;
+    $gamma: any;
+    $exposure: any;
+    $opacity: any;
+    $diffuse: any;
+    $ambient: any;
+    $specular: any;
+    $night: any;
     _update(): void;
     _fetchLayers(): void;
     _onLayerAdd(e: any): void;

package/types/control/drawing/DrawingControl.d.ts

@@ -0,0 +1,14 @@
+/**
+ * Activate drawing
+ * @class
+ * @extends {Control}
+ * @param {Object} [options] - Control options.
+ */
+export class DrawingControl extends Control {
+    constructor(options?: {});
+    _drawingScene: LineStringDrawingScene;
+    activatePolygonDrawing(): void;
+    activateLineStringDrawing(): void;
+}
+import { Control } from "../Control.js";
+import { LineStringDrawingScene } from "./LineStringDrawingScene.js";

package/types/control/drawing/LineStringDrawingScene.d.ts

@@ -0,0 +1,5 @@
+export class LineStringDrawingScene extends PolygonDrawingScene {
+    constructor(props: any);
+    _moveCorner(indexCurrent: any, indexPrev: any, indexCenter: any): void;
+}
+import { PolygonDrawingScene } from "./PolygonDrawingScene.js";

package/types/control/drawing/PolygonDrawingScene.d.ts

@@ -0,0 +1,99 @@
+export const NUM_SEGMENTS: 200;
+export const OUTLINE_ALT: 0.3;
+export const COORDINATES_COLOR: "rgb(350, 350, 0)";
+export const CENTER_COLOR: "rgb(0, 350, 50)";
+export const OUTLINE_COLOR: "rgb(0, 350, 50)";
+export const OUTLINE_THICKNESS: 3.5;
+export namespace CORNER_OPTIONS {
+    export const scale: number;
+    export const instanced: boolean;
+    export const tag: string;
+    export { COORDINATES_COLOR as color };
+    export { POINTER_OBJ3D as object3d };
+}
+export namespace CENTER_OPTIONS {
+    const scale_1: number;
+    export { scale_1 as scale };
+    const instanced_1: boolean;
+    export { instanced_1 as instanced };
+    const tag_1: string;
+    export { tag_1 as tag };
+    export { CENTER_COLOR as color };
+    export { POINTER_OBJ3D as object3d };
+}
+export namespace OUTLINE_OPTIONS {
+    export { OUTLINE_THICKNESS as thickness };
+    export { OUTLINE_COLOR as color };
+}
+declare const POINTER_OBJ3D: Object3d;
+export class PolygonDrawingScene extends RenderNode {
+    constructor(options?: {});
+    _planet: any;
+    _initCoordinates: any;
+    _pickedCorner: any;
+    _pickedCenter: any;
+    _startPos: any;
+    _startClick: Vec2;
+    _geometryLayer: Vector;
+    _cornerLayer: Vector;
+    _centerLayer: Vector;
+    _outlineLayer: Vector;
+    _ghostCorner: Entity;
+    _ghostOutlineLayer: Vector;
+    _showGhostPointer: boolean;
+    _isStartPoint: boolean;
+    _insertCornerIndex: number;
+    get geometryType(): string;
+    getCoordinates(): any;
+    bindPlanet(planet: any): void;
+    _onChange_: any;
+    _onChange(e: any): void;
+    clear(): void;
+    setCoordinates(coords: any): void;
+    stopNewPoint(): void;
+    _onMouseDblClick_: any;
+    startNewPoint(): void;
+    showGhostPointer(): void;
+    hideGhostPointer(): void;
+    setGhostPointerPosition(groundPos: any): void;
+    _onCornerMouseEnter(e: any): void;
+    _onCornerMouseLeave(e: any): void;
+    _onCenterMouseEnter(e: any): void;
+    _onCenterMouseLeave(e: any): void;
+    _onLup(e: any): void;
+    _getLdown(e: any): any;
+    _onCornerLdown(e: any): void;
+    _onCenterLdown(e: any): void;
+    _onMouseMove(e: any): void;
+    _onCornerLdblclick(e: any): void;
+    _cornerDblClick: boolean;
+    _onMouseDblClick(e: any): void;
+    _initEvents(): void;
+    _onCornerLdblclick_: any;
+    _onCornerLdown_: any;
+    _onCenterLdown_: any;
+    _onLup_: any;
+    _onMouseMove_: any;
+    _onCornerMouseEnter_: any;
+    _onCornerMouseLeave_: any;
+    _onCenterMouseEnter_: any;
+    _onCenterMouseLeave_: any;
+    _clearEvents(): void;
+    _drawCorners(): void;
+    _drawCenters(): void;
+    _drawGhostCorner(): void;
+    _checkTerrainCollision(entity: any): void;
+    _moveCenterPoint(): void;
+    _addNew(cart: any): void;
+    _appendCart(cart: any): void;
+    _clearGhostPointer(): void;
+    _moveCornerPoint(e: any): void;
+    _updateGhostOutlinePointer(groundPos: any): void;
+    _initGhostLayerPointer(): void;
+}
+import { Object3d } from '../../Object3d.js';
+import { RenderNode } from '../../scene/RenderNode.js';
+import { Vec2 } from '../../math/Vec2.js';
+import { Vector } from '../../layer/Vector.js';
+import { Entity } from '../../entity/Entity.js';
+export {};

package/types/control/index.d.ts

@@ -22,4 +22,6 @@ import { SimpleSkyBackground } from "./SimpleSkyBackground.js";
 import { Selection } from "./selection/Selection.js";
 import { LayerAnimation } from "./LayerAnimation.js";
 import { TimelineControl } from "./timeline/TimelineControl.js";
-export { Control, CompassButton, DebugInfo, EarthNavigation, EarthCoordinates, GeoImageDragControl, KeyboardNavigation, LayerSwitcher, MouseNavigation, ToggleWireframe, TouchNavigation, SimpleNavigation, ShowFps, ScaleControl, Sun, ZoomControl, MouseWheelZoomControl, Lighting, Ruler, HeightRuler, SimpleSkyBackground, Selection, LayerAnimation, TimelineControl };
+import { DrawingSwitcher } from "./DrawingSwitcher.js";
+import { DrawingControl } from "./drawing/DrawingControl.js";
+export { Control, CompassButton, DebugInfo, EarthNavigation, EarthCoordinates, GeoImageDragControl, KeyboardNavigation, LayerSwitcher, MouseNavigation, ToggleWireframe, TouchNavigation, SimpleNavigation, ShowFps, ScaleControl, Sun, ZoomControl, MouseWheelZoomControl, Lighting, Ruler, HeightRuler, SimpleSkyBackground, Selection, LayerAnimation, TimelineControl, DrawingSwitcher, DrawingControl };

package/types/control/ruler/RulerScene.d.ts

@@ -17,7 +17,6 @@ export class RulerScene extends RenderNode {
     bindPlanet(planet: any): void;
     _createCorners(): void;
     _cornerEntity: Entity[];
-    init(): void;
     _propsLabel: Entity;
     _trackEntity: Entity;
     _activate(): void;

package/types/control/selection/SelectionScene.d.ts

@@ -13,7 +13,6 @@ export class SelectionScene extends RenderNode {
     _cornersLayer: Vector;
     set ignoreTerrain(arg: any);
     bindPlanet(planet: any): void;
-    init(): void;
     _activate(): void;
     _onMouseMove_: any;
     _onMouseLdown_: any;