@syncfusion/ej2-maps 25.1.37 → 25.1.40

package/src/maps/layers/layer-panel.js

@@ -217,7 +217,7 @@ var LayerPanel = /** @class */ (function () {
         if (panel.mapObject.markerModule) {
             panel.mapObject.markerModule.markerRender(this.mapObject, panel.layerObject, layerIndex, panel.mapObject.tileZoomLevel, null);
         }
-        panel.translateLayerElements(panel.layerObject, layerIndex);
+        panel.translateLayerElements(panel.layerObject);
         panel.layerGroup.appendChild(panel.layerObject);
     };
     LayerPanel.prototype.processLayers = function (layer, layerIndex) {
@@ -245,6 +245,7 @@ var LayerPanel = /** @class */ (function () {
             cancel: false, name: layerRendering, index: layerIndex,
             layer: layer, maps: this.mapObject, visible: layer.visible
         };
+        // eslint-disable-next-line @typescript-eslint/no-unused-vars
         this.mapObject.trigger('layerRendering', eventArgs, function (observedArgs) {
             if (!eventArgs.cancel && eventArgs.visible) {
                 if (layer.layerType === 'OSM') {
@@ -371,9 +372,8 @@ var LayerPanel = /** @class */ (function () {
         }
         this.rectBounds = null;
         var shapeSettings = this.currentLayer.shapeSettings;
-        var bubbleSettings = this.currentLayer.bubbleSettings;
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        Array.prototype.forEach.call(renderData, function (geometryData, index) {
+        Array.prototype.forEach.call(renderData, function (geometryData) {
             if (!isNullOrUndefined(geometryData['geometry']) || !isNullOrUndefined(geometryData['coordinates'])) {
                 var type = !isNullOrUndefined(geometryData['geometry']) ? geometryData['geometry']['type'] : geometryData['type'];
                 // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -411,12 +411,9 @@ var LayerPanel = /** @class */ (function () {
                 // eslint-disable-next-line @typescript-eslint/no-explicit-any
                 var currentShapeData = this_1.currentLayer.layerData[i];
                 var pathOptions;
-                var polyLineOptions = void 0;
                 var circleOptions;
                 var groupElement;
-                var drawObject = void 0;
                 var path = '';
-                var points = '';
                 var fill = (shapeSettings.autofill) ? colors[i % colors.length] :
                     (shapeSettings.fill || this_1.mapObject.themeStyle.shapeFill);
                 if (shapeSettings.colorValuePath !== null && !isNullOrUndefined(currentShapeData['property'])) {
@@ -583,7 +580,7 @@ var LayerPanel = /** @class */ (function () {
                                 var circleRadius = (_this.mapObject.layers[layerIndex].type !== 'SubLayer') ? shapeSettings.circleRadius : shapeSettings.circleRadius / (_this.mapObject.isTileMap ? _this.mapObject.scale : _this.currentFactor);
                                 circleOptions = new CircleOption((shapeID + '_multiLine_' + index), eventArgs.fill, eventArgs.border, opacity, pointData['x'], pointData['y'], circleRadius, shapeSettings.dashArray);
                                 pathEle = _this.mapObject.renderer.drawCircle(circleOptions);
-                                _this.pathAttributeCalculate(groupElement, pathEle, drawingType, currentShapeData, i);
+                                _this.pathAttributeCalculate(groupElement, pathEle, drawingType, currentShapeData);
                             });
                             break;
                         case 'Path':
@@ -593,7 +590,7 @@ var LayerPanel = /** @class */ (function () {
                             break;
                     }
                     if (!isNullOrUndefined(pathEle) && drawingType !== 'MultiPoint') {
-                        _this.pathAttributeCalculate(groupElement, pathEle, drawingType, currentShapeData, i);
+                        _this.pathAttributeCalculate(groupElement, pathEle, drawingType, currentShapeData);
                     }
                     if (i === _this.currentLayer.layerData.length - 1) {
                         _this.layerFeatures(layerIndex, colors, renderData, labelTemplateEle);
@@ -618,12 +615,11 @@ var LayerPanel = /** @class */ (function () {
      * @param {Element} pathEle - Specifies the svg element.
      * @param {string} drawingType - Specifies the data type.
      * @param {any} currentShapeData - Specifies the layer of shapedata.
-     * @param {number} index - Specifies the tab index.
      * @returns {void}
      */
     LayerPanel.prototype.pathAttributeCalculate = function (groupElement, pathEle, drawingType, 
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    currentShapeData, index) {
+    currentShapeData) {
         var property = (Object.prototype.toString.call(this.currentLayer.shapePropertyPath) === '[object Array]' ?
             this.currentLayer.shapePropertyPath : [this.currentLayer.shapePropertyPath]);
         var properties;
@@ -667,7 +663,7 @@ var LayerPanel = /** @class */ (function () {
      *
      * @param {number} layerIndex - Specifies the layer index
      * @param {string[]} colors - Specifies the colors
-     * @param {Object[]} renderData - Specifies the render data
+     * @param {any[]} renderData - Specifies the render data
      * @param {HTMLElement} labelTemplateEle - Specifies the label template element
      * @returns {void}
      */
@@ -677,7 +673,8 @@ var LayerPanel = /** @class */ (function () {
         var _this = this;
         var bubbleG;
         if (this.mapObject.polygonModule) {
-            this.groupElements.push(this.mapObject.polygonModule.polygonRender(this.mapObject, layerIndex, (this.mapObject.isTileMap ? Math.floor(this.currentFactor) : this.currentFactor)));
+            this.groupElements.push(this.mapObject.polygonModule.polygonRender(this.mapObject, layerIndex, (this.mapObject.isTileMap ? Math.floor(this.currentFactor)
+                : this.currentFactor)));
         }
         if (this.currentLayer.bubbleSettings.length && this.mapObject.bubbleModule) {
             var length_1 = this.currentLayer.bubbleSettings.length;
@@ -691,7 +688,6 @@ var LayerPanel = /** @class */ (function () {
                 this_2.bubbleCalculation(bubble_1, range);
                 // eslint-disable-next-line @typescript-eslint/no-explicit-any
                 var bubbleDataSource = bubble_1.dataSource;
-                // eslint-disable-next-line @typescript-eslint/no-explicit-any
                 this_2.mapObject.bubbleModule.bubbleCollection = [];
                 bubbleDataSource.map(function (bubbleData, i) {
                     _this.renderBubble(_this.currentLayer, bubbleData, colors[i % colors.length], range, j, i, bubbleG, layerIndex, bubble_1);
@@ -729,7 +725,7 @@ var LayerPanel = /** @class */ (function () {
             this.mapObject.markerModule.markerRender(this.mapObject, this.layerObject, layerIndex, (this.mapObject.isTileMap ? Math.floor(this.currentFactor) :
                 this.currentFactor), null);
         }
-        this.translateLayerElements(this.layerObject, layerIndex);
+        this.translateLayerElements(this.layerObject);
         this.layerGroup.appendChild(this.layerObject);
     };
     /**
@@ -778,6 +774,8 @@ var LayerPanel = /** @class */ (function () {
      * @param {object} bubbleData - Specifies the bubble data
      * @param {string} color - Specifies the color
      * @param {number} range - Specifies the range
+     * @param {number} range.min - Specifies the minimum range
+     * @param {number} range.max - Specifies the maximum range
      * @param {number} bubbleIndex - Specifies the bubble index
      * @param {number} dataIndex - Specifies the data index
      * @param {number} group - Specifies the group
@@ -800,9 +798,9 @@ var LayerPanel = /** @class */ (function () {
      * To get the shape color from color mapping module
      *
      * @param {LayerSettingsModel} layer - Specifies the layer
-     * @param {object} shape - Specifies the shape
+     * @param {any} shape - Specifies the shape
      * @param {string} color - Specifies the color
-     * @returns {Object} - Returns the object
+     * @returns {any} - Returns the object
      */
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
     LayerPanel.prototype.getShapeColorMapping = function (layer, shape, color) {
@@ -828,7 +826,7 @@ var LayerPanel = /** @class */ (function () {
         switch (type.toLowerCase()) {
             case 'polygon':
                 // eslint-disable-next-line @typescript-eslint/no-explicit-any
-                newData = this.calculatePolygonBox(coordinates[0], data, properties);
+                newData = this.calculatePolygonBox(coordinates[0]);
                 if (newData.length > 0) {
                     newData['property'] = properties;
                     newData['type'] = type;
@@ -842,7 +840,7 @@ var LayerPanel = /** @class */ (function () {
                 for (var i = 0; i < coordinates.length; i++) {
                     for (var j = 0; j < coordinates[i].length; j++) {
                         // eslint-disable-next-line @typescript-eslint/no-explicit-any
-                        newData = this.calculatePolygonBox(coordinates[i][j], data, properties);
+                        newData = this.calculatePolygonBox(coordinates[i][j]);
                         if (newData.length > 0) {
                             multiPolygonDatas.push(newData);
                         }
@@ -986,7 +984,7 @@ var LayerPanel = /** @class */ (function () {
         }
         return (Math.min(verFactor, horFactor));
     };
-    LayerPanel.prototype.translateLayerElements = function (layerElement, index) {
+    LayerPanel.prototype.translateLayerElements = function (layerElement) {
         var childNode;
         this.mapObject.translateType = 'layer';
         if (!isNullOrUndefined(this.mapObject.baseMapRectBounds)) {
@@ -1047,7 +1045,7 @@ var LayerPanel = /** @class */ (function () {
     LayerPanel.prototype.calculateRectBounds = function (layerData) {
         var _this = this;
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        Array.prototype.forEach.call(layerData, function (obj, index) {
+        Array.prototype.forEach.call(layerData, function (obj) {
             if (!isNullOrUndefined(obj['geometry']) || !isNullOrUndefined(obj['coordinates'])) {
                 var type = !isNullOrUndefined(obj['geometry']) ? obj['geometry']['type'] : obj['type'];
                 // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -1059,13 +1057,13 @@ var LayerPanel = /** @class */ (function () {
                         break;
                     case 'multipolygon':
                         // eslint-disable-next-line @typescript-eslint/no-explicit-any
-                        coordinates.map(function (point, index) {
+                        coordinates.map(function (point) {
                             _this.calculateRectBox(point[0]);
                         });
                         break;
                     case 'multilinestring':
                         // eslint-disable-next-line @typescript-eslint/no-explicit-any
-                        coordinates.map(function (multiPoint, index) {
+                        coordinates.map(function (multiPoint) {
                             // eslint-disable-next-line @typescript-eslint/no-explicit-any
                             multiPoint.map(function (point, index) {
                                 _this.calculateRectBox(point, 'multilinestring', index === 0 ? true : false);
@@ -1092,7 +1090,7 @@ var LayerPanel = /** @class */ (function () {
         });
     };
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    LayerPanel.prototype.calculatePolygonBox = function (coordinates, data, properties) {
+    LayerPanel.prototype.calculatePolygonBox = function (coordinates) {
         var _this = this;
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
         var newData = [];
@@ -1247,121 +1245,126 @@ var LayerPanel = /** @class */ (function () {
     };
     LayerPanel.prototype.arrangeTiles = function (type, x, y) {
         var _this = this;
-        var element = document.getElementById(this.mapObject.element.id + '_tile_parent');
-        var element1 = document.getElementById(this.mapObject.element.id + '_tiles');
         var timeOut;
         if (!isNullOrUndefined(type) && type !== 'Pan') {
             this.tileAnimation(type, x, y);
             timeOut = animationMode === 'Disable' ? 0 : (this.mapObject.layersCollection[0].animationDuration === 0 &&
                 animationMode === 'Enable') ? 1000 : this.mapObject.layersCollection[0].animationDuration;
         }
-        else {
-            timeOut = 0;
-        }
         if (this.mapObject.layers[this.mapObject.baseLayerIndex].layerType === 'GoogleStaticMap') {
             this.renderGoogleMap(this.mapObject.layers[0].key, this.mapObject.staticMapZoom);
         }
         else {
-            setTimeout(function () {
-                if (element) {
-                    element.style.zIndex = '1';
-                }
-                if (element1) {
-                    element1.style.zIndex = '0';
+            if (type === 'Pan') {
+                this.arrangeTilesLayer(type);
+            }
+            else {
+                setTimeout(function () {
+                    _this.arrangeTilesLayer(type);
+                }, timeOut);
+            }
+        }
+    };
+    LayerPanel.prototype.arrangeTilesLayer = function (type) {
+        var element = document.getElementById(this.mapObject.element.id + '_tile_parent');
+        var element1 = document.getElementById(this.mapObject.element.id + '_tiles');
+        if (element) {
+            element.style.zIndex = '1';
+        }
+        if (element1) {
+            element1.style.zIndex = '0';
+        }
+        var animateElement;
+        if (!document.getElementById(this.mapObject.element.id + '_animated_tiles') && element) {
+            animateElement = createElement('div', { id: this.mapObject.element.id + '_animated_tiles' });
+            element.appendChild(animateElement);
+        }
+        else {
+            if (type !== 'Pan' && element1 && element) {
+                element1.appendChild(element.children[0]);
+                if (!this.mapObject.isAddLayer && !isNullOrUndefined(document.getElementById(this.mapObject.element.id + '_animated_tiles'))) {
+                    document.getElementById(this.mapObject.element.id + '_animated_tiles').id =
+                        this.mapObject.element.id + '_animated_tiles_old';
                 }
-                var animateElement;
-                if (!document.getElementById(_this.mapObject.element.id + '_animated_tiles') && element) {
-                    animateElement = createElement('div', { id: _this.mapObject.element.id + '_animated_tiles' });
-                    element.appendChild(animateElement);
+                animateElement = createElement('div', { id: this.mapObject.element.id + '_animated_tiles' });
+                element.appendChild(animateElement);
+            }
+            else {
+                animateElement = element ? element.children[0] : null;
+            }
+        }
+        for (var id = 0; id < this.tiles.length; id++) {
+            var tile = this.tiles[id];
+            var imgElement = null;
+            var mapId = this.mapObject.element.id;
+            if (type === 'Pan') {
+                var child = document.getElementById(mapId + '_tile_' + id);
+                var isNewTile = false;
+                if (isNullOrUndefined(child)) {
+                    isNewTile = true;
+                    child = createElement('div', { id: mapId + '_tile_' + id });
+                    imgElement = createElement('img');
                 }
                 else {
-                    if (type !== 'Pan' && element1 && element) {
-                        element1.appendChild(element.children[0]);
-                        if (!_this.mapObject.isAddLayer && !isNullOrUndefined(document.getElementById(_this.mapObject.element.id + '_animated_tiles'))) {
-                            document.getElementById(_this.mapObject.element.id + '_animated_tiles').id =
-                                _this.mapObject.element.id + '_animated_tiles_old';
-                        }
-                        animateElement = createElement('div', { id: _this.mapObject.element.id + '_animated_tiles' });
-                        element.appendChild(animateElement);
-                    }
-                    else {
-                        animateElement = element ? element.children[0] : null;
-                    }
+                    child.style.removeProperty('display');
+                    imgElement = child.children[0];
                 }
-                for (var id = 0; id < _this.tiles.length; id++) {
-                    var tile = _this.tiles[id];
-                    var imgElement = null;
-                    var mapId = _this.mapObject.element.id;
-                    if (type === 'Pan') {
-                        var child = document.getElementById(mapId + '_tile_' + id);
-                        var isNewTile = false;
-                        if (isNullOrUndefined(child)) {
-                            isNewTile = true;
-                            child = createElement('div', { id: mapId + '_tile_' + id });
-                            imgElement = createElement('img');
-                        }
-                        else {
-                            child.style.removeProperty('display');
-                            imgElement = child.children[0];
-                        }
-                        if (!isNewTile && imgElement && imgElement.src !== tile.src) {
-                            imgElement.src = tile.src;
-                        }
-                        child.style.position = 'absolute';
-                        child.style.left = tile.left + 'px';
-                        child.style.top = tile.top + 'px';
-                        child.style.height = tile.height + 'px';
-                        child.style.width = tile.width + 'px';
-                        if (isNewTile) {
-                            imgElement.setAttribute('height', '256px');
-                            imgElement.setAttribute('width', '256px');
-                            imgElement.setAttribute('src', tile.src);
-                            imgElement.setAttribute('alt', _this.mapObject.getLocalizedLabel('ImageNotFound'));
-                            imgElement.style.setProperty('user-select', 'none');
-                            child.appendChild(imgElement);
-                            animateElement.appendChild(child);
-                        }
-                    }
-                    else {
-                        imgElement = createElement('img');
-                        imgElement.setAttribute('height', '256px');
-                        imgElement.setAttribute('width', '256px');
-                        imgElement.setAttribute('src', tile.src);
-                        imgElement.style.setProperty('user-select', 'none');
-                        imgElement.setAttribute('alt', _this.mapObject.getLocalizedLabel('ImageNotFound'));
-                        var child = createElement('div', { id: mapId + '_tile_' + id });
-                        child.style.position = 'absolute';
-                        child.style.left = tile.left + 'px';
-                        child.style.top = tile.top + 'px';
-                        child.style.height = tile.height + 'px';
-                        child.style.width = tile.width + 'px';
-                        child.appendChild(imgElement);
-                        if (animateElement) {
-                            animateElement.appendChild(child);
-                        }
-                    }
-                    if (id === (_this.tiles.length - 1) && document.getElementById(_this.mapObject.element.id + '_animated_tiles_old')) {
-                        removeElement(_this.mapObject.element.id + '_animated_tiles_old');
-                    }
+                if (!isNewTile && imgElement && imgElement.src !== tile.src) {
+                    imgElement.src = tile.src;
                 }
-                if (!isNullOrUndefined(_this.mapObject.currentTiles)) {
-                    for (var l = _this.tiles.length; l < animateElement.childElementCount; l++) {
-                        var isExistingElement = false;
-                        for (var a = 0; a < _this.mapObject.currentTiles.childElementCount; a++) {
-                            if (!isExistingElement &&
-                                _this.mapObject.currentTiles.children[a].id === animateElement.children[l].id) {
-                                isExistingElement = true;
-                            }
-                        }
-                        if (isExistingElement) {
-                            animateElement.children[l].style.display = 'none';
-                        }
-                        else {
-                            animateElement.removeChild(animateElement.children[l]);
-                        }
+                child.style.position = 'absolute';
+                child.style.left = tile.left + 'px';
+                child.style.top = tile.top + 'px';
+                child.style.height = tile.height + 'px';
+                child.style.width = tile.width + 'px';
+                if (isNewTile) {
+                    imgElement.setAttribute('height', '256px');
+                    imgElement.setAttribute('width', '256px');
+                    imgElement.setAttribute('src', tile.src);
+                    imgElement.setAttribute('alt', this.mapObject.getLocalizedLabel('ImageNotFound'));
+                    imgElement.style.setProperty('user-select', 'none');
+                    child.appendChild(imgElement);
+                    animateElement.appendChild(child);
+                }
+            }
+            else {
+                imgElement = createElement('img');
+                imgElement.setAttribute('height', '256px');
+                imgElement.setAttribute('width', '256px');
+                imgElement.setAttribute('src', tile.src);
+                imgElement.style.setProperty('user-select', 'none');
+                imgElement.setAttribute('alt', this.mapObject.getLocalizedLabel('ImageNotFound'));
+                var child = createElement('div', { id: mapId + '_tile_' + id });
+                child.style.position = 'absolute';
+                child.style.left = tile.left + 'px';
+                child.style.top = tile.top + 'px';
+                child.style.height = tile.height + 'px';
+                child.style.width = tile.width + 'px';
+                child.appendChild(imgElement);
+                if (animateElement) {
+                    animateElement.appendChild(child);
+                }
+            }
+            if (id === (this.tiles.length - 1) && document.getElementById(this.mapObject.element.id + '_animated_tiles_old')) {
+                removeElement(this.mapObject.element.id + '_animated_tiles_old');
+            }
+        }
+        if (!isNullOrUndefined(this.mapObject.currentTiles)) {
+            for (var l = this.tiles.length; l < animateElement.childElementCount; l++) {
+                var isExistingElement = false;
+                for (var a = 0; a < this.mapObject.currentTiles.childElementCount; a++) {
+                    if (!isExistingElement &&
+                        this.mapObject.currentTiles.children[a].id === animateElement.children[l].id) {
+                        isExistingElement = true;
                     }
                 }
-            }, timeOut);
+                if (isExistingElement) {
+                    animateElement.children[l].style.display = 'none';
+                }
+                else {
+                    animateElement.removeChild(animateElement.children[l]);
+                }
+            }
         }
     };
     /**

package/src/maps/layers/legend.d.ts

@@ -87,9 +87,9 @@ export declare class Legend {
      * Get the legend collections
      *
      * @param {number} layerIndex - Specifies the layer index
-     * @param {object[]} layerData - Specifies the layer data
+     * @param {any[]} layerData - Specifies the layer data
      * @param {ColorMappingSettings[]} colorMapping - Specifies the color mapping
-     * @param {object[]} dataSource - Specifies the data source
+     * @param {any[]} dataSource - Specifies the data source
      * @param {string} dataPath - Specifies the data path
      * @param {string} colorValuePath - Specifies the color value path
      * @param {string | string[]} propertyPath - Specifies the property path
@@ -100,28 +100,29 @@ export declare class Legend {
     private legendTextTrim;
     /**
      * To draw the legend shape and text.
+     *
      * @private
      */
     drawLegend(): void;
     /**
-     * @param {string} page - Specifies the legend page.
+     * @param {number} page - Specifies the legend page.
      * @returns {void}
      * @private
      */
     drawLegendItem(page: number): void;
     legendHighLightAndSelection(targetElement: Element, value: string): void;
     private setColor;
-    pushCollection(targetElement: Element, collection: any[], oldElement: any, shapeSettings: ShapeSettings): void;
+    pushCollection(targetElement: Element, collection: any[], oldElement: object, shapeSettings: ShapeSettings): void;
     private removeLegend;
     removeLegendHighlightCollection(): void;
     removeLegendSelectionCollection(targetElement: Element): void;
     removeShapeHighlightCollection(): void;
-    shapeHighLightAndSelection(targetElement: Element, data: any, module: SelectionSettingsModel | HighlightSettingsModel, getValue: string, layerIndex: number): void;
+    shapeHighLightAndSelection(targetElement: Element, data: object, module: SelectionSettingsModel | HighlightSettingsModel, getValue: string, layerIndex: number): void;
     private isTargetSelected;
     private updateLegendElement;
     private getIndexofLegend;
     private removeAllSelections;
-    legendIndexOnShape(data: any, index: number): any;
+    legendIndexOnShape(data: object, index: number): any;
     private shapeDataOnLegend;
     private shapesOfLegend;
     private legendToggle;