@progress/kendo-charts 1.22.0 → 1.23.0-dev.202201170838

package/dist/es2015/map/layers/tile.js

@@ -0,0 +1,465 @@
+import {
+    geometry as g,
+    throttle
+} from '@progress/kendo-drawing';
+
+import {
+    Class,
+    addClass,
+    deepExtend,
+    round,
+    limitValue,
+    hashKey,
+    setDefaultOptions
+} from '../../common';
+
+import { removeChildren } from '../utils';
+
+import { Layer } from './layer';
+
+import TemplateService from '../../services/template-service';
+
+let math = Math,
+    template = TemplateService.compile,
+    Point = g.Point;
+
+function roundPoint(point) {
+    return new Point(round(point.x), round(point.y));
+}
+
+function renderSize(size) {
+    let newSize = size;
+
+    if (typeof(size) !== "string") {
+        newSize += "px";
+    }
+
+    return newSize;
+}
+
+export class TileLayer extends Layer {
+    constructor(map, options) {
+        super(map, options);
+
+        if (typeof this.options.subdomains === 'string') {
+            this.options.subdomains = this.options.subdomains.split('');
+        }
+
+        let viewType = this._viewType();
+        this._view = new viewType(this.element, this.options);
+    }
+
+    destroy() {
+        super.destroy();
+        this._view.destroy();
+        this._view = null;
+    }
+
+    _beforeReset() {
+        let map = this.map;
+        let origin = map.locationToLayer(map.extent().nw).round();
+        this._view.viewOrigin(origin);
+    }
+
+    _reset() {
+        super._reset();
+        this._updateView();
+        this._view.reset();
+    }
+
+    _viewType() {
+        return TileView;
+    }
+
+    _activate() {
+        super._activate();
+
+        if (!this.support.mobileOS) {
+            if (!this._pan) {
+                this._pan = throttle(this._render.bind(this), 100);
+            }
+
+            this.map.bind('pan', this._pan);
+        }
+    }
+
+    _deactivate() {
+        super._deactivate();
+
+        if (this._pan) {
+            this.map.unbind('pan', this._pan);
+        }
+    }
+
+    _updateView() {
+        let view = this._view,
+            map = this.map,
+            extent = map.extent(),
+            extentToPoint = {
+                nw: map.locationToLayer(extent.nw).round(),
+                se: map.locationToLayer(extent.se).round()
+            };
+
+        view.center(map.locationToLayer(map.center()));
+        view.extent(extentToPoint);
+        view.zoom(map.zoom());
+    }
+
+    _resize() {
+        this._render();
+    }
+
+    _panEnd(e) {
+        super._panEnd(e);
+        this._render();
+    }
+
+    _render() {
+        this._updateView();
+        this._view.render();
+    }
+}
+
+setDefaultOptions(TileLayer, {
+    tileSize: 256,
+    subdomains: ['a', 'b', 'c'],
+    urlTemplate: '',
+    zIndex: 1
+});
+
+export class TileView extends Class {
+    constructor(element, options) {
+        super();
+        this.element = element;
+        this._initOptions(options);
+        this.pool = new TilePool();
+    }
+
+    _initOptions(options) {
+        this.options = deepExtend({}, this.options, options);
+    }
+
+    center(center) {
+        this._center = center;
+    }
+
+    extent(extent) {
+        this._extent = extent;
+    }
+
+    viewOrigin(origin) {
+        this._viewOrigin = origin;
+    }
+
+    zoom(zoom) {
+        this._zoom = zoom;
+    }
+
+    pointToTileIndex(point) {
+        return new Point(math.floor(point.x / this.options.tileSize), math.floor(point.y / this.options.tileSize));
+    }
+
+    tileCount() {
+        let size = this.size(),
+            firstTileIndex = this.pointToTileIndex(this._extent.nw),
+            nw = this._extent.nw,
+            point = this.indexToPoint(firstTileIndex).translate(-nw.x, -nw.y);
+
+        return {
+            x: math.ceil((math.abs(point.x) + size.width) / this.options.tileSize),
+            y: math.ceil((math.abs(point.y) + size.height) / this.options.tileSize)
+        };
+    }
+
+    size() {
+        let nw = this._extent.nw,
+            se = this._extent.se,
+            diff = se.clone().translate(-nw.x, -nw.y);
+
+        return {
+            width: diff.x,
+            height: diff.y
+        };
+    }
+
+    indexToPoint(index) {
+        let x = index.x,
+            y = index.y;
+
+        return new Point(x * this.options.tileSize, y * this.options.tileSize);
+    }
+
+    subdomainText() {
+        let subdomains = this.options.subdomains;
+        return subdomains[this.subdomainIndex++ % subdomains.length];
+    }
+
+    destroy() {
+        removeChildren(this.element);
+        this.pool.empty();
+    }
+
+    reset() {
+        this.pool.reset();
+        this.subdomainIndex = 0;
+        this.render();
+    }
+
+    render() {
+        let size = this.tileCount(),
+            firstTileIndex = this.pointToTileIndex(this._extent.nw),
+            tile, x, y;
+
+        for (x = 0; x < size.x; x++) {
+            for (y = 0; y < size.y; y++) {
+                tile = this.createTile({
+                    x: firstTileIndex.x + x,
+                    y: firstTileIndex.y + y
+                });
+
+                if (!tile.visible) {
+                    tile.show();
+                }
+            }
+        }
+    }
+
+    createTile(currentIndex) {
+        let options = this.tileOptions(currentIndex);
+        let tile = this.pool.get(this._center, options);
+
+        if (!tile.element.parentNode) {
+            this.element.append(tile.element);
+        }
+
+        return tile;
+    }
+
+    tileOptions(currentIndex) {
+        let index = this.wrapIndex(currentIndex),
+            point = this.indexToPoint(currentIndex),
+            origin = this._viewOrigin,
+            offset = point.clone().translate(-origin.x, -origin.y);
+
+        return {
+            index: index,
+            currentIndex: currentIndex,
+            point: point,
+            offset: roundPoint(offset),
+            zoom: this._zoom,
+            size: this.options.tileSize,
+            subdomain: this.subdomainText(),
+            urlTemplate: this.options.urlTemplate,
+            errorUrlTemplate: this.options.errorUrlTemplate
+        };
+    }
+
+    wrapIndex(index) {
+        let boundary = math.pow(2, this._zoom);
+
+        return {
+            x: this.wrapValue(index.x, boundary),
+            y: limitValue(index.y, 0, boundary - 1)
+        };
+    }
+
+    wrapValue(value, boundary) {
+        let remainder = math.abs(value) % boundary;
+        let wrappedValue = value;
+
+        if (value >= 0) {
+            wrappedValue = remainder;
+        } else {
+            wrappedValue = boundary - (remainder === 0 ? boundary : remainder);
+        }
+
+        return wrappedValue;
+    }
+}
+
+export class ImageTile extends Class {
+    constructor(id, options) {
+        super();
+        this.id = id;
+        this.visible = true;
+        this._initOptions(options);
+        this.createElement();
+        this.show();
+    }
+
+    destroy() {
+        const element = this.element;
+        const parentNode = element ? element.parentNode : null;
+
+        if (element) {
+            if (parentNode) {
+                parentNode.removeChild(element);
+            }
+
+            this.element = null;
+        }
+    }
+
+    _initOptions(options) {
+        this.options = deepExtend({}, this.options, options);
+    }
+
+    createElement() {
+        let el = document.createElement("img");
+        addClass(el, "k-layer");
+        el.style.position = "absolute";
+        el.style.display = "block";
+        el.style.width = this.options.size;
+        el.style.height = this.options.size;
+
+        this.element = el;
+
+        // todo
+        // add on error handler
+
+        // this.element =
+        // $('<img style=\'position: absolute; display: block;\' alt=\'\' />')
+        // .css({
+        //     width: this.options.size,
+        //     height: this.options.size
+        // })
+        // .on('error', proxy(function(e) {
+        //     if (this.errorUrl()) {
+        //         e.target.setAttribute('src', this.errorUrl());
+        //     } else {
+        //         e.target.removeAttribute('src');
+        //     }
+        // }, this));
+    }
+
+    show() {
+        let element = this.element;
+        element.style.top = renderSize(this.options.offset.y);
+        element.style.left = renderSize(this.options.offset.x);
+
+        let url = this.url();
+
+        if (url) {
+            element.setAttribute('src', url);
+        }
+
+        element.style.visibility = 'visible';
+        this.visible = true;
+    }
+
+    hide() {
+        this.element.style.visibility = 'hidden';
+        this.visible = false;
+    }
+
+    url() {
+        let urlResult = template(this.options.urlTemplate);
+        return urlResult(this.urlOptions());
+    }
+
+    errorUrl() {
+        let urlResult = template(this.options.errorUrlTemplate);
+        return urlResult(this.urlOptions());
+    }
+
+    urlOptions() {
+        let options = this.options;
+
+        return {
+            zoom: options.zoom,
+            subdomain: options.subdomain,
+            z: options.zoom,
+            x: options.index.x,
+            y: options.index.y,
+            s: options.subdomain,
+            quadkey: options.quadkey,
+            q: options.quadkey,
+            culture: options.culture,
+            c: options.culture
+        };
+    }
+}
+
+setDefaultOptions(ImageTile, {
+    urlTemplate: '',
+    errorUrlTemplate: ''
+});
+
+export class TilePool extends Class {
+    constructor() {
+        super();
+        this._items = [];
+    }
+
+    get(center, options) {
+        if (this._items.length >= this.options.maxSize) {
+            this._remove(center);
+        }
+
+        return this._create(options);
+    }
+
+    empty() {
+        let items = this._items;
+
+        for (let i = 0; i < items.length; i++) {
+            items[i].destroy();
+        }
+
+        this._items = [];
+    }
+
+    reset() {
+        let items = this._items;
+
+        for (let i = 0; i < items.length; i++) {
+            items[i].hide();
+        }
+    }
+
+    _create(options) {
+        let items = this._items;
+        let tile;
+        let id = hashKey(options.point.toString() + options.offset.toString() + options.zoom + options.urlTemplate);
+
+        for (let i = 0; i < items.length; i++) {
+            if (items[i].id === id) {
+                tile = items[i];
+                break;
+            }
+        }
+
+        if (tile) {
+            tile.show();
+        } else {
+            tile = new ImageTile(id, options);
+            this._items.push(tile);
+        }
+
+        return tile;
+    }
+
+    _remove(center) {
+        let items = this._items;
+        let maxDist = -1;
+        let index = -1;
+
+        for (let i = 0; i < items.length; i++) {
+            let dist = items[i].options.point.distanceTo(center);
+
+            if (dist > maxDist && !items[i].visible) {
+                index = i;
+                maxDist = dist;
+            }
+        }
+
+        if (index !== -1) {
+            items[index].destroy();
+            items.splice(index, 1);
+        }
+    }
+}
+
+setDefaultOptions(TilePool, {
+    maxSize: 100
+});

