@syncfusion/ej2-maps 21.1.37 → 21.1.41

package/dist/global/index.d.ts

@@ -1,6 +1,6 @@
 /*!
 *  filename: index.d.ts
-*  version : 21.1.37
+*  version : 21.1.41
 *  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@21.1.35",
+  "_id": "@syncfusion/ej2-maps@21.1.38",
   "_inBundle": false,
-  "_integrity": "sha512-WufF1xB1A5FsIbAx3qZgmVdkX/ODPpprThHEejipaxPfBWQ14Fg1r32ugaadGMo+YY7KU6DSei6/Eqr6lUdr1A==",
+  "_integrity": "sha512-c71dZus+LhjA/wl4pVp8K6bUPD0saJvxdhJwWCiztGmHq1rimww/cHBVA8l8XXyqVWE2aVl9baZNrlnO5Nlp0A==",
   "_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-hotfix-new/@syncfusion/ej2-maps/-/ej2-maps-21.1.35.tgz",
-  "_shasum": "ac531b479c7bbaeffd248dfae5da90655e9c163d",
+  "_resolved": "https://nexus.syncfusion.com/repository/ej2-hotfix-new/@syncfusion/ej2-maps/-/ej2-maps-21.1.38.tgz",
+  "_shasum": "361a02226d73f9daa669a99091c29efcb30957c0",
   "_spec": "@syncfusion/ej2-maps@*",
   "_where": "/jenkins/workspace/elease-automation_release_21.1.1/packages/included",
   "author": {
@@ -35,13 +35,13 @@
   },
   "bundleDependencies": false,
   "dependencies": {
-    "@syncfusion/ej2-base": "~21.1.37",
+    "@syncfusion/ej2-base": "~21.1.40",
     "@syncfusion/ej2-buttons": "~21.1.37",
     "@syncfusion/ej2-compression": "~21.1.37",
-    "@syncfusion/ej2-data": "~21.1.37",
+    "@syncfusion/ej2-data": "~21.1.38",
     "@syncfusion/ej2-file-utils": "~21.1.37",
     "@syncfusion/ej2-pdf-export": "~21.1.37",
-    "@syncfusion/ej2-svg-base": "~21.1.37"
+    "@syncfusion/ej2-svg-base": "~21.1.38"
   },
   "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",
@@ -93,6 +93,6 @@
     "url": "git+https://github.com/syncfusion/ej2-javascript-ui-controls.git"
   },
   "typings": "index.d.ts",
-  "version": "21.1.37",
+  "version": "21.1.41",
   "sideEffects": false
 }

package/src/maps/maps.d.ts

@@ -798,6 +798,7 @@ export declare class Maps extends Component<HTMLElement> implements INotifyPrope
      * @returns {void}
      */
     private addTabIndex;
+    private setSecondaryElementPosition;
     private zoomingChange;
     private createSecondaryElement;
     /**
@@ -1078,13 +1079,6 @@ export declare class Maps extends Component<HTMLElement> implements INotifyPrope
      * @returns {boolean} - Returns whether the navigation lines are visible or not.
      */
     private isNavigationVisible;
-    /**
-     * To find space between the secondary element and svg element.
-     *
-     * @returns {Point} - Returns the left and top value of the secondary element of Maps.
-     * @private
-     */
-    getExtraPosition(): Point;
     /**
      * To find marker visibility
      */

package/src/maps/maps.js

