@syncfusion/ej2-maps 21.1.38 → 21.1.41

package/dist/es6/ej2-maps.es2015.js

@@ -40,6 +40,7 @@ function stringToNumber(value, containerSize) {
 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");
     const containerWidth = maps.element.clientWidth;
     const containerHeight = maps.element.clientHeight;
     const containerElementWidth = stringToNumber(maps.element.style.width, containerWidth);
@@ -1778,8 +1779,9 @@ 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;
+    const pointValue = points.some(point => 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*/
     let rightMinPoint = { x: 0, y: 0 };
     let rightMaxPoint = { x: 0, y: 0 };
@@ -7773,15 +7775,8 @@ let Maps = class Maps extends Component {
         if (!isNullOrUndefined(this.svgObject)) {
             this.element.appendChild(this.svgObject);
         }
-        const position = this.getExtraPosition();
+        this.setSecondaryElementPosition();
         for (let i = 0; i < this.layers.length; i++) {
-            if (position.x !== 0 || position.y !== 0) {
-                const markerTemplate$$1 = document.getElementById(this.element.id + '_LayerIndex_' + i + '_Markers_Template_Group');
-                if (!isNullOrUndefined(markerTemplate$$1)) {
-                    markerTemplate$$1.style.top = this.mapAreaRect.y + position.y + 'px';
-                    markerTemplate$$1.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) {
                 const checkSelection = this.layers[i].selectionSettings.enableMultiSelect;
@@ -7971,15 +7966,13 @@ let Maps = class Maps extends Component {
         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';
-    //     }
-    // }
+    setSecondaryElementPosition() {
+        let element = getElementByID(this.element.id + '_Secondary_Element');
+        let rect = this.element.getBoundingClientRect();
+        let 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';
+    }
     zoomingChange() {
         let left;
         let top;
@@ -9583,28 +9576,6 @@ let Maps = class Maps extends Component {
         });
         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
-     */
-    getExtraPosition() {
-        let top = 0;
-        let left = 0;
-        const svgElement = getElement(this.element.id + '_svg');
-        if (!isNullOrUndefined(svgElement)) {
-            const svgClientRects = svgElement.getClientRects();
-            const mapsClientRects = (getElement(this.element.id + '_Secondary_Element')).getClientRects();
-            if (svgClientRects.length !== 0 && mapsClientRects.length !== 0) {
-                const svgClientRect = svgClientRects[0];
-                const mapsClientRect = mapsClientRects[0];
-                top = svgClientRect.top - mapsClientRect.top;
-                left = svgClientRect.left - mapsClientRect.left;
-            }
-        }
-        return new Point(left, top);
-    }
     /**
      * To find marker visibility
      */
@@ -15526,9 +15497,8 @@ class Zoom {
                 }
                 break;
         }
-        const 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';
         const color = this.maps.toolbarProperties.highlightColor || this.maps.themeStyle.zoomSelectionColor;
         const 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; } ' +