package/dist/es2015/map/location.js

@@ -0,0 +1,193 @@
+import {
+    Class,
+    deepExtend,
+    deg,
+    rad,
+    round,
+    defined
+} from '../common';
+
+import {
+    datums
+} from './datums';
+
+function toSquare(value) {
+    return value * value;
+}
+
+
+let math = Math,
+    abs = math.abs,
+    atan = math.atan,
+    atan2 = math.atan2,
+    cos = math.cos,
+    sin = math.sin,
+    tan = math.tan;
+
+export class Location extends Class {
+    constructor(lat, lng) {
+        super();
+
+        this.initProperties();
+
+        if (arguments.length === 1) {
+            this.lat = lat[0];
+            this.lng = lat[1];
+        } else {
+            this.lat = lat;
+            this.lng = lng;
+        }
+    }
+
+    initProperties() {
+        deepExtend(this, {
+            DISTANCE_ITERATIONS: 100,
+            DISTANCE_CONVERGENCE: 1e-12,
+            DISTANCE_PRECISION: 2,
+            FORMAT: '{0:N6}{1:N6}'
+        });
+    }
+
+    toArray() {
+        return [
+            this.lat,
+            this.lng
+        ];
+    }
+
+    equals(loc) {
+        return loc && loc.lat === this.lat && loc.lng === this.lng;
+    }
+
+    clone() {
+        return new Location(this.lat, this.lng);
+    }
+
+    round(precision) {
+        this.lng = round(this.lng, precision);
+        this.lat = round(this.lat, precision);
+        return this;
+    }
+
+    wrap() {
+        this.lng = this.lng % 180;
+        this.lat = this.lat % 90;
+        return this;
+    }
+
+    distanceTo(dest, datum) {
+        return this.greatCircleTo(dest, datum).distance;
+    }
+
+    destination(distance, initialBearing, initialDatum) {
+        let bearing = rad(initialBearing);
+        let datum = initialDatum || datums.WGS84;
+        let fromLat = rad(this.lat);
+        let fromLng = rad(this.lng);
+        let dToR = distance / datum.a;
+        let lat = math.asin(sin(fromLat) * cos(dToR) + cos(fromLat) * sin(dToR) * cos(bearing));
+        let lng = fromLng + atan2(sin(bearing) * sin(dToR) * cos(fromLat), cos(dToR) - sin(fromLat) * sin(lat));
+
+        return new Location(deg(lat), deg(lng));
+    }
+
+    greatCircleTo(initialDest, initialDatum) {
+        let dest = Location.create(dest);
+        let datum = initialDatum || datums.WGS84;
+
+        if (!dest || this.clone().round(8).equals(dest.clone().round(8))) {
+            return {
+                distance: 0,
+                azimuthFrom: 0,
+                azimuthTo: 0
+            };
+        }
+
+        // See http://en.wikipedia.org/wiki/Vincenty's_formulae#Notation
+        // o == sigma
+        // A == alpha
+
+        let a = datum.a;
+        let b = datum.b;
+        let f = datum.f;
+        let L = rad(dest.lng - this.lng);
+        let U1 = atan((1 - f) * tan(rad(this.lat)));
+        let sinU1 = sin(U1);
+        let cosU1 = cos(U1);
+        let U2 = atan((1 - f) * tan(rad(dest.lat)));
+        let sinU2 = sin(U2);
+        let cosU2 = cos(U2);
+        let lambda = L;
+        let prevLambda;
+        let i = this.DISTANCE_ITERATIONS;
+        let converged = false;
+        let sinLambda;
+        let cosLambda;
+        let sino;
+        let cosA2;
+        let coso;
+        let cos2om;
+        let sigma;
+
+        while (!converged && i-- > 0) {
+            sinLambda = sin(lambda);
+            cosLambda = cos(lambda);
+            sino = math.sqrt(toSquare(cosU2 * sinLambda) + toSquare(cosU1 * sinU2 - sinU1 * cosU2 * cosLambda));
+            coso = sinU1 * sinU2 + cosU1 * cosU2 * cosLambda;
+            sigma = atan2(sino, coso);
+
+            let sinA = cosU1 * cosU2 * sinLambda / sino;
+            cosA2 = 1 - toSquare(sinA);
+            cos2om = 0;
+
+            if (cosA2 !== 0) {
+                cos2om = coso - 2 * sinU1 * sinU2 / cosA2;
+            }
+
+            prevLambda = lambda;
+            let C = f / 16 * cosA2 * (4 + f * (4 - 3 * cosA2));
+            lambda = L + (1 - C) * f * sinA * (sigma + C * sino * (cos2om + C * coso * (-1 + 2 * toSquare(cos2om))));
+            converged = abs(lambda - prevLambda) <= this.DISTANCE_CONVERGENCE;
+        }
+
+        let u2 = cosA2 * (toSquare(a) - toSquare(b)) / toSquare(b);
+        let A = 1 + u2 / 16384 * (4096 + u2 * (-768 + u2 * (320 - 175 * u2)));
+        let B = u2 / 1024 * (256 + u2 * (-128 + u2 * (74 - 47 * u2)));
+        let deltao = B * sino * (cos2om + B / 4 * (coso * (-1 + 2 * toSquare(cos2om)) - B / 6 * cos2om * (-3 + 4 * toSquare(sino)) * (-3 + 4 * toSquare(cos2om))));
+
+        let azimuthFrom = atan2(cosU2 * sinLambda, cosU1 * sinU2 - sinU1 * cosU2 * cosLambda);
+        let azimuthTo = atan2(cosU1 * sinLambda, -sinU1 * cosU2 + cosU1 * sinU2 * cosLambda);
+
+        return {
+            distance: round(b * A * (sigma - deltao), this.DISTANCE_PRECISION),
+            azimuthFrom: deg(azimuthFrom),
+            azimuthTo: deg(azimuthTo)
+        };
+    }
+
+    // IE < 9 doesn't allow to override toString on definition
+    toString() {
+        // return kendo.format(this.FORMAT, this.lat, this.lng);
+        return String(this.lat) + "," + String(this.lng);
+    }
+
+    static fromLngLat(lngAndLat) {
+        return new Location(lngAndLat[1], lngAndLat[0]);
+    }
+
+    static fromLatLng(lngAndLat) {
+        return new Location(lngAndLat[0], lngAndLat[1]);
+    }
+
+    static create(a, b) {
+        if (defined(a)) {
+            if (a instanceof Location) {
+                return a.clone();
+            } else if (arguments.length === 1 && a.length === 2) {
+                return Location.fromLatLng(a);
+            }
+
+            return new Location(a, b);
+        }
+    }
+}