@syncfusion/ej2-maps 20.4.38 → 20.4.42

package/dist/global/index.d.ts

@@ -1,6 +1,6 @@
 /*!
 *  filename: index.d.ts
-*  version : 20.4.38
+*  version : 20.4.42
 *  Copyright Syncfusion Inc. 2001 - 2020. All rights reserved.
 *  Use of this code is subject to the terms of our license.
 *  A copy of the current license can be obtained at any time by e-mailing

package/package.json

@@ -1,8 +1,8 @@
 {
   "_from": "@syncfusion/ej2-maps@*",
-  "_id": "@syncfusion/ej2-maps@16.41.15",
+  "_id": "@syncfusion/ej2-maps@20.4.40",
   "_inBundle": false,
-  "_integrity": "sha512-AJeqU+5oKxydk2JxnnlmjkQJKj7Tfc1E2JmVBTHThnYmGITjVcXpAQjZXL+KZF+KfO5VjCoXk6k2xqS71MpuKg==",
+  "_integrity": "sha512-eWo9hwnlfL2NQorrZzBYBLlCWSt4mTtJHcdWaWPrZeUdTMBJZesqveTtSgQ5ylrI36KMpEII7xxW+mp2pzR6tA==",
   "_location": "/@syncfusion/ej2-maps",
   "_phantomChildren": {},
   "_requested": {
@@ -23,8 +23,8 @@
     "/@syncfusion/ej2-react-maps",
     "/@syncfusion/ej2-vue-maps"
   ],
-  "_resolved": "https://nexus.syncfusion.com/repository/ej2-release/@syncfusion/ej2-maps/-/ej2-maps-16.41.15.tgz",
-  "_shasum": "0509b31a50ba9ceb45a7f9bba8a1bc054b018ceb",
+  "_resolved": "https://nexus.syncfusion.com/repository/ej2-hotfix-new/@syncfusion/ej2-maps/-/ej2-maps-20.4.40.tgz",
+  "_shasum": "6a7dffaa6f210641f7ef3f43b522515150f45a6e",
   "_spec": "@syncfusion/ej2-maps@*",
   "_where": "/jenkins/workspace/ease-automation_release_19.1.0.1/packages/included",
   "author": {
@@ -35,19 +35,19 @@
   },
   "bundleDependencies": false,
   "dependencies": {
-    "@syncfusion/ej2-base": "~20.4.38",
-    "@syncfusion/ej2-buttons": "~20.4.38",
-    "@syncfusion/ej2-compression": "~20.4.38",
-    "@syncfusion/ej2-data": "~20.4.38",
-    "@syncfusion/ej2-file-utils": "~20.4.38",
-    "@syncfusion/ej2-pdf-export": "~20.4.38",
-    "@syncfusion/ej2-svg-base": "~20.4.38"
+    "@syncfusion/ej2-base": "~20.4.42",
+    "@syncfusion/ej2-buttons": "~20.4.42",
+    "@syncfusion/ej2-compression": "~20.4.42",
+    "@syncfusion/ej2-data": "~20.4.42",
+    "@syncfusion/ej2-file-utils": "~20.4.42",
+    "@syncfusion/ej2-pdf-export": "~20.4.42",
+    "@syncfusion/ej2-svg-base": "~20.4.42"
   },
   "deprecated": false,
   "description": "The Maps component is used to visualize the geographical data and represent the statistical data of a particular geographical area on earth with user interactivity, and provides various customizing options",
   "devDependencies": {},
   "es2015": "./dist/es6/ej2-maps.es5.js",
-  "homepage": "https://github.com/syncfusion/ej2-javascript-ui-controls#readme",
+  "homepage": "https://www.syncfusion.com/javascript-ui-controls",
   "keywords": [
     "ej2",
     "syncfusion",
@@ -93,6 +93,6 @@
     "url": "git+https://github.com/syncfusion/ej2-javascript-ui-controls.git"
   },
   "typings": "index.d.ts",
-  "version": "20.4.38",
+  "version": "20.4.42",
   "sideEffects": false
 }

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

@@ -143,6 +143,7 @@ export declare class Legend {
     private removeCollections;
     removeEventListener(): void;
     private getLegendData;
+    private setToggleAttributes;
     legendGradientColor(colorMap: ColorMappingSettings, legendIndex: number): string;
     /**
      * Get module name.

package/src/maps/layers/legend.js

@@ -1812,12 +1812,13 @@ var Legend = /** @class */ (function () {
                                 }
                                 if (targetEle !== null) {
                                     legendShapeId = querySelector(this.maps.element.id + '_Legend_Shape_Index_' + legendIndex, this.maps.element.id);
-                                    legendShapeId.setAttribute('fill', '#E5E5E5');
-                                    if (this.maps.legendSettings.shape === 'HorizontalLine' || this.maps.legendSettings.shape === 'VerticalLine' || this.maps.legendSettings.shape === 'Cross') {
-                                        legendShapeId.setAttribute('stroke', '#E5E5E5');
-                                    }
                                     legendTextId = querySelector(this.maps.element.id + '_Legend_Text_Index_' + legendIndex, this.maps.element.id);
-                                    legendTextId.setAttribute('fill', '#E5E5E5');
+                                    if (!this.maps.legendSettings.toggleLegendSettings.applyShapeSettings) {
+                                        this.setToggleAttributes(legendTextId, legendShapeId, legendToggleFill, legendToggleOpacity, legendToggleBorderColor, legendToggleBorderWidth, legendToggleBorderOpacity, legendToggleFill);
+                                    }
+                                    else {
+                                        this.setToggleAttributes(legendTextId, legendShapeId, this.maps.layers[k].shapeSettings.fill, this.maps.layers[k].shapeSettings.opacity, this.maps.layers[k].shapeSettings.border.color, isNullOrUndefined(this.maps.layers[k].shapeSettings.border.width) ? 0 : this.maps.layers[k].shapeSettings.border.width, isNullOrUndefined(this.maps.layers[k].shapeSettings.border.opacity) ? this.maps.layers[k].shapeSettings.opacity : this.maps.layers[k].shapeSettings.border.opacity, this.maps.layers[k].shapeSettings.fill);
+                                    }
                                 }
                             }
                             else {
@@ -1829,12 +1830,11 @@ var Legend = /** @class */ (function () {
                                 }
                                 if (targetEle !== null) {
                                     legendShapeId = querySelector(this.maps.element.id + '_Legend_Shape_Index_' + legendIndex, this.maps.element.id);
-                                    legendShapeId.setAttribute('fill', this.legendCollection[legendIndex]['fill']);
+                                    legendTextId = querySelector(this.maps.element.id + '_Legend_Text_Index_' + legendIndex, this.maps.element.id);
+                                    this.setToggleAttributes(legendTextId, legendShapeId, this.legendCollection[legendIndex]['fill'], this.legendCollection[legendIndex]['opacity'], this.legendCollection[legendIndex]['shapeBorder']['color'], this.legendCollection[legendIndex]['shapeBorder']['width'], this.legendCollection[legendIndex]['shapeBorder']['opacity'], '#757575');
                                     if (this.maps.legendSettings.shape === 'HorizontalLine' || this.maps.legendSettings.shape === 'VerticalLine' || this.maps.legendSettings.shape === 'Cross') {
                                         legendShapeId.setAttribute('stroke', this.legendCollection[legendIndex]['fill']);
                                     }
-                                    legendTextId = querySelector(this.maps.element.id + '_Legend_Text_Index_' + legendIndex, this.maps.element.id);
-                                    legendTextId.setAttribute('fill', '#757575');
                                 }
                             }
                         }