@@ -398,15 +398,8 @@ var Maps = /** @class */ (function (_super) {
         if (!isNullOrUndefined(this.svgObject)) {
             this.element.appendChild(this.svgObject);
         }
-        var position = this.getExtraPosition();
+        this.setSecondaryElementPosition();
         for (var i = 0; i < this.layers.length; i++) {
-            if (position.x !== 0 || position.y !== 0) {
-                var markerTemplate = document.getElementById(this.element.id + '_LayerIndex_' + i + '_Markers_Template_Group');
-                if (!isNullOrUndefined(markerTemplate)) {
-                    markerTemplate.style.top = this.mapAreaRect.y + position.y + 'px';
-                    markerTemplate.style.left = this.mapAreaRect.x + position.x + 'px';
-                }
-            }
             if (this.layers[i].selectionSettings && this.layers[i].selectionSettings.enable &&
                 this.layers[i].initialShapeSelection.length > 0 && this.checkInitialRender) {
                 var checkSelection = this.layers[i].selectionSettings.enableMultiSelect;
@@ -596,15 +589,13 @@ var Maps = /** @class */ (function (_super) {
         this.element.setAttribute('role', '');
         this.element.tabIndex = this.tabIndex;
     };
-    // private setSecondaryElementPosition(): void {
-    //     if (!this.isTileMap) {
-    //         let element: HTMLDivElement = getElementByID(this.element.id + '_Secondary_Element') as HTMLDivElement;
-    //         let rect: ClientRect = this.element.getBoundingClientRect();
-    //         let svgRect: ClientRect = getElementByID(this.element.id + '_svg').getBoundingClientRect();
-    //         element.style.marginLeft = Math.max(svgRect.left - rect.left, 0) + 'px';
-    //         element.style.marginTop = Math.max(svgRect.top - rect.top, 0) + 'px';
-    //     }
-    // }
+    Maps.prototype.setSecondaryElementPosition = function () {
+        var element = getElementByID(this.element.id + '_Secondary_Element');
+        var rect = this.element.getBoundingClientRect();
+        var svgRect = getElementByID(this.element.id + '_svg').getBoundingClientRect();
+        element.style.marginLeft = Math.max(svgRect.left - rect.left, 0) + 'px';
+        element.style.marginTop = Math.max(svgRect.top - rect.top, 0) + 'px';
+    };
     Maps.prototype.zoomingChange = function () {
         var left;
         var top;
@@ -1177,7 +1168,7 @@ var Maps = /** @class */ (function (_super) {
                         latLongValue.latitude = -latLongValue.latitude;
                     }
                 }
-                else if (targetId.indexOf('_MarkerIndex_') > -1 && this.markerModule) {
+                else if (targetId.indexOf('_MarkerIndex_') > -1 && this.markerModule && !this.markerDragArgument) {
                     var markerIndex = parseInt(targetId.split('_MarkerIndex_')[1].split('_')[0], 10);
                     var dataIndex = parseInt(targetId.split('_dataIndex_')[1].split('_')[0], 10);
                     if (!isNaN(markerIndex) && !isNaN(dataIndex)) {
@@ -1188,6 +1179,23 @@ var Maps = /** @class */ (function (_super) {
                         latLongValue = { latitude: null, longitude: null };
                     }
                 }
+                else if (targetId.indexOf('_MarkerIndex_') > -1 && this.markerModule && this.markerDragArgument) {
+                    var element = document.getElementById(this.element.id + '_LayerIndex_' + this.markerDragArgument.layerIndex);
+                    var elementRect = element.getBoundingClientRect();
+                    var location_3 = new MapLocation(pageX > elementRect.left ? Math.abs(elementRect.left - pageX) : 0, pageY > elementRect.top ? Math.abs(elementRect.top - pageY) : 0);
+                    var minLongitude = Math.abs((-this.baseMapBounds.longitude.min) * this.mapLayerPanel.currentFactor);
+                    var minLatitude = Math.abs(this.baseMapBounds.latitude.max * this.mapLayerPanel.currentFactor);
+                    latLongValue = {
+                        latitude: Math.abs(this.baseMapBounds.latitude.max - (location_3.y / (this.mapLayerPanel.currentFactor * this.scale))),
+                        longitude: Math.abs((location_3.x / (this.mapLayerPanel.currentFactor * this.scale)) + this.baseMapBounds.longitude.min)
+                    };
+                    if (this.baseMapBounds.longitude.min < 0 && minLongitude > location_3.x) {
+                        latLongValue.longitude = -latLongValue.longitude;
+                    }
+                    if (this.baseMapBounds.latitude.min < 0 && minLatitude > location_3.y) {
+                        latLongValue.latitude = -latLongValue.latitude;
+                    }
+                }
                 else {
                     latLongValue = { latitude: null, longitude: null };
                 }
@@ -2208,28 +2216,6 @@ var Maps = /** @class */ (function (_super) {
         });
         return isVisible;
     };
-    /**
-     * To find space between the secondary element and svg element.
-     *
-     * @returns {Point} - Returns the left and top value of the secondary element of Maps.
-     * @private
-     */
-    Maps.prototype.getExtraPosition = function () {
-        var top = 0;
-        var left = 0;
-        var svgElement = getElement(this.element.id + '_svg');
-        if (!isNullOrUndefined(svgElement)) {
-            var svgClientRects = svgElement.getClientRects();
-            var mapsClientRects = (getElement(this.element.id + '_Secondary_Element')).getClientRects();
-            if (svgClientRects.length !== 0 && mapsClientRects.length !== 0) {
-                var svgClientRect = svgClientRects[0];
-                var mapsClientRect = mapsClientRects[0];
-                top = svgClientRect.top - mapsClientRect.top;
-                left = svgClientRect.left - mapsClientRect.left;
-            }
-        }
-        return new Point(left, top);
-    };
     /**
      * To find marker visibility
      */

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

@@ -71,7 +71,7 @@ var Selection = /** @class */ (function () {
                 this.selectionsettings = this.maps.layers[layerIndex].markerSettings[markerIndex].selectionSettings;
                 this.selectionType = 'Marker';
             }
-            else {
+            else if (targetElement.id.indexOf('NavigationIndex') > -1) {
                 var index = parseInt(targetElement.id.split('_NavigationIndex_')[1].split('_')[0], 10);
                 shapeData = null;
                 data = {
@@ -81,7 +81,7 @@ var Selection = /** @class */ (function () {
                 this.selectionsettings = this.maps.layers[layerIndex].navigationLineSettings[index].selectionSettings;
                 this.selectionType = 'navigationline';
             }
-            if (this.selectionsettings.enable) {
+            if (!isNullOrUndefined(this.selectionsettings) && this.selectionsettings.enable) {
                 this.selectElement(targetElement, layerIndex, data, shapeData);
             }
         }

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

@@ -1553,9 +1553,8 @@ var Zoom = /** @class */ (function () {
                 }
                 break;
         }
-        var extraPosition = map.getExtraPosition();
-        element.style.left = x + extraPosition.x + 'px';
-        element.style.top = y + extraPosition.y + 'px';
+        element.style.left = x + 'px';
+        element.style.top = y + 'px';
         var color = this.maps.toolbarProperties.highlightColor || this.maps.themeStyle.zoomSelectionColor;
         var css = ' .e-maps-toolbar:hover > circle { stroke:' + color + '; } .e-maps-toolbar:hover > path { fill: ' + color + ' ;  stroke: ' + color + '; }' +
             '.e-maps-toolbar:hover { cursor: pointer; } .e-maps-cursor-disable:hover { cursor: not-allowed; } .e-maps-panning:hover { cursor: pointer; } ' +

package/src/maps/utils/helper.js

@@ -56,6 +56,7 @@ export function stringToNumber(value, containerSize) {
 export function calculateSize(maps) {
     maps.element.style.height = !isNullOrUndefined(maps.height) ? maps.height : 'auto';
     maps.element.style.width = !isNullOrUndefined(maps.width) ? maps.width : 'auto';
+    maps.element.style.setProperty("display", "block");
     var containerWidth = maps.element.clientWidth;
     var containerHeight = maps.element.clientHeight;
     var containerElementWidth = stringToNumber(maps.element.style.width, containerWidth);
@@ -1852,8 +1853,9 @@ export function findMidPointOfPolygon(points, type, geometryType) {
         ySum = ySum + Math.abs(((startY + startY1) * (((startX * startY1) - (startX1 * startY)))));
     }
     sum = 0.5 * sum;
-    xSum = (1 / (4 * sum)) * xSum;
-    ySum = (1 / (4 * sum)) * ySum;
+    var pointValue = points.some(function (point) { return point.x < 5 && point.y < 5; }) && geometryType === 'Normal' ? 6 : 4;
+    xSum = (1 / (pointValue * sum)) * xSum;
+    ySum = (1 / (pointValue * sum)) * ySum;
     /* Code for finding nearest points in polygon related to midPoint*/
     var rightMinPoint = { x: 0, y: 0 };
     var rightMaxPoint = { x: 0, y: 0 };