@syncfusion/ej2-maps 19.4.53 → 19.4.56-105067

package/src/maps/layers/marker.js

@@ -12,102 +12,103 @@ var Marker = /** @class */ (function () {
         this.trackElements = [];
         this.sameMarkerData = [];
     }
-    Marker.prototype.markerRender = function (layerElement, layerIndex, factor, type) {
+    Marker.prototype.markerRender = function (maps, layerElement, layerIndex, factor, type) {
         var _this = this;
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
         var templateFn;
         var markerCount = 0;
         var nullCount = 0;
         var markerTemplateCount = 0;
-        this.maps.translateType = 'marker';
-        var currentLayer = this.maps.layersCollection[layerIndex];
-        this.markerSVGObject = this.maps.renderer.createGroup({
-            id: this.maps.element.id + '_Markers_Group',
+        maps.translateType = 'marker';
+        var currentLayer = maps.layersCollection[layerIndex];
+        this.markerSVGObject = maps.renderer.createGroup({
+            id: maps.element.id + '_Markers_Group',
             class: 'GroupElement',
             style: 'pointer-events: auto;'
         });
         var markerTemplateEle = createElement('div', {
-            id: this.maps.element.id + '_LayerIndex_' + layerIndex + '_Markers_Template_Group',
-            className: this.maps.element.id + '_template',
+            id: maps.element.id + '_LayerIndex_' + layerIndex + '_Markers_Template_Group',
+            className: maps.element.id + '_template',
             styles: 'overflow: hidden; position: absolute;pointer-events: none;' +
-                'top:' + this.maps.mapAreaRect.y + 'px;' +
-                'left:' + this.maps.mapAreaRect.x + 'px;' +
-                'height:' + this.maps.mapAreaRect.height + 'px;' +
-                'width:' + this.maps.mapAreaRect.width + 'px;'
+                'top:' + maps.mapAreaRect.y + 'px;' +
+                'left:' + maps.mapAreaRect.x + 'px;' +
+                'height:' + maps.mapAreaRect.height + 'px;' +
+                'width:' + maps.mapAreaRect.width + 'px;'
         });
         currentLayer.markerSettings.map(function (markerSettings, markerIndex) {
             // eslint-disable-next-line @typescript-eslint/no-explicit-any
             var markerData = markerSettings.dataSource;
             // eslint-disable-next-line @typescript-eslint/no-explicit-any
             Array.prototype.forEach.call(markerData, function (data, dataIndex) {
-                _this.maps.markerNullCount = markerIndex > 0 && dataIndex === 0 ? 0 : _this.maps.markerNullCount;
+                maps.markerNullCount = markerIndex > 0 && dataIndex === 0 ? 0 : maps.markerNullCount;
                 var eventArgs = {
                     cancel: false, name: markerRendering, fill: markerSettings.fill, height: markerSettings.height,
                     width: markerSettings.width, imageUrl: markerSettings.imageUrl, shape: markerSettings.shape,
-                    template: markerSettings.template, data: data, maps: _this.maps, marker: markerSettings,
+                    template: markerSettings.template, data: data, maps: maps, marker: markerSettings,
                     border: markerSettings.border, colorValuePath: markerSettings.colorValuePath,
                     shapeValuePath: markerSettings.shapeValuePath, imageUrlValuePath: markerSettings.imageUrlValuePath
                 };
-                _this.maps.trigger('markerRendering', eventArgs, function (MarkerArgs) {
+                maps.trigger('markerRendering', eventArgs, function (MarkerArgs) {
                     eventArgs = markerColorChoose(eventArgs, data);
                     eventArgs = markerShapeChoose(eventArgs, data);
                     var lng = (!isNullOrUndefined(markerSettings.longitudeValuePath)) ?
                         Number(getValueFromObject(data, markerSettings.longitudeValuePath)) : !isNullOrUndefined(data['longitude']) ?
-                        parseFloat(data['longitude']) : !isNullOrUndefined(data['Longitude']) ? parseFloat(data['Longitude']) : 0;
+                        parseFloat(data['longitude']) : !isNullOrUndefined(data['Longitude']) ? parseFloat(data['Longitude']) : null;
                     var lat = (!isNullOrUndefined(markerSettings.latitudeValuePath)) ?
                         Number(getValueFromObject(data, markerSettings.latitudeValuePath)) : !isNullOrUndefined(data['latitude']) ?
-                        parseFloat(data['latitude']) : !isNullOrUndefined(data['Latitude']) ? parseFloat(data['Latitude']) : 0;
+                        parseFloat(data['latitude']) : !isNullOrUndefined(data['Latitude']) ? parseFloat(data['Latitude']) : null;
                     var offset = markerSettings.offset;
                     if (!eventArgs.cancel && markerSettings.visible && !isNullOrUndefined(lng) && !isNullOrUndefined(lat)) {
-                        var markerID = _this.maps.element.id + '_LayerIndex_' + layerIndex + '_MarkerIndex_'
+                        var markerID = maps.element.id + '_LayerIndex_' + layerIndex + '_MarkerIndex_'
                             + markerIndex + '_dataIndex_' + dataIndex;
-                        var location_1 = (_this.maps.isTileMap) ? convertTileLatLongToPoint(new MapLocation(lng, lat), factor, _this.maps.tileTranslatePoint, true) : convertGeoToPoint(lat, lng, factor, currentLayer, _this.maps);
-                        var animate = currentLayer.animationDuration !== 0 || isNullOrUndefined(_this.maps.zoomModule);
+                        var location_1 = (maps.isTileMap) ? convertTileLatLongToPoint(new MapLocation(lng, lat), factor, maps.tileTranslatePoint, true) : convertGeoToPoint(lat, lng, factor, currentLayer, maps);
+                        var animate = currentLayer.animationDuration !== 0 || isNullOrUndefined(maps.zoomModule);
                         // eslint-disable-next-line @typescript-eslint/no-explicit-any
-                        var translate = (_this.maps.isTileMap) ? (currentLayer.type === 'SubLayer' && isNullOrUndefined(_this.maps.zoomModule)) ? location_1 = convertTileLatLongToPoint(new MapLocation(lng, lat), _this.maps.tileZoomLevel, _this.maps.tileTranslatePoint, true) : new Object() :
-                            !isNullOrUndefined(_this.maps.zoomModule) && _this.maps.zoomSettings.zoomFactor > 1 ?
-                                getZoomTranslate(_this.maps, currentLayer, animate) :
-                                getTranslate(_this.maps, currentLayer, animate);
-                        var scale = type === 'AddMarker' ? _this.maps.scale : translate['scale'];
-                        var transPoint = type === 'AddMarker' ? _this.maps.translatePoint : translate['location'];
+                        var translate = (maps.isTileMap) ? (currentLayer.type === 'SubLayer' && isNullOrUndefined(maps.zoomModule)) ? location_1 = convertTileLatLongToPoint(new MapLocation(lng, lat), maps.tileZoomLevel, maps.tileTranslatePoint, true) : new Object() :
+                            !isNullOrUndefined(maps.zoomModule) && maps.zoomSettings.zoomFactor > 1 ?
+                                getZoomTranslate(maps, currentLayer, animate) :
+                                getTranslate(maps, currentLayer, animate);
+                        var scale = type === 'AddMarker' ? maps.scale : translate['scale'];
+                        var transPoint = type === 'AddMarker' ? maps.translatePoint : translate['location'];
                         if (eventArgs.template && (!isNaN(location_1.x) && !isNaN(location_1.y))) {
                             markerTemplateCount++;
-                            markerTemplate(eventArgs, templateFn, markerID, data, markerIndex, markerTemplateEle, location_1, transPoint, scale, offset, _this.maps);
+                            markerTemplate(eventArgs, templateFn, markerID, data, markerIndex, markerTemplateEle, location_1, transPoint, scale, offset, maps);
                             // eslint-disable-next-line @typescript-eslint/no-explicit-any
-                            _this.maps.renderReactTemplates();
+                            maps.renderReactTemplates();
                         }
                         else if (!eventArgs.template && (!isNaN(location_1.x) && !isNaN(location_1.y))) {
                             markerCount++;
-                            marker(eventArgs, markerSettings, markerData, dataIndex, location_1, transPoint, markerID, offset, scale, _this.maps, _this.markerSVGObject);
+                            marker(eventArgs, markerSettings, markerData, dataIndex, location_1, transPoint, markerID, offset, scale, maps, _this.markerSVGObject);
                         }
                     }
                     nullCount += (!isNaN(lat) && !isNaN(lng)) ? 0 : 1;
                     markerTemplateCount += (eventArgs.cancel) ? 1 : 0;
                     markerCount += (eventArgs.cancel) ? 1 : 0;
-                    _this.maps.markerNullCount = (isNullOrUndefined(lng) || isNullOrUndefined(lat)) ? _this.maps.markerNullCount + 1 : _this.maps.markerNullCount;
-                    var markerDataLength = markerData.length - _this.maps.markerNullCount;
+                    maps.markerNullCount = (isNullOrUndefined(lng) || isNullOrUndefined(lat)) ? maps.markerNullCount + 1 : maps.markerNullCount;
+                    var markerDataLength = markerData.length - maps.markerNullCount;
                     if (_this.markerSVGObject.childElementCount === (markerDataLength - markerTemplateCount - nullCount) && (type !== 'Template')) {
                         layerElement.appendChild(_this.markerSVGObject);
                         if (currentLayer.markerClusterSettings.allowClustering) {
-                            _this.maps.svgObject.appendChild(_this.markerSVGObject);
-                            _this.maps.element.appendChild(_this.maps.svgObject);
-                            if (currentLayer.layerType !== 'OSM' || !_this.maps.zoomSettings.enable) {
-                                clusterTemplate(currentLayer, _this.markerSVGObject, _this.maps, layerIndex, _this.markerSVGObject, layerElement, true, false);
+                            maps.svgObject.appendChild(_this.markerSVGObject);
+                            maps.element.appendChild(maps.svgObject);
+                            if ((currentLayer.layerType === 'OSM' || (currentLayer.urlTemplate.indexOf('openstreetmap') !== -1 && isNullOrUndefined(currentLayer.shapeData)))
+                                && maps.zoomSettings.enable) {
+                                layerElement.appendChild(_this.markerSVGObject);
                             }
                             else {
-                                layerElement.appendChild(_this.markerSVGObject);
+                                clusterTemplate(currentLayer, _this.markerSVGObject, maps, layerIndex, _this.markerSVGObject, layerElement, true, false);
                             }
                             // eslint-disable-next-line @typescript-eslint/no-explicit-any
-                            _this.maps.renderReactTemplates();
+                            maps.renderReactTemplates();
                         }
                     }
-                    if (markerTemplateEle.childElementCount === (markerData.length - markerCount - nullCount) && getElementByID(_this.maps.element.id + '_Secondary_Element')) {
-                        getElementByID(_this.maps.element.id + '_Secondary_Element').appendChild(markerTemplateEle);
-                        if (_this.maps.checkInitialRender) {
+                    if (markerTemplateEle.childElementCount === (markerDataLength - markerCount - nullCount) && getElementByID(maps.element.id + '_Secondary_Element')) {
+                        getElementByID(maps.element.id + '_Secondary_Element').appendChild(markerTemplateEle);
+                        if (maps.checkInitialRender) {
                             if (currentLayer.markerClusterSettings.allowClustering) {
-                                clusterTemplate(currentLayer, markerTemplateEle, _this.maps, layerIndex, _this.markerSVGObject, layerElement, false, false);
+                                clusterTemplate(currentLayer, markerTemplateEle, maps, layerIndex, _this.markerSVGObject, layerElement, false, false);
                                 // eslint-disable-next-line @typescript-eslint/no-explicit-any
-                                _this.maps.renderReactTemplates();
+                                maps.renderReactTemplates();
                             }
                         }
                     }
@@ -353,8 +354,8 @@ var Marker = /** @class */ (function () {
                 }
                 if ((target.indexOf('_cluster_') > -1)) {
                     var isClusterSame = false;
-                    var clusterElement = document.getElementById(target.indexOf('_datalabel_') > -1 ? target.split('_datalabel_')[0] : target);
-                    var indexes = clusterElement.innerHTML.split(',').map(Number);
+                    var clusterElement = document.getElementById(target.indexOf('_datalabel_') > -1 ? layer.markerClusterSettings.shape === 'Balloon' ? target.split('_datalabel_')[0] + '_Group' : target.split('_datalabel_')[0] : layer.markerClusterSettings.shape === 'Balloon' ? target + '_Group' : target);
+                    var indexes = layer.markerClusterSettings.shape === 'Balloon' ? clusterElement.children[0].innerHTML.split(',').map(Number) : clusterElement.innerHTML.split(',').map(Number);
                     collection_1 = [];
                     for (var _i = 0, indexes_1 = indexes; _i < indexes_1.length; _i++) {
                         var i = indexes_1[_i];
@@ -423,14 +424,14 @@ var Marker = /** @class */ (function () {
     /**
      * To destroy the layers.
      *
-     * @param {Maps} maps - Specifies the instance of the map
      * @returns {void}
      * @private
      */
-    Marker.prototype.destroy = function (maps) {
-        /**
-         * Destroy method performed here
-         */
+    Marker.prototype.destroy = function () {
+        this.maps = null;
+        this.trackElements = [];
+        this.markerSVGObject = null;
+        this.sameMarkerData = [];
     };
     return Marker;
 }());

package/src/maps/layers/navigation-selected-line.d.ts

@@ -20,9 +20,8 @@ export declare class NavigationLine {
     /**
      * To destroy the layers.
      *
-     * @param {Maps} maps - Specifies the instance of the map
      * @returns {void}
      * @private
      */
-    destroy(maps: Maps): void;
+    destroy(): void;
 }

package/src/maps/layers/navigation-selected-line.js

@@ -29,9 +29,6 @@ var NavigationLine = /** @class */ (function () {
         var dashArray;
         var pathOption;
         var direction;
-        var markerWidth;
-        var arcId;
-        var radius;
         var showArrow;
         var arrowColor;
         var arrowSize;
@@ -69,8 +66,8 @@ var NavigationLine = /** @class */ (function () {
             for (var j = 0; j < point['length'] - 1; j++) {
                 angle = (-1 > angle) ? -1 : angle;
                 angle = (1 < angle) ? 1 : angle;
-                var arcId_1 = this.maps.element.id + '_LayerIndex_' + layerIndex + '_NavigationIndex_' + i + '_Line' + j + '';
-                var radius_1 = this.convertRadius(point[j], point[j + 1]);
+                var arcId = this.maps.element.id + '_LayerIndex_' + layerIndex + '_NavigationIndex_' + i + '_Line' + j + '';
+                var radius = this.convertRadius(point[j], point[j + 1]);
                 if (angle <= 1 && angle > 0) {
                     direction = 0;
                     if (point[j]['x'] > point[j + 1]['x']) {
@@ -115,10 +112,10 @@ var NavigationLine = /** @class */ (function () {
                     angle = Math.abs(angle);
                     d = (angle === 0) ? 'M ' + point[j]['x'] + ',' + point[j]['y'] + 'L ' + point[j + 1]['x']
                         + ',' + point[j + 1]['y'] + ' ' :
-                        'M ' + point[j]['x'] + ',' + point[j]['y'] + ' A ' + (radius_1 / 2 + (1 - angle) * radius_1 / (angle * 10)) +
-                            ' ' + (radius_1 / 2 + (1 - angle) * radius_1 / (angle * 10)) + ' ' + 0 + ',' + 0 + ','
+                        'M ' + point[j]['x'] + ',' + point[j]['y'] + ' A ' + (radius / 2 + (1 - angle) * radius / (angle * 10)) +
+                            ' ' + (radius / 2 + (1 - angle) * radius / (angle * 10)) + ' ' + 0 + ',' + 0 + ','
                             + direction + ' , ' + point[j + 1]['x'] + ',' + point[j + 1]['y'] + ' ';
-                    pathOption = new PathOption(arcId_1, 'none', width, color, 1, 1, dashArray, d);
+                    pathOption = new PathOption(arcId, 'none', width, color, 1, 1, dashArray, d);
                     navigationEle = this.maps.renderer.drawPath(pathOption);
                     if (!isNullOrUndefined(arrowPosition)) {
                         var position = (arrowPosition === 'Start') ? navigationEle.setAttribute('marker-start', startArrow)
@@ -151,14 +148,11 @@ var NavigationLine = /** @class */ (function () {
     /**
      * To destroy the layers.
      *
-     * @param {Maps} maps - Specifies the instance of the map
      * @returns {void}
      * @private
      */
-    NavigationLine.prototype.destroy = function (maps) {
-        /**
-         * Destroy method performed here
-         */
+    NavigationLine.prototype.destroy = function () {
+        this.maps = null;
     };
     return NavigationLine;
 }());