@@ -1881,9 +1881,13 @@ var Legend = /** @class */ (function () {
                                 }
                                 if (targetEle !== null) {
                                     legendTextId = querySelector(this.maps.element.id + '_Legend_Text_Index_' + legendIndex, this.maps.element.id);
-                                    legendTextId.setAttribute('fill', '#E5E5E5');
                                     legendShapeId = querySelector(this.maps.element.id + '_Legend_Shape_Index_' + legendIndex, this.maps.element.id);
-                                    legendShapeId.setAttribute('fill', '#E5E5E5');
+                                    if (!this.maps.legendSettings.toggleLegendSettings.applyShapeSettings) {
+                                        this.setToggleAttributes(legendTextId, legendShapeId, legendToggleFill, legendToggleOpacity, legendToggleBorderColor, legendToggleBorderWidth, legendToggleBorderOpacity, legendToggleFill);
+                                    }
+                                    else {
+                                        this.setToggleAttributes(legendTextId, legendShapeId, this.maps.layers[j].shapeSettings.fill, this.maps.layers[j].shapeSettings.opacity, this.maps.layers[j].shapeSettings.border.color, isNullOrUndefined(this.maps.layers[j].shapeSettings.border.width) ? 0 : this.maps.layers[j].shapeSettings.border.width, isNullOrUndefined(this.maps.layers[j].shapeSettings.border.opacity) ? this.maps.layers[j].shapeSettings.opacity : this.maps.layers[j].shapeSettings.border.opacity, this.maps.layers[j].shapeSettings.fill);
+                                    }
                                 }
                             }
                             else {
@@ -1902,9 +1906,8 @@ var Legend = /** @class */ (function () {
                                 layerElement.setAttribute('stroke', this.maps.layers[j].shapeSettings.border.color);
                                 if (targetEle !== null) {
                                     legendTextId = querySelector(this.maps.element.id + '_Legend_Text_Index_' + legendIndex, this.maps.element.id);
-                                    legendTextId.setAttribute('fill', '#757575');
                                     legendShapeId = querySelector(this.maps.element.id + '_Legend_Shape_Index_' + legendIndex, this.maps.element.id);
-                                    legendShapeId.setAttribute('fill', this.legendCollection[legendIndex]['fill']);
+                                    this.setToggleAttributes(legendTextId, legendShapeId, this.legendCollection[legendIndex]['fill'], this.legendCollection[legendIndex]['opacity'], this.legendCollection[legendIndex]['shapeBorder']['color'], this.legendCollection[legendIndex]['shapeBorder']['width'], this.legendCollection[legendIndex]['shapeBorder']['opacity'], '#757575');
                                 }
                             }
                         }
@@ -1956,9 +1959,13 @@ var Legend = /** @class */ (function () {
                                 }
                                 if (targetEle !== null) {
                                     legendTextId = querySelector(this.maps.element.id + '_Legend_Index_' + legendIndex + '_Text', this.maps.element.id);
-                                    legendTextId.setAttribute('fill', '#E5E5E5');
                                     legendShapeId = querySelector(this.maps.element.id + '_Legend_Index_' + legendIndex, this.maps.element.id);
-                                    legendShapeId.setAttribute('fill', '#E5E5E5');
+                                    if (!this.maps.legendSettings.toggleLegendSettings.applyShapeSettings) {
+                                        this.setToggleAttributes(legendTextId, legendShapeId, legendToggleFill, legendToggleOpacity, legendToggleBorderColor, legendToggleBorderWidth, legendToggleBorderOpacity, legendToggleFill);
+                                    }
+                                    else {
+                                        this.setToggleAttributes(legendTextId, legendShapeId, this.maps.layers[k].shapeSettings.fill, this.maps.layers[k].shapeSettings.opacity, this.maps.layers[k].shapeSettings.border.color, (isNullOrUndefined(this.maps.layers[k].shapeSettings.border.width) ? 0 : this.maps.layers[k].shapeSettings.border.width), (isNullOrUndefined(this.maps.layers[k].shapeSettings.border.opacity) ? this.maps.layers[k].shapeSettings.opacity : this.maps.layers[k].shapeSettings.border.opacity), this.maps.layers[k].shapeSettings.fill);
+                                    }
                                 }
                             }
                             else {
@@ -1971,6 +1978,10 @@ var Legend = /** @class */ (function () {
                                 if (targetEle !== null) {
                                     legendShapeId = querySelector(this.maps.element.id + '_Legend_Index_' + legendIndex, this.maps.element.id);
                                     legendShapeId.setAttribute('fill', this.legendCollection[legendIndex]['fill']);
+                                    legendShapeId.setAttribute('fill-opacity', this.legendCollection[legendIndex]['opacity']);
+                                    legendShapeId.setAttribute('stroke', this.legendCollection[legendIndex]['shapeBorder']['color']);
+                                    legendShapeId.setAttribute('stroke-width', this.legendCollection[legendIndex]['shapeBorder']['width']);
+                                    legendShapeId.setAttribute('stroke-opacity', this.legendCollection[legendIndex]['shapeBorder']['opacity']);
                                     legendTextId = querySelector(this.maps.element.id + '_Legend_Index_' + legendIndex + '_Text', this.maps.element.id);
                                     legendTextId.setAttribute('fill', '#757575');
                                 }
@@ -2019,9 +2030,13 @@ var Legend = /** @class */ (function () {
                                 }
                                 if (targetEle !== null) {
                                     legendShapeId = querySelector(this.maps.element.id + '_Legend_Index_' + legendIndex, this.maps.element.id);
-                                    legendShapeId.setAttribute('fill', '#E5E5E5');
                                     legendTextId = querySelector(this.maps.element.id + '_Legend_Index_' + legendIndex + '_Text', this.maps.element.id);
-                                    legendTextId.setAttribute('fill', '#E5E5E5');
+                                    if (!this.maps.legendSettings.toggleLegendSettings.applyShapeSettings) {
+                                        this.setToggleAttributes(legendTextId, legendShapeId, legendToggleFill, legendToggleOpacity, legendToggleBorderColor, legendToggleBorderWidth, legendToggleBorderOpacity, legendToggleFill);
+                                    }
+                                    else {
+                                        this.setToggleAttributes(legendTextId, legendShapeId, this.maps.layers[0].shapeSettings.fill, this.maps.layers[k].shapeSettings.opacity, this.maps.layers[0].shapeSettings.border.color, isNullOrUndefined(this.maps.layers[k].shapeSettings.border.width) ? 0 : this.maps.layers[k].shapeSettings.border.width, isNullOrUndefined(this.maps.layers[k].shapeSettings.border.opacity) ? this.maps.layers[k].shapeSettings.opacity : this.maps.layers[k].shapeSettings.border.opacity, this.maps.layers[0].shapeSettings.fill);
+                                    }
                                 }
                             }
                             else {
@@ -2041,9 +2056,8 @@ var Legend = /** @class */ (function () {
                                 mapLegendElement.setAttribute('fill', this.legendCollection[legendIndex]['fill']);
                                 if (targetEle !== null) {
                                     legendTextId = querySelector(this.maps.element.id + '_Legend_Index_' + legendIndex + '_Text', this.maps.element.id);
-                                    legendTextId.setAttribute('fill', '#757575');
                                     legendShapeId = querySelector(this.maps.element.id + '_Legend_Index_' + legendIndex, this.maps.element.id);
-                                    legendShapeId.setAttribute('fill', this.legendCollection[legendIndex]['fill']);
+                                    this.setToggleAttributes(legendTextId, legendShapeId, this.legendCollection[legendIndex]['fill'], this.legendCollection[legendIndex]['opacity'], this.legendCollection[legendIndex]['shapeBorder']['color'], this.legendCollection[legendIndex]['shapeBorder']['width'], this.legendCollection[legendIndex]['shapeBorder']['opacity'], '#757575');
                                 }
                             }
                         }
@@ -2120,6 +2134,16 @@ var Legend = /** @class */ (function () {
         }
         return legendData;
     };
+    Legend.prototype.setToggleAttributes = function (textElement, shapeElement, fillColor, fillOpacity, borderColor, borderWidth, borderOpacity, textColor) {
+        textElement.setAttribute('fill', textColor);
+        shapeElement.setAttribute('fill', fillColor);
+        shapeElement.setAttribute('fill-opacity', (fillOpacity).toString());
+        shapeElement.setAttribute('stroke', borderColor);
+        shapeElement.setAttribute('stroke-width', (borderWidth).toString());
+        if (!isNullOrUndefined(borderOpacity)) {
+            shapeElement.setAttribute('stroke-opacity', (borderOpacity).toString());
+        }
+    };
     Legend.prototype.legendGradientColor = function (colorMap, legendIndex) {
         var legendFillColor;
         var xmlns = 'http://www.w3.org/2000/svg';

package/src/maps/maps.js

@@ -1154,7 +1154,7 @@ var Maps = /** @class */ (function (_super) {
     };
     Maps.prototype.removeTileMap = function () {
         var animateElement = document.getElementById(this.element.id + '_animated_tiles');
-        if (!isNullOrUndefined(this.currentTiles) && animateElement.childElementCount !== this.currentTiles.childElementCount) {
+        if (!isNullOrUndefined(this.currentTiles) && animateElement.childElementCount < this.currentTiles.childElementCount) {
             for (var l = animateElement.childElementCount - 1; l >= this.currentTiles.childElementCount; l--) {
                 animateElement.removeChild(animateElement.children[l]);
             }

package/src/maps/user-interaction/zoom.js

@@ -405,7 +405,8 @@ var Zoom = /** @class */ (function () {
                     this.index = layerElement.id.indexOf('_LayerIndex_') > -1 && parseFloat(layerElement.id.split('_LayerIndex_')[1].split('_')[0]);
                     this.currentLayer = maps.layersCollection[this.index];
                     var factor = maps.mapLayerPanel.calculateFactor(this.currentLayer);
-                    for (var j = 0; j < layerElement.childElementCount; j++) {
+                    var elementCount = layerElement.childElementCount;
+                    for (var j = 0; j < elementCount; j++) {
                         var currentEle = layerElement.childNodes[j];
                         if (!(currentEle.id.indexOf('_Markers_Group') > -1) && (!(currentEle.id.indexOf('_bubble_Group') > -1))
                             && (!(currentEle.id.indexOf('_dataLableIndex_Group') > -1))) {