@syncfusion/ej2-maps 25.1.37 → 25.1.41
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.eslintrc.json +260 -0
- package/CHANGELOG.md +18 -0
- package/dist/ej2-maps.min.js +2 -2
- package/dist/ej2-maps.umd.min.js +2 -2
- package/dist/ej2-maps.umd.min.js.map +1 -1
- package/dist/es6/ej2-maps.es2015.js +520 -301
- package/dist/es6/ej2-maps.es2015.js.map +1 -1
- package/dist/es6/ej2-maps.es5.js +501 -283
- package/dist/es6/ej2-maps.es5.js.map +1 -1
- package/dist/global/ej2-maps.min.js +2 -2
- package/dist/global/ej2-maps.min.js.map +1 -1
- package/dist/global/index.d.ts +1 -1
- package/package.json +7 -7
- package/src/maps/layers/bubble.d.ts +17 -2
- package/src/maps/layers/bubble.js +20 -5
- package/src/maps/layers/color-mapping.d.ts +1 -1
- package/src/maps/layers/color-mapping.js +4 -0
- package/src/maps/layers/data-label.d.ts +2 -2
- package/src/maps/layers/data-label.js +5 -7
- package/src/maps/layers/layer-panel.d.ts +8 -7
- package/src/maps/layers/layer-panel.js +21 -23
- package/src/maps/layers/legend.d.ts +7 -6
- package/src/maps/layers/legend.js +41 -24
- package/src/maps/layers/marker.d.ts +7 -2
- package/src/maps/layers/marker.js +14 -10
- package/src/maps/layers/navigation-selected-line.js +1 -0
- package/src/maps/layers/polygon.js +5 -1
- package/src/maps/maps-model.d.ts +9 -9
- package/src/maps/maps.d.ts +30 -12
- package/src/maps/maps.js +88 -59
- package/src/maps/model/base-model.d.ts +3 -2
- package/src/maps/model/base.d.ts +10 -9
- package/src/maps/model/base.js +1 -1
- package/src/maps/model/export-image.js +1 -1
- package/src/maps/model/export-pdf.js +3 -3
- package/src/maps/model/interface.d.ts +1 -0
- package/src/maps/model/print.js +2 -0
- package/src/maps/model/theme.js +12 -12
- package/src/maps/user-interaction/annotation.d.ts +5 -0
- package/src/maps/user-interaction/annotation.js +6 -2
- package/src/maps/user-interaction/highlight.d.ts +13 -1
- package/src/maps/user-interaction/highlight.js +12 -2
- package/src/maps/user-interaction/selection.d.ts +13 -1
- package/src/maps/user-interaction/selection.js +19 -13
- package/src/maps/user-interaction/tooltip.d.ts +14 -0
- package/src/maps/user-interaction/tooltip.js +16 -1
- package/src/maps/user-interaction/zoom.d.ts +55 -10
- package/src/maps/user-interaction/zoom.js +146 -104
- package/src/maps/utils/helper.d.ts +64 -36
- package/src/maps/utils/helper.js +84 -54
- package/tslint.json +111 -0
|
@@ -40,7 +40,7 @@ function stringToNumber(value, containerSize) {
|
|
|
40
40
|
function calculateSize(maps) {
|
|
41
41
|
maps.element.style.height = !isNullOrUndefined(maps.height) ? maps.height : 'auto';
|
|
42
42
|
maps.element.style.width = !isNullOrUndefined(maps.width) ? maps.width : 'auto';
|
|
43
|
-
maps.element.style.setProperty(
|
|
43
|
+
maps.element.style.setProperty('display', 'block');
|
|
44
44
|
const containerWidth = maps.element.clientWidth;
|
|
45
45
|
const containerHeight = maps.element.clientHeight;
|
|
46
46
|
const containerElementWidth = stringToNumber(maps.element.style.width, containerWidth);
|
|
@@ -200,14 +200,19 @@ function convertGeoToPoint(latitude, longitude, factor, layer, mapModel) {
|
|
|
200
200
|
return new Point(x, y);
|
|
201
201
|
}
|
|
202
202
|
/**
|
|
203
|
+
* @param {Maps} maps - Specifies the map control.
|
|
204
|
+
* @param {number} factor - Specifies the factor.
|
|
205
|
+
* @param {LayerSettings} currentLayer - Specifies the current layer.
|
|
206
|
+
* @param {Coordinate} markerData - Specifies the marker data.
|
|
207
|
+
* @returns {string} - Returns the path.
|
|
203
208
|
* @private
|
|
204
209
|
*/
|
|
205
210
|
function calculatePolygonPath(maps, factor, currentLayer, markerData) {
|
|
206
211
|
let path = '';
|
|
207
212
|
Array.prototype.forEach.call(markerData, (data, dataIndex) => {
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
213
|
+
const lat = data.latitude;
|
|
214
|
+
const lng = data.longitude;
|
|
215
|
+
const location = (maps.isTileMap) ? convertTileLatLongToPoint(new MapLocation(lng, lat), factor, maps.tileTranslatePoint, true) : convertGeoToPoint(lat, lng, factor, currentLayer, maps);
|
|
211
216
|
if (dataIndex === 0) {
|
|
212
217
|
path += 'M ' + location.x + ' ' + location.y;
|
|
213
218
|
}
|
|
@@ -408,9 +413,14 @@ function measureText(text, font) {
|
|
|
408
413
|
'; visibility: hidden; top: -100; left: 0; whiteSpace: nowrap; lineHeight: normal';
|
|
409
414
|
return new Size(measureObject.clientWidth, measureObject.clientHeight);
|
|
410
415
|
}
|
|
411
|
-
/**
|
|
416
|
+
/**
|
|
417
|
+
* @param {string} text - Specifies the text.
|
|
418
|
+
* @param {FontModel} font - Specifies the font.
|
|
419
|
+
* @returns {Size} - Returns the size of text.
|
|
420
|
+
* @private */
|
|
412
421
|
function measureTextElement(text, font) {
|
|
413
422
|
const canvas = document.createElement('canvas');
|
|
423
|
+
// eslint-disable-next-line @typescript-eslint/tslint/config
|
|
414
424
|
const context = canvas.getContext('2d');
|
|
415
425
|
context.font = `${font.fontStyle} ${font.fontWeight} ${typeof font.size === 'number' ? font.size + 'px' : font.size} ${font.fontFamily}`;
|
|
416
426
|
const metrics = context.measureText(text);
|
|
@@ -646,15 +656,15 @@ function renderTextElement(option, style, color, parent, isMinus = false) {
|
|
|
646
656
|
return htmlObject;
|
|
647
657
|
}
|
|
648
658
|
/**
|
|
649
|
-
* @param {HTMLCollection} element Specifies the html collection
|
|
650
|
-
* @param {string} markerId Specifies the marker id
|
|
651
|
-
* @param {
|
|
652
|
-
* @param {number} index Specifies the index
|
|
653
|
-
* @param {Maps} mapObj Specifies the map object
|
|
654
|
-
* @
|
|
659
|
+
* @param {HTMLCollection} element - Specifies the html collection
|
|
660
|
+
* @param {string} markerId - Specifies the marker id
|
|
661
|
+
* @param {object} data - Specifies the data
|
|
662
|
+
* @param {number} index - Specifies the index
|
|
663
|
+
* @param {Maps} mapObj - Specifies the map object
|
|
664
|
+
* @param {string} templateType - Specifies the template type
|
|
665
|
+
* @returns {HTMLElement} - Returns the html element
|
|
655
666
|
* @private
|
|
656
667
|
*/
|
|
657
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
658
668
|
function convertElement(element, markerId, data, index, mapObj, templateType) {
|
|
659
669
|
const childElement = createElement('div', {
|
|
660
670
|
id: markerId, className: mapObj.element.id + '_marker_template_element'
|
|
@@ -665,6 +675,7 @@ function convertElement(element, markerId, data, index, mapObj, templateType) {
|
|
|
665
675
|
childElement.appendChild(element[0]);
|
|
666
676
|
elementLength--;
|
|
667
677
|
}
|
|
678
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
668
679
|
if (!mapObj.isReact || templateType !== 'function') {
|
|
669
680
|
let templateHtml = childElement.innerHTML;
|
|
670
681
|
const properties = Object.keys(data);
|
|
@@ -706,12 +717,11 @@ function formatValue(value, maps) {
|
|
|
706
717
|
*
|
|
707
718
|
* @param {string} stringTemplate - Specifies the template
|
|
708
719
|
* @param {string} format - Specifies the format
|
|
709
|
-
* @param {
|
|
720
|
+
* @param {object} data - Specifies the data
|
|
710
721
|
* @param {Maps} maps - Specifies the instance of the maps
|
|
711
722
|
* @returns {string} - Returns the string value
|
|
712
723
|
* @private
|
|
713
724
|
*/
|
|
714
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
715
725
|
function convertStringToValue(stringTemplate, format, data, maps) {
|
|
716
726
|
let templateHtml = (stringTemplate === '') ? format : stringTemplate;
|
|
717
727
|
const templateValue = (stringTemplate === '') ? templateHtml.split('${') : templateHtml.split('{{:');
|
|
@@ -736,14 +746,11 @@ function convertStringToValue(stringTemplate, format, data, maps) {
|
|
|
736
746
|
*
|
|
737
747
|
* @param {Element} element - Specifies the element
|
|
738
748
|
* @param {string} labelId - Specifies the label id
|
|
739
|
-
* @param {
|
|
740
|
-
* @param {number} index - Specifies the index
|
|
741
|
-
* @param {Maps} mapObj - Specifies the map object
|
|
749
|
+
* @param {object} data - Specifies the data
|
|
742
750
|
* @returns {HTMLElement} - Returns the html element
|
|
743
751
|
* @private
|
|
744
752
|
*/
|
|
745
|
-
|
|
746
|
-
function convertElementFromLabel(element, labelId, data, index, mapObj) {
|
|
753
|
+
function convertElementFromLabel(element, labelId, data) {
|
|
747
754
|
const labelEle = isNullOrUndefined(element.childElementCount) ? element[0] : element;
|
|
748
755
|
let templateHtml = labelEle.outerHTML;
|
|
749
756
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
@@ -772,7 +779,7 @@ function convertElementFromLabel(element, labelId, data, index, mapObj) {
|
|
|
772
779
|
* @returns {Element} - Returns the element
|
|
773
780
|
* @private
|
|
774
781
|
*/
|
|
775
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
782
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/explicit-module-boundary-types
|
|
776
783
|
function drawSymbols(shape, imageUrl, location, markerID, shapeCustom, markerCollection, maps) {
|
|
777
784
|
let markerEle;
|
|
778
785
|
let x;
|
|
@@ -814,7 +821,7 @@ function drawSymbols(shape, imageUrl, location, markerID, shapeCustom, markerCol
|
|
|
814
821
|
}
|
|
815
822
|
/**
|
|
816
823
|
*
|
|
817
|
-
* @param {
|
|
824
|
+
* @param {object} data - Specifies the data
|
|
818
825
|
* @param {string} value - Specifies the value
|
|
819
826
|
* @returns {any} - Returns the data
|
|
820
827
|
* @private
|
|
@@ -837,11 +844,10 @@ function getValueFromObject(data, value) {
|
|
|
837
844
|
/**
|
|
838
845
|
*
|
|
839
846
|
* @param {IMarkerRenderingEventArgs} eventArgs - Specifies the event arguments
|
|
840
|
-
* @param {
|
|
847
|
+
* @param {object} data - Specifies the data
|
|
841
848
|
* @returns {IMarkerRenderingEventArgs} - Returns the arguments
|
|
842
849
|
* @private
|
|
843
850
|
*/
|
|
844
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
845
851
|
function markerColorChoose(eventArgs, data) {
|
|
846
852
|
const color = (!isNullOrUndefined(eventArgs.colorValuePath)) ? ((eventArgs.colorValuePath.indexOf('.') > -1) ? (getValueFromObject(data, eventArgs.colorValuePath)).toString() :
|
|
847
853
|
data[eventArgs.colorValuePath]) : data[eventArgs.colorValuePath];
|
|
@@ -854,11 +860,10 @@ function markerColorChoose(eventArgs, data) {
|
|
|
854
860
|
/**
|
|
855
861
|
*
|
|
856
862
|
* @param {IMarkerRenderingEventArgs} eventArgs - Specifies the event arguments
|
|
857
|
-
* @param {
|
|
863
|
+
* @param {object} data - Specifies the data
|
|
858
864
|
* @returns {IMarkerRenderingEventArgs} - Returns the arguments
|
|
859
865
|
* @private
|
|
860
866
|
*/
|
|
861
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
862
867
|
function markerShapeChoose(eventArgs, data) {
|
|
863
868
|
if (!isNullOrUndefined(eventArgs.shapeValuePath) && !isNullOrUndefined(data[eventArgs.shapeValuePath])) {
|
|
864
869
|
const shape = ((eventArgs.shapeValuePath.indexOf('.') > -1) ?
|
|
@@ -891,7 +896,7 @@ function markerShapeChoose(eventArgs, data) {
|
|
|
891
896
|
* @param {Element} layerElement - Specifies the layer element
|
|
892
897
|
* @param {boolean} check - Specifies the boolean value
|
|
893
898
|
* @param {boolean} zoomCheck - Specifies the boolean value
|
|
894
|
-
* @returns {
|
|
899
|
+
* @returns {boolean} -Returns boolean for cluster completion
|
|
895
900
|
* @private
|
|
896
901
|
*/
|
|
897
902
|
function clusterTemplate(currentLayer, markerTemplate, maps, layerIndex, markerCollection, layerElement, check, zoomCheck) {
|
|
@@ -921,14 +926,15 @@ function clusterTemplate(currentLayer, markerTemplate, maps, layerIndex, markerC
|
|
|
921
926
|
data: data, maps: maps, cluster: clusters, border: clusters.border
|
|
922
927
|
};
|
|
923
928
|
const containerRect = maps.element.getBoundingClientRect();
|
|
924
|
-
// eslint-disable-next-line @typescript-eslint/no-
|
|
925
|
-
|
|
929
|
+
// eslint-disable-next-line @typescript-eslint/no-unused-expressions
|
|
930
|
+
(maps.isTileMap) ? new Object() : getTranslate(maps, currentLayer, false);
|
|
926
931
|
let factor;
|
|
927
932
|
if (!maps.isTileMap) {
|
|
928
933
|
factor = maps.mapLayerPanel.calculateFactor(currentLayer);
|
|
929
934
|
}
|
|
930
935
|
let isClusteringCompleted = false;
|
|
931
936
|
const currentZoomFactor = !maps.isTileMap ? maps.mapScaleValue : maps.tileZoomLevel;
|
|
937
|
+
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
932
938
|
maps.trigger('markerClusterRendering', eventArg, (clusterargs) => {
|
|
933
939
|
Array.prototype.forEach.call(markerTemplate.childNodes, (markerElement, o) => {
|
|
934
940
|
indexCollection = [];
|
|
@@ -941,9 +947,9 @@ function clusterTemplate(currentLayer, markerTemplate, maps, layerIndex, markerC
|
|
|
941
947
|
|| (maps.markerModule.initialMarkerCluster.length > 0 && maps.markerModule.initialMarkerCluster[layerIndex] && maps.markerModule.initialMarkerCluster[layerIndex][o] && maps.markerModule.initialMarkerCluster[layerIndex][o].length > 0) ?
|
|
942
948
|
(maps.previousScale < currentZoomFactor ? maps.markerModule.zoomedMarkerCluster[layerIndex][o] : maps.markerModule.initialMarkerCluster[layerIndex][o]) : null;
|
|
943
949
|
if (!isNullOrUndefined(list) && list.length !== 0) {
|
|
944
|
-
Array.prototype.forEach.call(list, (currentIndex
|
|
950
|
+
Array.prototype.forEach.call(list, (currentIndex) => {
|
|
945
951
|
if (o !== currentIndex) {
|
|
946
|
-
|
|
952
|
+
const otherMarkerElement = document.getElementById(maps.element.id + '_LayerIndex_' + layerIndex + '_MarkerIndex_'
|
|
947
953
|
+ 0 + '_dataIndex_' + currentIndex);
|
|
948
954
|
if (otherMarkerElement['style']['visibility'] !== 'hidden') {
|
|
949
955
|
markerBoundsComparer(otherMarkerElement, bounds1, colloideBounds, indexCollection, currentIndex);
|
|
@@ -1124,9 +1130,16 @@ function clusterTemplate(currentLayer, markerTemplate, maps, layerIndex, markerC
|
|
|
1124
1130
|
});
|
|
1125
1131
|
return isClusteringCompleted;
|
|
1126
1132
|
}
|
|
1127
|
-
/**
|
|
1133
|
+
/**
|
|
1134
|
+
* @param {Maps} maps - Specifies the map control.
|
|
1135
|
+
* @param {number} currentZoomFactor - Specifies the current zoom factor.
|
|
1136
|
+
* @param {number} layerIndex - Specifies the layer index.
|
|
1137
|
+
* @param {number} index - Specifies the index.
|
|
1138
|
+
* @param {number} indexCollection - Specifies the index Collection.
|
|
1139
|
+
* @returns {void}
|
|
1140
|
+
* @private */
|
|
1128
1141
|
function markerClusterListHandler(maps, currentZoomFactor, layerIndex, index, indexCollection) {
|
|
1129
|
-
if (currentZoomFactor
|
|
1142
|
+
if (currentZoomFactor === 1) {
|
|
1130
1143
|
const initialMarkerClusterList = isNullOrUndefined(maps.markerModule.initialMarkerCluster[layerIndex][index]) ? [] : indexCollection.length > 1 ? indexCollection : [];
|
|
1131
1144
|
maps.markerModule.initialMarkerCluster[layerIndex][index] = initialMarkerClusterList;
|
|
1132
1145
|
const zoomedMarkerClusterList = isNullOrUndefined(maps.markerModule.zoomedMarkerCluster[layerIndex][index]) ? [] : indexCollection.length > 1 ? indexCollection : [];
|
|
@@ -1136,9 +1149,17 @@ function markerClusterListHandler(maps, currentZoomFactor, layerIndex, index, in
|
|
|
1136
1149
|
maps.markerModule.zoomedMarkerCluster[layerIndex][index] = indexCollection.length > 1 ? indexCollection : [];
|
|
1137
1150
|
}
|
|
1138
1151
|
}
|
|
1139
|
-
/**
|
|
1152
|
+
/**
|
|
1153
|
+
* @param {Element} tempElement - Specifies the temp element.
|
|
1154
|
+
* @param {ClientRect} markerBounds - Specifies the marker bounds.
|
|
1155
|
+
* @param {ClientRect} colloideBounds - Specifies the colloide Bounds.
|
|
1156
|
+
* @param {number[]} indexCollection - Specifies the index collection.
|
|
1157
|
+
* @param {number} p - Specifies the p.
|
|
1158
|
+
* @returns {void}
|
|
1159
|
+
* @private */
|
|
1140
1160
|
function markerBoundsComparer(tempElement, markerBounds, colloideBounds, indexCollection, p) {
|
|
1141
|
-
|
|
1161
|
+
// eslint-disable-next-line @typescript-eslint/tslint/config
|
|
1162
|
+
const currentMarkerBound = tempElement.getBoundingClientRect();
|
|
1142
1163
|
if (!isNullOrUndefined(currentMarkerBound)) {
|
|
1143
1164
|
if (!(markerBounds.left > currentMarkerBound.right || markerBounds.right < currentMarkerBound.left
|
|
1144
1165
|
|| markerBounds.top > currentMarkerBound.bottom || markerBounds.bottom < currentMarkerBound.top)) {
|
|
@@ -1152,11 +1173,10 @@ function markerBoundsComparer(tempElement, markerBounds, colloideBounds, indexCo
|
|
|
1152
1173
|
*
|
|
1153
1174
|
* @param {MarkerClusterData[]} sameMarkerData - Specifies the marker data
|
|
1154
1175
|
* @param {Maps} maps - Specifies the instance of the maps
|
|
1155
|
-
* @param {Element | HTMLElement} markerElement - Specifies the marker element
|
|
1156
1176
|
* @returns {void}
|
|
1157
1177
|
* @private
|
|
1158
1178
|
*/
|
|
1159
|
-
function mergeSeparateCluster(sameMarkerData, maps
|
|
1179
|
+
function mergeSeparateCluster(sameMarkerData, maps) {
|
|
1160
1180
|
const layerIndex = sameMarkerData[0].layerIndex;
|
|
1161
1181
|
const clusterIndex = sameMarkerData[0].targetClusterIndex;
|
|
1162
1182
|
const markerIndex = sameMarkerData[0].markerIndex;
|
|
@@ -1320,7 +1340,7 @@ function marker(eventArgs, markerSettings, markerData, dataIndex, location, tran
|
|
|
1320
1340
|
* @returns {HTMLElement} - Returns the html element
|
|
1321
1341
|
* @private
|
|
1322
1342
|
*/
|
|
1323
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
1343
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/explicit-module-boundary-types
|
|
1324
1344
|
function markerTemplate(eventArgs, templateFn, markerID, data, markerIndex, markerTemplate, location, transPoint, scale, offset, maps) {
|
|
1325
1345
|
templateFn = getTemplateFunction(eventArgs.template, maps);
|
|
1326
1346
|
if (templateFn && (templateFn(data, maps, eventArgs.template, maps.element.id + '_MarkerTemplate' + markerIndex, false).length)) {
|
|
@@ -1735,8 +1755,10 @@ function getFieldData(dataSource, fields) {
|
|
|
1735
1755
|
* @returns {number} - Returns the number
|
|
1736
1756
|
* @private
|
|
1737
1757
|
*/
|
|
1738
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
1739
|
-
function checkShapeDataFields(dataSource, properties, dataPath, propertyPath,
|
|
1758
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/explicit-module-boundary-types
|
|
1759
|
+
function checkShapeDataFields(dataSource, properties, dataPath, propertyPath,
|
|
1760
|
+
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
1761
|
+
layer) {
|
|
1740
1762
|
if (!(isNullOrUndefined(properties))) {
|
|
1741
1763
|
for (let i = 0; i < dataSource.length; i++) {
|
|
1742
1764
|
const shapeDataPath = ((dataPath.indexOf('.') > -1) ? getValueFromObject(dataSource[i], dataPath) :
|
|
@@ -1757,10 +1779,9 @@ function checkShapeDataFields(dataSource, properties, dataPath, propertyPath, la
|
|
|
1757
1779
|
*
|
|
1758
1780
|
* @param {string} shapeData - Specifies the shape data
|
|
1759
1781
|
* @param {string | string[]} shapePropertyPath - Specifies the shape property path
|
|
1760
|
-
* @param {
|
|
1782
|
+
* @param {object} shape - Specifies the shape
|
|
1761
1783
|
* @returns {string} - Returns the string value
|
|
1762
1784
|
*/
|
|
1763
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
1764
1785
|
function checkPropertyPath(shapeData, shapePropertyPath, shape) {
|
|
1765
1786
|
if (!isNullOrUndefined(shapeData) && !isNullOrUndefined(shape)) {
|
|
1766
1787
|
if (!isNullOrUndefined(shapePropertyPath)) {
|
|
@@ -1855,9 +1876,10 @@ function findMidPointOfPolygon(points, type, geometryType) {
|
|
|
1855
1876
|
ySum = ySum + Math.abs(((startY + startY1) * (((startX * startY1) - (startX1 * startY)))));
|
|
1856
1877
|
}
|
|
1857
1878
|
sum = 0.5 * sum;
|
|
1879
|
+
// eslint-disable-next-line @typescript-eslint/tslint/config
|
|
1858
1880
|
const pointValue = points.some(point => point.x < 5 && point.y < 5) && geometryType === 'Normal' ? 6 : 4;
|
|
1859
|
-
xSum = (1 / (pointValue * sum)) * xSum;
|
|
1860
|
-
ySum = (1 / (pointValue * sum)) * ySum;
|
|
1881
|
+
xSum = sum !== 0 ? (1 / (pointValue * sum)) * xSum : 0;
|
|
1882
|
+
ySum = sum !== 0 ? (1 / (pointValue * sum)) * ySum : 0;
|
|
1861
1883
|
/* Code for finding nearest points in polygon related to midPoint*/
|
|
1862
1884
|
let rightMinPoint = { x: 0, y: 0 };
|
|
1863
1885
|
let rightMaxPoint = { x: 0, y: 0 };
|
|
@@ -1922,7 +1944,7 @@ function findMidPointOfPolygon(points, type, geometryType) {
|
|
|
1922
1944
|
function isCustomPath(layerData) {
|
|
1923
1945
|
let customPath = false;
|
|
1924
1946
|
if (Object.prototype.toString.call(layerData) === '[object Array]') {
|
|
1925
|
-
Array.prototype.forEach.call(layerData, (layer
|
|
1947
|
+
Array.prototype.forEach.call(layerData, (layer) => {
|
|
1926
1948
|
if (!isNullOrUndefined(layer['geometry']) && layer['geometry']['type'] === 'Path') {
|
|
1927
1949
|
customPath = true;
|
|
1928
1950
|
}
|
|
@@ -1936,6 +1958,9 @@ function isCustomPath(layerData) {
|
|
|
1936
1958
|
* @param {number} maxWidth - Specifies the maximum width
|
|
1937
1959
|
* @param {string} text - Specifies the text
|
|
1938
1960
|
* @param {FontModel} font - Specifies the font
|
|
1961
|
+
* @param {number} width - Specifies the width of text
|
|
1962
|
+
* @param {boolean} isCanvasMeasure - checks the canvas measure
|
|
1963
|
+
* @param {number[]} widthList - Specifies the width list
|
|
1939
1964
|
* @returns {string} - Returns the string
|
|
1940
1965
|
* @private
|
|
1941
1966
|
*/
|
|
@@ -2050,6 +2075,7 @@ function getTranslate(mapObject, layer, animate) {
|
|
|
2050
2075
|
}
|
|
2051
2076
|
if (mapObject.zoomSettings.shouldZoomInitially && mapObject.zoomSettings.enable) {
|
|
2052
2077
|
mapObject.mapScaleValue = scaleFactor = zoomFactorValue = ((mapObject.zoomSettings.shouldZoomInitially || mapObject.enablePersistence) && mapObject.scale === 1)
|
|
2078
|
+
// eslint-disable-next-line radix
|
|
2053
2079
|
? mapObject.scale : (isNullOrUndefined(mapObject.markerZoomFactor)) ? 1 : (mapObject.markerZoomedState ? mapObject.markerZoomFactor : parseInt(mapObject.scale.toString()));
|
|
2054
2080
|
if (mapObject.markerZoomedState && mapObject.mapScaleValue !== mapObject.markerZoomFactor && !mapObject.enablePersistence) {
|
|
2055
2081
|
mapObject.mapScaleValue = zoomFactorValue = mapObject.markerZoomFactor;
|
|
@@ -2407,9 +2433,9 @@ function Internalize(maps, value) {
|
|
|
2407
2433
|
/**
|
|
2408
2434
|
* Function to compile the template function for maps.
|
|
2409
2435
|
*
|
|
2410
|
-
* @param {string} template - Specifies the template
|
|
2436
|
+
* @param {string | Function} template - Specifies the template
|
|
2411
2437
|
* @param {Maps} maps - Specifies the Maps instance.
|
|
2412
|
-
* @returns {
|
|
2438
|
+
* @returns {any} - Returns the template function
|
|
2413
2439
|
* @private
|
|
2414
2440
|
*/
|
|
2415
2441
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
@@ -2448,7 +2474,7 @@ function getElement(id) {
|
|
|
2448
2474
|
*
|
|
2449
2475
|
* @param {string} targetId - Specifies the target id
|
|
2450
2476
|
* @param {Maps} map - Specifies the instance of the maps
|
|
2451
|
-
* @returns {
|
|
2477
|
+
* @returns {object} - Returns the object
|
|
2452
2478
|
* @private
|
|
2453
2479
|
*/
|
|
2454
2480
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
@@ -2575,7 +2601,7 @@ function getTargetElement(layerIndex, name, enable, map) {
|
|
|
2575
2601
|
*/
|
|
2576
2602
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
2577
2603
|
function createStyle(id, className, eventArgs) {
|
|
2578
|
-
|
|
2604
|
+
const styleEle = createElement('style', {
|
|
2579
2605
|
id: id
|
|
2580
2606
|
});
|
|
2581
2607
|
styleEle.innerText = '.' + className + '{fill:'
|
|
@@ -2611,14 +2637,12 @@ function customizeStyle(id, className, eventArgs) {
|
|
|
2611
2637
|
* @param {SelectionSettingsModel} selectionSettings - Specifies the selection settings
|
|
2612
2638
|
* @param {Maps} map - Specifies the instance of the maps
|
|
2613
2639
|
* @param {Element} targetElement - Specifies the target element
|
|
2614
|
-
* @param {
|
|
2615
|
-
* @param {
|
|
2640
|
+
* @param {object} shapeData - Specifies the shape data
|
|
2641
|
+
* @param {object} data - Specifies the data
|
|
2616
2642
|
* @returns {void}
|
|
2617
2643
|
* @private
|
|
2618
2644
|
*/
|
|
2619
|
-
function triggerItemSelectionEvent(selectionSettings, map, targetElement,
|
|
2620
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
2621
|
-
shapeData, data) {
|
|
2645
|
+
function triggerItemSelectionEvent(selectionSettings, map, targetElement, shapeData, data) {
|
|
2622
2646
|
const border = {
|
|
2623
2647
|
color: selectionSettings.border.color,
|
|
2624
2648
|
width: selectionSettings.border.width / map.scale,
|
|
@@ -2635,6 +2659,7 @@ shapeData, data) {
|
|
|
2635
2659
|
data: data,
|
|
2636
2660
|
maps: map
|
|
2637
2661
|
};
|
|
2662
|
+
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
2638
2663
|
map.trigger('itemSelection', eventArgs, (observedArgs) => {
|
|
2639
2664
|
eventArgs.border.opacity = isNullOrUndefined(selectionSettings.border.opacity) ? selectionSettings.opacity :
|
|
2640
2665
|
selectionSettings.border.opacity;
|
|
@@ -2691,6 +2716,7 @@ function elementAnimate(element, delay, duration, point, maps, ele, radius = 0)
|
|
|
2691
2716
|
' ) scale(' + height + ')');
|
|
2692
2717
|
}
|
|
2693
2718
|
},
|
|
2719
|
+
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
2694
2720
|
end: (model) => {
|
|
2695
2721
|
element.setAttribute('transform', transform);
|
|
2696
2722
|
if (!ele) {
|
|
@@ -2831,15 +2857,17 @@ function wordWrap(tooltip, text, x, y, size1, width, areaWidth, element) {
|
|
|
2831
2857
|
/**
|
|
2832
2858
|
* @param {string} id - Specifies the id
|
|
2833
2859
|
* @param {string} text - Specifies the text
|
|
2834
|
-
* @param {
|
|
2835
|
-
* @param {
|
|
2860
|
+
* @param {number} top - Specifies the top
|
|
2861
|
+
* @param {number} left - Specifies the left
|
|
2836
2862
|
* @param {ZoomToolbarTooltipSettingsModel} settings - Specifies the tooltip settings.
|
|
2837
2863
|
* @returns {void}
|
|
2838
2864
|
* @private
|
|
2839
2865
|
*/
|
|
2840
2866
|
function createTooltip(id, text, top, left, settings) {
|
|
2841
2867
|
let tooltip = getElement(id);
|
|
2868
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
2842
2869
|
const borderColor = getHexColor(settings.borderColor);
|
|
2870
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
2843
2871
|
const fontColor = getHexColor(settings.fontColor);
|
|
2844
2872
|
const style = 'top:' + top.toString() + 'px;' +
|
|
2845
2873
|
'left:' + left.toString() + 'px;' +
|
|
@@ -2866,11 +2894,15 @@ function createTooltip(id, text, top, left, settings) {
|
|
|
2866
2894
|
}
|
|
2867
2895
|
}
|
|
2868
2896
|
/**
|
|
2897
|
+
* @param {string} color - Specifies the color
|
|
2898
|
+
* @returns {any} - Returns the color in rgb
|
|
2869
2899
|
* @private
|
|
2870
2900
|
*/
|
|
2901
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
2871
2902
|
function getHexColor(color) {
|
|
2872
2903
|
if (color.indexOf('#') !== -1 && color.toLowerCase().indexOf('rgb') === -1) {
|
|
2873
|
-
|
|
2904
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
2905
|
+
const colorArray = (/^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i).exec(color);
|
|
2874
2906
|
return colorArray ? { r: parseInt(colorArray[1], 16), g: parseInt(colorArray[2], 16), b: parseInt(colorArray[3], 16) } : null;
|
|
2875
2907
|
}
|
|
2876
2908
|
else if (color.toLowerCase().indexOf('rgb') !== -1) {
|
|
@@ -3057,7 +3089,7 @@ function changeBorderWidth(element, index, scale, maps) {
|
|
|
3057
3089
|
changeNavaigationLineWidth(childNode, index, scale, maps);
|
|
3058
3090
|
}
|
|
3059
3091
|
else if (childNode.id.indexOf('_Polygons_Group') > -1) {
|
|
3060
|
-
for (
|
|
3092
|
+
for (let i = 0; i < childNode.childElementCount; i++) {
|
|
3061
3093
|
// eslint-disable-next-line
|
|
3062
3094
|
const width = maps.layersCollection[index].polygonSettings.polygons[parseInt(childNode.children[i].id.split('_PolygonIndex_')[1])].borderWidth;
|
|
3063
3095
|
childNode.children[i].setAttribute('stroke-width', (width / scale).toString());
|
|
@@ -3066,7 +3098,6 @@ function changeBorderWidth(element, index, scale, maps) {
|
|
|
3066
3098
|
else {
|
|
3067
3099
|
let currentStroke;
|
|
3068
3100
|
let value = 0;
|
|
3069
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
3070
3101
|
const borderWidthValue = maps.layersCollection[index].shapeSettings.borderWidthValuePath;
|
|
3071
3102
|
const borderWidth = maps.layersCollection[index].shapeSettings.border.width;
|
|
3072
3103
|
const circleRadius = maps.layersCollection[index].shapeSettings.circleRadius;
|
|
@@ -3267,13 +3298,12 @@ function zoomAnimate(element, delay, duration, point, scale, size, maps) {
|
|
|
3267
3298
|
* @returns {void}
|
|
3268
3299
|
* @private
|
|
3269
3300
|
*/
|
|
3270
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
3271
3301
|
function animate(element, delay, duration, process, end) {
|
|
3272
3302
|
let start = null;
|
|
3273
3303
|
// eslint-disable-next-line prefer-const
|
|
3274
3304
|
let clearAnimation;
|
|
3275
3305
|
const markerStyle = 'visibility:visible';
|
|
3276
|
-
duration = animationMode ===
|
|
3306
|
+
duration = animationMode === 'Disable' ? 0 : duration;
|
|
3277
3307
|
const startAnimation = (timestamp) => {
|
|
3278
3308
|
if (!start) {
|
|
3279
3309
|
start = timestamp;
|
|
@@ -3375,6 +3405,7 @@ function compareZoomFactor(scaleFactor, maps) {
|
|
|
3375
3405
|
* @param {number} mapWidth - Specifies the width of the maps
|
|
3376
3406
|
* @param {number} mapHeight - Specifies the height of the maps
|
|
3377
3407
|
* @param {Maps} maps - Specifies the instance of the maps
|
|
3408
|
+
* @param {boolean} isZoomToCoordinates - Checks for the zoom to coordinates
|
|
3378
3409
|
* @returns {number} - Returns the scale factor
|
|
3379
3410
|
* @private
|
|
3380
3411
|
*/
|
|
@@ -3416,7 +3447,7 @@ function calculateZoomLevel(minLat, maxLat, minLong, maxLong, mapWidth, mapHeigh
|
|
|
3416
3447
|
* @returns {any} - Returns the data value
|
|
3417
3448
|
* @private
|
|
3418
3449
|
*/
|
|
3419
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
3450
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/explicit-module-boundary-types
|
|
3420
3451
|
function processResult(e) {
|
|
3421
3452
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
3422
3453
|
let dataValue;
|
|
@@ -3789,7 +3820,7 @@ function getThemeStyle(theme) {
|
|
|
3789
3820
|
shapeFill: '#A6A6A6',
|
|
3790
3821
|
rectangleZoomFillColor: '#d3d3d3',
|
|
3791
3822
|
rectangleZoomFillOpacity: 0.5,
|
|
3792
|
-
rectangleZoomBorderColor:
|
|
3823
|
+
rectangleZoomBorderColor: '#009900'
|
|
3793
3824
|
};
|
|
3794
3825
|
break;
|
|
3795
3826
|
case 'highcontrast':
|
|
@@ -3814,7 +3845,7 @@ function getThemeStyle(theme) {
|
|
|
3814
3845
|
shapeFill: '#A6A6A6',
|
|
3815
3846
|
rectangleZoomFillColor: '#d3d3d3',
|
|
3816
3847
|
rectangleZoomFillOpacity: 0.5,
|
|
3817
|
-
rectangleZoomBorderColor:
|
|
3848
|
+
rectangleZoomBorderColor: '#009900'
|
|
3818
3849
|
};
|
|
3819
3850
|
break;
|
|
3820
3851
|
case 'bootstrap4':
|
|
@@ -3842,7 +3873,7 @@ function getThemeStyle(theme) {
|
|
|
3842
3873
|
shapeFill: '#A6A6A6',
|
|
3843
3874
|
rectangleZoomFillColor: '#d3d3d3',
|
|
3844
3875
|
rectangleZoomFillOpacity: 0.5,
|
|
3845
|
-
rectangleZoomBorderColor:
|
|
3876
|
+
rectangleZoomBorderColor: '#009900'
|
|
3846
3877
|
};
|
|
3847
3878
|
break;
|
|
3848
3879
|
case 'tailwind':
|
|
@@ -3870,7 +3901,7 @@ function getThemeStyle(theme) {
|
|
|
3870
3901
|
shapeFill: '#E5E7EB',
|
|
3871
3902
|
rectangleZoomFillColor: '#d3d3d3',
|
|
3872
3903
|
rectangleZoomFillOpacity: 0.5,
|
|
3873
|
-
rectangleZoomBorderColor:
|
|
3904
|
+
rectangleZoomBorderColor: '#009900'
|
|
3874
3905
|
};
|
|
3875
3906
|
break;
|
|
3876
3907
|
case 'tailwinddark':
|
|
@@ -3898,7 +3929,7 @@ function getThemeStyle(theme) {
|
|
|
3898
3929
|
shapeFill: '#374151',
|
|
3899
3930
|
rectangleZoomFillColor: '#d3d3d3',
|
|
3900
3931
|
rectangleZoomFillOpacity: 0.5,
|
|
3901
|
-
rectangleZoomBorderColor:
|
|
3932
|
+
rectangleZoomBorderColor: '#009900'
|
|
3902
3933
|
};
|
|
3903
3934
|
break;
|
|
3904
3935
|
case 'bootstrap5':
|
|
@@ -3926,7 +3957,7 @@ function getThemeStyle(theme) {
|
|
|
3926
3957
|
shapeFill: '#E9ECEF',
|
|
3927
3958
|
rectangleZoomFillColor: '#d3d3d3',
|
|
3928
3959
|
rectangleZoomFillOpacity: 0.5,
|
|
3929
|
-
rectangleZoomBorderColor:
|
|
3960
|
+
rectangleZoomBorderColor: '#009900'
|
|
3930
3961
|
};
|
|
3931
3962
|
break;
|
|
3932
3963
|
case 'bootstrap5dark':
|
|
@@ -3954,7 +3985,7 @@ function getThemeStyle(theme) {
|
|
|
3954
3985
|
shapeFill: '#495057',
|
|
3955
3986
|
rectangleZoomFillColor: '#d3d3d3',
|
|
3956
3987
|
rectangleZoomFillOpacity: 0.5,
|
|
3957
|
-
rectangleZoomBorderColor:
|
|
3988
|
+
rectangleZoomBorderColor: '#009900'
|
|
3958
3989
|
};
|
|
3959
3990
|
break;
|
|
3960
3991
|
case 'fluent':
|
|
@@ -3982,7 +4013,7 @@ function getThemeStyle(theme) {
|
|
|
3982
4013
|
shapeFill: '#F3F2F1',
|
|
3983
4014
|
rectangleZoomFillColor: '#d3d3d3',
|
|
3984
4015
|
rectangleZoomFillOpacity: 0.5,
|
|
3985
|
-
rectangleZoomBorderColor:
|
|
4016
|
+
rectangleZoomBorderColor: '#009900'
|
|
3986
4017
|
};
|
|
3987
4018
|
break;
|
|
3988
4019
|
case 'fluentdark':
|
|
@@ -4010,7 +4041,7 @@ function getThemeStyle(theme) {
|
|
|
4010
4041
|
shapeFill: '#252423',
|
|
4011
4042
|
rectangleZoomFillColor: '#d3d3d3',
|
|
4012
4043
|
rectangleZoomFillOpacity: 0.5,
|
|
4013
|
-
rectangleZoomBorderColor:
|
|
4044
|
+
rectangleZoomBorderColor: '#009900'
|
|
4014
4045
|
};
|
|
4015
4046
|
break;
|
|
4016
4047
|
case 'material3':
|
|
@@ -4039,7 +4070,7 @@ function getThemeStyle(theme) {
|
|
|
4039
4070
|
shapeFill: '#E7E0EC',
|
|
4040
4071
|
rectangleZoomFillColor: '#6750A4',
|
|
4041
4072
|
rectangleZoomFillOpacity: 0.24,
|
|
4042
|
-
rectangleZoomBorderColor:
|
|
4073
|
+
rectangleZoomBorderColor: '#6750A4'
|
|
4043
4074
|
};
|
|
4044
4075
|
break;
|
|
4045
4076
|
case 'material3dark':
|
|
@@ -4068,7 +4099,7 @@ function getThemeStyle(theme) {
|
|
|
4068
4099
|
shapeFill: '#49454F',
|
|
4069
4100
|
rectangleZoomFillColor: '#D0BCFF',
|
|
4070
4101
|
rectangleZoomFillOpacity: 0.24,
|
|
4071
|
-
rectangleZoomBorderColor:
|
|
4102
|
+
rectangleZoomBorderColor: '#D0BCFF'
|
|
4072
4103
|
};
|
|
4073
4104
|
break;
|
|
4074
4105
|
default:
|
|
@@ -4093,7 +4124,7 @@ function getThemeStyle(theme) {
|
|
|
4093
4124
|
shapeFill: '#A6A6A6',
|
|
4094
4125
|
rectangleZoomFillColor: '#d3d3d3',
|
|
4095
4126
|
rectangleZoomFillOpacity: 0.5,
|
|
4096
|
-
rectangleZoomBorderColor:
|
|
4127
|
+
rectangleZoomBorderColor: '#009900'
|
|
4097
4128
|
};
|
|
4098
4129
|
break;
|
|
4099
4130
|
}
|
|
@@ -5048,7 +5079,7 @@ __decorate$1([
|
|
|
5048
5079
|
* Gets or sets the options to customize the markers in the maps.
|
|
5049
5080
|
*/
|
|
5050
5081
|
class MarkerSettings extends MarkerBase {
|
|
5051
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
5082
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/explicit-module-boundary-types
|
|
5052
5083
|
constructor(parent, propName, defaultValue, isArray) {
|
|
5053
5084
|
super(parent, propName, defaultValue, isArray);
|
|
5054
5085
|
}
|
|
@@ -5437,8 +5468,12 @@ class BingMap {
|
|
|
5437
5468
|
* ColorMapping class
|
|
5438
5469
|
*/
|
|
5439
5470
|
class ColorMapping {
|
|
5471
|
+
/* eslint-disable @typescript-eslint/no-unused-vars */
|
|
5472
|
+
/* eslint-disable @typescript-eslint/no-empty-function */
|
|
5440
5473
|
constructor(maps) {
|
|
5441
5474
|
}
|
|
5475
|
+
/* eslint-enable @typescript-eslint/no-unused-vars */
|
|
5476
|
+
/* eslint-enable @typescript-eslint/no-empty-function */
|
|
5442
5477
|
/**
|
|
5443
5478
|
* To get color based on shape settings.
|
|
5444
5479
|
*
|
|
@@ -5864,7 +5899,7 @@ class LayerPanel {
|
|
|
5864
5899
|
if (panel.mapObject.markerModule) {
|
|
5865
5900
|
panel.mapObject.markerModule.markerRender(this.mapObject, panel.layerObject, layerIndex, panel.mapObject.tileZoomLevel, null);
|
|
5866
5901
|
}
|
|
5867
|
-
panel.translateLayerElements(panel.layerObject
|
|
5902
|
+
panel.translateLayerElements(panel.layerObject);
|
|
5868
5903
|
panel.layerGroup.appendChild(panel.layerObject);
|
|
5869
5904
|
}
|
|
5870
5905
|
processLayers(layer, layerIndex) {
|
|
@@ -5891,6 +5926,7 @@ class LayerPanel {
|
|
|
5891
5926
|
cancel: false, name: layerRendering, index: layerIndex,
|
|
5892
5927
|
layer: layer, maps: this.mapObject, visible: layer.visible
|
|
5893
5928
|
};
|
|
5929
|
+
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
5894
5930
|
this.mapObject.trigger('layerRendering', eventArgs, (observedArgs) => {
|
|
5895
5931
|
if (!eventArgs.cancel && eventArgs.visible) {
|
|
5896
5932
|
if (layer.layerType === 'OSM') {
|
|
@@ -6016,9 +6052,8 @@ class LayerPanel {
|
|
|
6016
6052
|
}
|
|
6017
6053
|
this.rectBounds = null;
|
|
6018
6054
|
const shapeSettings = this.currentLayer.shapeSettings;
|
|
6019
|
-
const bubbleSettings = this.currentLayer.bubbleSettings;
|
|
6020
6055
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
6021
|
-
Array.prototype.forEach.call(renderData, (geometryData
|
|
6056
|
+
Array.prototype.forEach.call(renderData, (geometryData) => {
|
|
6022
6057
|
if (!isNullOrUndefined(geometryData['geometry']) || !isNullOrUndefined(geometryData['coordinates'])) {
|
|
6023
6058
|
const type = !isNullOrUndefined(geometryData['geometry']) ? geometryData['geometry']['type'] : geometryData['type'];
|
|
6024
6059
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
@@ -6225,7 +6260,7 @@ class LayerPanel {
|
|
|
6225
6260
|
const circleRadius = (this.mapObject.layers[layerIndex].type !== 'SubLayer') ? shapeSettings.circleRadius : shapeSettings.circleRadius / (this.mapObject.isTileMap ? this.mapObject.scale : this.currentFactor);
|
|
6226
6261
|
circleOptions = new CircleOption((shapeID + '_multiLine_' + index), eventArgs.fill, eventArgs.border, opacity, pointData['x'], pointData['y'], circleRadius, shapeSettings.dashArray);
|
|
6227
6262
|
pathEle = this.mapObject.renderer.drawCircle(circleOptions);
|
|
6228
|
-
this.pathAttributeCalculate(groupElement, pathEle, drawingType, currentShapeData
|
|
6263
|
+
this.pathAttributeCalculate(groupElement, pathEle, drawingType, currentShapeData);
|
|
6229
6264
|
});
|
|
6230
6265
|
break;
|
|
6231
6266
|
case 'Path':
|
|
@@ -6235,7 +6270,7 @@ class LayerPanel {
|
|
|
6235
6270
|
break;
|
|
6236
6271
|
}
|
|
6237
6272
|
if (!isNullOrUndefined(pathEle) && drawingType !== 'MultiPoint') {
|
|
6238
|
-
this.pathAttributeCalculate(groupElement, pathEle, drawingType, currentShapeData
|
|
6273
|
+
this.pathAttributeCalculate(groupElement, pathEle, drawingType, currentShapeData);
|
|
6239
6274
|
}
|
|
6240
6275
|
if (i === this.currentLayer.layerData.length - 1) {
|
|
6241
6276
|
this.layerFeatures(layerIndex, colors, renderData, labelTemplateEle);
|
|
@@ -6256,12 +6291,11 @@ class LayerPanel {
|
|
|
6256
6291
|
* @param {Element} pathEle - Specifies the svg element.
|
|
6257
6292
|
* @param {string} drawingType - Specifies the data type.
|
|
6258
6293
|
* @param {any} currentShapeData - Specifies the layer of shapedata.
|
|
6259
|
-
* @param {number} index - Specifies the tab index.
|
|
6260
6294
|
* @returns {void}
|
|
6261
6295
|
*/
|
|
6262
6296
|
pathAttributeCalculate(groupElement, pathEle, drawingType,
|
|
6263
6297
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
6264
|
-
currentShapeData
|
|
6298
|
+
currentShapeData) {
|
|
6265
6299
|
const property = (Object.prototype.toString.call(this.currentLayer.shapePropertyPath) === '[object Array]' ?
|
|
6266
6300
|
this.currentLayer.shapePropertyPath : [this.currentLayer.shapePropertyPath]);
|
|
6267
6301
|
let properties;
|
|
@@ -6305,7 +6339,7 @@ class LayerPanel {
|
|
|
6305
6339
|
*
|
|
6306
6340
|
* @param {number} layerIndex - Specifies the layer index
|
|
6307
6341
|
* @param {string[]} colors - Specifies the colors
|
|
6308
|
-
* @param {
|
|
6342
|
+
* @param {any[]} renderData - Specifies the render data
|
|
6309
6343
|
* @param {HTMLElement} labelTemplateEle - Specifies the label template element
|
|
6310
6344
|
* @returns {void}
|
|
6311
6345
|
*/
|
|
@@ -6314,7 +6348,8 @@ class LayerPanel {
|
|
|
6314
6348
|
layerIndex, colors, renderData, labelTemplateEle) {
|
|
6315
6349
|
let bubbleG;
|
|
6316
6350
|
if (this.mapObject.polygonModule) {
|
|
6317
|
-
this.groupElements.push(this.mapObject.polygonModule.polygonRender(this.mapObject, layerIndex, (this.mapObject.isTileMap ? Math.floor(this.currentFactor)
|
|
6351
|
+
this.groupElements.push(this.mapObject.polygonModule.polygonRender(this.mapObject, layerIndex, (this.mapObject.isTileMap ? Math.floor(this.currentFactor)
|
|
6352
|
+
: this.currentFactor)));
|
|
6318
6353
|
}
|
|
6319
6354
|
if (this.currentLayer.bubbleSettings.length && this.mapObject.bubbleModule) {
|
|
6320
6355
|
const length = this.currentLayer.bubbleSettings.length;
|
|
@@ -6328,7 +6363,6 @@ class LayerPanel {
|
|
|
6328
6363
|
this.bubbleCalculation(bubble, range);
|
|
6329
6364
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
6330
6365
|
const bubbleDataSource = bubble.dataSource;
|
|
6331
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
6332
6366
|
this.mapObject.bubbleModule.bubbleCollection = [];
|
|
6333
6367
|
bubbleDataSource.map((bubbleData, i) => {
|
|
6334
6368
|
this.renderBubble(this.currentLayer, bubbleData, colors[i % colors.length], range, j, i, bubbleG, layerIndex, bubble);
|
|
@@ -6362,7 +6396,7 @@ class LayerPanel {
|
|
|
6362
6396
|
this.mapObject.markerModule.markerRender(this.mapObject, this.layerObject, layerIndex, (this.mapObject.isTileMap ? Math.floor(this.currentFactor) :
|
|
6363
6397
|
this.currentFactor), null);
|
|
6364
6398
|
}
|
|
6365
|
-
this.translateLayerElements(this.layerObject
|
|
6399
|
+
this.translateLayerElements(this.layerObject);
|
|
6366
6400
|
this.layerGroup.appendChild(this.layerObject);
|
|
6367
6401
|
}
|
|
6368
6402
|
/**
|
|
@@ -6411,6 +6445,8 @@ class LayerPanel {
|
|
|
6411
6445
|
* @param {object} bubbleData - Specifies the bubble data
|
|
6412
6446
|
* @param {string} color - Specifies the color
|
|
6413
6447
|
* @param {number} range - Specifies the range
|
|
6448
|
+
* @param {number} range.min - Specifies the minimum range
|
|
6449
|
+
* @param {number} range.max - Specifies the maximum range
|
|
6414
6450
|
* @param {number} bubbleIndex - Specifies the bubble index
|
|
6415
6451
|
* @param {number} dataIndex - Specifies the data index
|
|
6416
6452
|
* @param {number} group - Specifies the group
|
|
@@ -6433,9 +6469,9 @@ class LayerPanel {
|
|
|
6433
6469
|
* To get the shape color from color mapping module
|
|
6434
6470
|
*
|
|
6435
6471
|
* @param {LayerSettingsModel} layer - Specifies the layer
|
|
6436
|
-
* @param {
|
|
6472
|
+
* @param {any} shape - Specifies the shape
|
|
6437
6473
|
* @param {string} color - Specifies the color
|
|
6438
|
-
* @returns {
|
|
6474
|
+
* @returns {any} - Returns the object
|
|
6439
6475
|
*/
|
|
6440
6476
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
6441
6477
|
getShapeColorMapping(layer, shape, color) {
|
|
@@ -6460,7 +6496,7 @@ class LayerPanel {
|
|
|
6460
6496
|
switch (type.toLowerCase()) {
|
|
6461
6497
|
case 'polygon':
|
|
6462
6498
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
6463
|
-
newData = this.calculatePolygonBox(coordinates[0]
|
|
6499
|
+
newData = this.calculatePolygonBox(coordinates[0]);
|
|
6464
6500
|
if (newData.length > 0) {
|
|
6465
6501
|
newData['property'] = properties;
|
|
6466
6502
|
newData['type'] = type;
|
|
@@ -6474,7 +6510,7 @@ class LayerPanel {
|
|
|
6474
6510
|
for (let i = 0; i < coordinates.length; i++) {
|
|
6475
6511
|
for (let j = 0; j < coordinates[i].length; j++) {
|
|
6476
6512
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
6477
|
-
newData = this.calculatePolygonBox(coordinates[i][j]
|
|
6513
|
+
newData = this.calculatePolygonBox(coordinates[i][j]);
|
|
6478
6514
|
if (newData.length > 0) {
|
|
6479
6515
|
multiPolygonDatas.push(newData);
|
|
6480
6516
|
}
|
|
@@ -6618,7 +6654,7 @@ class LayerPanel {
|
|
|
6618
6654
|
}
|
|
6619
6655
|
return (Math.min(verFactor, horFactor));
|
|
6620
6656
|
}
|
|
6621
|
-
translateLayerElements(layerElement
|
|
6657
|
+
translateLayerElements(layerElement) {
|
|
6622
6658
|
let childNode;
|
|
6623
6659
|
this.mapObject.translateType = 'layer';
|
|
6624
6660
|
if (!isNullOrUndefined(this.mapObject.baseMapRectBounds)) {
|
|
@@ -6678,7 +6714,7 @@ class LayerPanel {
|
|
|
6678
6714
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
6679
6715
|
calculateRectBounds(layerData) {
|
|
6680
6716
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
6681
|
-
Array.prototype.forEach.call(layerData, (obj
|
|
6717
|
+
Array.prototype.forEach.call(layerData, (obj) => {
|
|
6682
6718
|
if (!isNullOrUndefined(obj['geometry']) || !isNullOrUndefined(obj['coordinates'])) {
|
|
6683
6719
|
const type = !isNullOrUndefined(obj['geometry']) ? obj['geometry']['type'] : obj['type'];
|
|
6684
6720
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
@@ -6690,13 +6726,13 @@ class LayerPanel {
|
|
|
6690
6726
|
break;
|
|
6691
6727
|
case 'multipolygon':
|
|
6692
6728
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
6693
|
-
coordinates.map((point
|
|
6729
|
+
coordinates.map((point) => {
|
|
6694
6730
|
this.calculateRectBox(point[0]);
|
|
6695
6731
|
});
|
|
6696
6732
|
break;
|
|
6697
6733
|
case 'multilinestring':
|
|
6698
6734
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
6699
|
-
coordinates.map((multiPoint
|
|
6735
|
+
coordinates.map((multiPoint) => {
|
|
6700
6736
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
6701
6737
|
multiPoint.map((point, index) => {
|
|
6702
6738
|
this.calculateRectBox(point, 'multilinestring', index === 0 ? true : false);
|
|
@@ -6723,7 +6759,7 @@ class LayerPanel {
|
|
|
6723
6759
|
});
|
|
6724
6760
|
}
|
|
6725
6761
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
6726
|
-
calculatePolygonBox(coordinates
|
|
6762
|
+
calculatePolygonBox(coordinates) {
|
|
6727
6763
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
6728
6764
|
const newData = [];
|
|
6729
6765
|
const bounds = this.mapObject.baseMapBounds;
|
|
@@ -7179,10 +7215,14 @@ class Annotations {
|
|
|
7179
7215
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
7180
7216
|
this.map.renderReactTemplates();
|
|
7181
7217
|
}
|
|
7182
|
-
// eslint-disable-next-line valid-jsdoc
|
|
7183
7218
|
/**
|
|
7184
7219
|
* To create annotation elements
|
|
7185
7220
|
*
|
|
7221
|
+
* @param {HTMLElement} parentElement - Specifies the parent element in the map.
|
|
7222
|
+
* @param {Annotation} annotation - Specifies the options for customizing the annotation element in maps.
|
|
7223
|
+
* @param {number} annotationIndex - Specifies the index of the annotation.
|
|
7224
|
+
* @returns {void}
|
|
7225
|
+
*
|
|
7186
7226
|
* @private
|
|
7187
7227
|
*/
|
|
7188
7228
|
createAnnotationTemplate(parentElement, annotation, annotationIndex) {
|
|
@@ -7193,7 +7233,6 @@ class Annotations {
|
|
|
7193
7233
|
const map = this.map;
|
|
7194
7234
|
let templateElement;
|
|
7195
7235
|
const availSize = map.availableSize;
|
|
7196
|
-
const id = map.element.id + '_Annotation_' + annotationIndex;
|
|
7197
7236
|
const childElement = createElement('div', {
|
|
7198
7237
|
id: map.element.id + '_Annotation_' + annotationIndex
|
|
7199
7238
|
});
|
|
@@ -7202,6 +7241,7 @@ class Annotations {
|
|
|
7202
7241
|
cancel: false, name: annotationRendering, content: annotation.content,
|
|
7203
7242
|
annotation: annotation
|
|
7204
7243
|
};
|
|
7244
|
+
//eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
7205
7245
|
this.map.trigger(annotationRendering, argsData, (annotationArgs) => {
|
|
7206
7246
|
if (argsData.cancel) {
|
|
7207
7247
|
return;
|
|
@@ -7571,15 +7611,18 @@ let Maps = class Maps extends Component {
|
|
|
7571
7611
|
}
|
|
7572
7612
|
});
|
|
7573
7613
|
}
|
|
7574
|
-
|
|
7614
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
7575
7615
|
processAjaxRequest(layer, localAjax, type) {
|
|
7576
7616
|
this.serverProcess['request']++;
|
|
7577
7617
|
const fetchApiModule = new Fetch(localAjax.dataOptions, localAjax.type, localAjax.contentType);
|
|
7618
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
7578
7619
|
fetchApiModule.onSuccess = (args) => {
|
|
7579
7620
|
if (!isNullOrUndefined(args.type) && args.type === 'application/octet-stream') {
|
|
7580
7621
|
const reader = new FileReader();
|
|
7622
|
+
//eslint-disable-next-line @typescript-eslint/no-this-alias
|
|
7581
7623
|
const map = this;
|
|
7582
|
-
|
|
7624
|
+
// eslint-disable-next-line @typescript-eslint/tslint/config
|
|
7625
|
+
reader.onload = function () {
|
|
7583
7626
|
args = JSON.parse(reader.result.toString());
|
|
7584
7627
|
map.processResponseJsonData('Fetch', args, layer, type);
|
|
7585
7628
|
};
|
|
@@ -7601,13 +7644,17 @@ let Maps = class Maps extends Component {
|
|
|
7601
7644
|
* @returns {void}
|
|
7602
7645
|
* @private
|
|
7603
7646
|
*/
|
|
7604
|
-
processResponseJsonData(processType,
|
|
7647
|
+
processResponseJsonData(processType,
|
|
7648
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
7649
|
+
data, layer, dataType) {
|
|
7605
7650
|
this.serverProcess['response']++;
|
|
7606
7651
|
if (processType) {
|
|
7607
7652
|
if (dataType === 'ShapeData') {
|
|
7653
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
7608
7654
|
layer.shapeData = (processType === 'DataManager') ? processResult(data) : data;
|
|
7609
7655
|
}
|
|
7610
7656
|
else {
|
|
7657
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
7611
7658
|
layer.dataSource = (processType === 'DataManager') ? processResult(data) : data;
|
|
7612
7659
|
}
|
|
7613
7660
|
}
|
|
@@ -7746,12 +7793,14 @@ let Maps = class Maps extends Component {
|
|
|
7746
7793
|
triggerZoomEvent() {
|
|
7747
7794
|
let loadedArgs;
|
|
7748
7795
|
const minMaxLatitudeLongitude = this.getMinMaxLatitudeLongitude();
|
|
7796
|
+
// eslint-disable-next-line prefer-const
|
|
7749
7797
|
loadedArgs = {
|
|
7750
7798
|
maps: this, isResized: this.isResize, minLatitude: minMaxLatitudeLongitude.minLatitude,
|
|
7751
7799
|
maxLatitude: minMaxLatitudeLongitude.maxLatitude, minLongitude: minMaxLatitudeLongitude.minLongitude,
|
|
7752
7800
|
maxLongitude: minMaxLatitudeLongitude.maxLongitude, cancel: false, name: 'Loaded'
|
|
7753
7801
|
};
|
|
7754
7802
|
this.trigger('loaded', loadedArgs);
|
|
7803
|
+
//eslint-enable @typescript-eslint/prefer-const
|
|
7755
7804
|
}
|
|
7756
7805
|
/**
|
|
7757
7806
|
* To apply color to the initial selected marker
|
|
@@ -7759,7 +7808,7 @@ let Maps = class Maps extends Component {
|
|
|
7759
7808
|
* @param {SelectionSettingsModel} selectionSettings - Specifies the selection settings
|
|
7760
7809
|
* @param {Maps} map - Specifies the instance of the maps
|
|
7761
7810
|
* @param {Element} targetElement - Specifies the target element
|
|
7762
|
-
* @param {
|
|
7811
|
+
* @param {object} data - Specifies the data
|
|
7763
7812
|
* @returns {void}
|
|
7764
7813
|
* @private
|
|
7765
7814
|
*/
|
|
@@ -7810,6 +7859,7 @@ let Maps = class Maps extends Component {
|
|
|
7810
7859
|
const selectionSettings = markerSettings.selectionSettings;
|
|
7811
7860
|
if (selectionSettings.enable) {
|
|
7812
7861
|
for (let i = 0; i < markerSettings.dataSource['length']; i++) {
|
|
7862
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
7813
7863
|
const data = markerSettings.dataSource[i];
|
|
7814
7864
|
if (data['latitude'] === latitude && data['longitude'] === longitude) {
|
|
7815
7865
|
const targetId = this.element.id + '_' + 'LayerIndex_' + layerIndex + '_MarkerIndex_' + markerIndex +
|
|
@@ -7847,11 +7897,11 @@ let Maps = class Maps extends Component {
|
|
|
7847
7897
|
this.element.tabIndex = this.tabIndex;
|
|
7848
7898
|
}
|
|
7849
7899
|
setSecondaryElementPosition() {
|
|
7850
|
-
|
|
7851
|
-
|
|
7852
|
-
|
|
7900
|
+
const element = getElementByID(this.element.id + '_Secondary_Element');
|
|
7901
|
+
const rect = this.element.getBoundingClientRect();
|
|
7902
|
+
const svgElement = getElementByID(this.element.id + '_svg');
|
|
7853
7903
|
if (!isNullOrUndefined(svgElement)) {
|
|
7854
|
-
|
|
7904
|
+
const svgRect = svgElement.getBoundingClientRect();
|
|
7855
7905
|
element.style.left = Math.max(svgRect.left - rect.left, 0) + 'px';
|
|
7856
7906
|
element.style.top = Math.max(svgRect.top - rect.top, 0) + 'px';
|
|
7857
7907
|
}
|
|
@@ -7931,8 +7981,10 @@ let Maps = class Maps extends Component {
|
|
|
7931
7981
|
const mapsElement = document.getElementById(this.element.id);
|
|
7932
7982
|
if (!isNullOrUndefined(mapsElement)) {
|
|
7933
7983
|
const element = mapsElement.getBoundingClientRect();
|
|
7934
|
-
|
|
7935
|
-
|
|
7984
|
+
const minPosition = this.isTileMap ?
|
|
7985
|
+
this.pointToLatLong((this.mapAreaRect.x - this.margin.left), -this.mapAreaRect.y) :
|
|
7986
|
+
this.getGeoLocation(0, (this.mapAreaRect.x + element.left), this.mapAreaRect.y);
|
|
7987
|
+
const maxPosition = this.isTileMap ? this.pointToLatLong(this.mapAreaRect.width, (this.mapAreaRect.height - this.mapAreaRect.y)) :
|
|
7936
7988
|
this.getGeoLocation(0, (this.mapAreaRect.x + element.left + this.mapAreaRect.width), (this.mapAreaRect.y + this.mapAreaRect.height));
|
|
7937
7989
|
const MinMaxLatitudeLongitude = {
|
|
7938
7990
|
minLatitude: minPosition.latitude, maxLatitude: maxPosition.latitude, minLongitude: minPosition.longitude,
|
|
@@ -7956,7 +8008,7 @@ let Maps = class Maps extends Component {
|
|
|
7956
8008
|
const templateElements = document.getElementsByClassName(this.element.id + '_template');
|
|
7957
8009
|
if (!isNullOrUndefined(templateElements) && templateElements.length > 0 &&
|
|
7958
8010
|
getElementByID(this.element.id + '_Layer_Collections') && !this.isTileMap) {
|
|
7959
|
-
Array.prototype.forEach.call(templateElements, (templateGroupEle
|
|
8011
|
+
Array.prototype.forEach.call(templateElements, (templateGroupEle) => {
|
|
7960
8012
|
let offSetLetValue = 0;
|
|
7961
8013
|
let offSetTopValue = 0;
|
|
7962
8014
|
if (!isNullOrUndefined(templateGroupEle) && templateGroupEle.childElementCount > 0) {
|
|
@@ -7968,9 +8020,9 @@ let Maps = class Maps extends Component {
|
|
|
7968
8020
|
offSetTopValue = this.isTileMap ? 0 : (layerOffset.top < elementOffset.top) ?
|
|
7969
8021
|
-(Math.abs(elementOffset.top - layerOffset.top)) : Math.abs(elementOffset.top - layerOffset.top);
|
|
7970
8022
|
}
|
|
7971
|
-
Array.prototype.forEach.call(templateGroupEle.childNodes, (currentTemplate
|
|
8023
|
+
Array.prototype.forEach.call(templateGroupEle.childNodes, (currentTemplate) => {
|
|
7972
8024
|
if (currentTemplate.id.indexOf('Marker') !== -1) {
|
|
7973
|
-
if (currentTemplate.style.visibility
|
|
8025
|
+
if (currentTemplate.style.visibility !== 'hidden') {
|
|
7974
8026
|
const elementOffset = getElementByID(currentTemplate.id).getBoundingClientRect();
|
|
7975
8027
|
currentTemplate.style.left = parseFloat(currentTemplate.style.left) - (this.isTileMap ? 0 : elementOffset.width / 2) + 'px';
|
|
7976
8028
|
currentTemplate.style.top = parseFloat(currentTemplate.style.top) - (this.isTileMap ? 0 : elementOffset.height / 2) + 'px';
|
|
@@ -8028,6 +8080,7 @@ let Maps = class Maps extends Component {
|
|
|
8028
8080
|
}
|
|
8029
8081
|
findBaseAndSubLayers() {
|
|
8030
8082
|
const baseIndex = this.baseLayerIndex;
|
|
8083
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
8031
8084
|
const mainLayers = [];
|
|
8032
8085
|
const subLayers = [];
|
|
8033
8086
|
this.layersCollection = [];
|
|
@@ -8202,6 +8255,7 @@ let Maps = class Maps extends Component {
|
|
|
8202
8255
|
* @returns {void}
|
|
8203
8256
|
* @private
|
|
8204
8257
|
*/
|
|
8258
|
+
//eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
8205
8259
|
mouseLeaveOnMap(e) {
|
|
8206
8260
|
if (document.getElementsByClassName('highlightMapStyle').length > 0 && this.legendModule) {
|
|
8207
8261
|
this.legendModule.removeShapeHighlightCollection();
|
|
@@ -8227,7 +8281,7 @@ let Maps = class Maps extends Component {
|
|
|
8227
8281
|
keyboardHighlightSelection(id, key) {
|
|
8228
8282
|
const layerIndex = parseInt(id.split('_LayerIndex_')[1].split('_')[0], 10);
|
|
8229
8283
|
const shapeIndex = parseInt(id.split('_shapeIndex_')[1].split('_')[0], 10);
|
|
8230
|
-
//
|
|
8284
|
+
//eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
8231
8285
|
const shapeData = this.layers[layerIndex].shapeData['features']['length'] > shapeIndex ?
|
|
8232
8286
|
this.layers[layerIndex].shapeData['features'][shapeIndex]['properties'] : null;
|
|
8233
8287
|
const dataIndex = parseInt(id.split('_dataIndex_')[1].split('_')[0], 10);
|
|
@@ -8356,11 +8410,13 @@ let Maps = class Maps extends Component {
|
|
|
8356
8410
|
};
|
|
8357
8411
|
if (this.onclick) {
|
|
8358
8412
|
eventArgs.name = onclick;
|
|
8413
|
+
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
8359
8414
|
this.trigger('onclick', eventArgs, (mouseArgs) => {
|
|
8360
8415
|
this.clickHandler(e, eventArgs, targetEle);
|
|
8361
8416
|
});
|
|
8362
8417
|
}
|
|
8363
8418
|
else {
|
|
8419
|
+
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
8364
8420
|
this.trigger('click', eventArgs, (mouseArgs) => {
|
|
8365
8421
|
this.clickHandler(e, eventArgs, targetEle);
|
|
8366
8422
|
});
|
|
@@ -8405,7 +8461,7 @@ let Maps = class Maps extends Component {
|
|
|
8405
8461
|
}
|
|
8406
8462
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
8407
8463
|
getMarkerClickLocation(pageX, pageY, x, y, marker$$1, isDragEnd) {
|
|
8408
|
-
document.getElementById(this.element.id +
|
|
8464
|
+
document.getElementById(this.element.id + '_svg').style.cursor = 'grabbing';
|
|
8409
8465
|
const targetElement = getElement(marker$$1.targetId);
|
|
8410
8466
|
let latLongValue = this.getClickLocation(marker$$1.targetId, pageX, pageY, targetElement, x, y);
|
|
8411
8467
|
const location = (this.isTileMap) ? convertTileLatLongToPoint(new MapLocation(latLongValue.longitude, latLongValue.latitude), this.tileZoomLevel, this.tileTranslatePoint, true) : convertGeoToPoint(latLongValue.latitude, latLongValue.longitude, this.mapLayerPanel.currentFactor, this.layersCollection[marker$$1.layerIndex], this);
|
|
@@ -8424,9 +8480,24 @@ let Maps = class Maps extends Component {
|
|
|
8424
8480
|
}
|
|
8425
8481
|
return latLongValue;
|
|
8426
8482
|
}
|
|
8427
|
-
/**
|
|
8483
|
+
/**
|
|
8484
|
+
* Gets the location of the mouse click
|
|
8485
|
+
*
|
|
8486
|
+
* @param {string} targetId - Specifies the ID for the target.
|
|
8487
|
+
* @param {number} pageX - Defines the page X position.
|
|
8488
|
+
* @param {number} pageY - Defines the page Y position.
|
|
8489
|
+
* @param {HTMLElement} targetElement - Specifies the target element on the event.
|
|
8490
|
+
* @param {number} x - Defines the x position in pixel.
|
|
8491
|
+
* @param {number} y - Defines the y position in pixel.
|
|
8492
|
+
* @param {string} type - Specifies the type.
|
|
8493
|
+
* @returns {GeoPosition} - Returns the position of the event
|
|
8494
|
+
*
|
|
8495
|
+
* @private
|
|
8496
|
+
*
|
|
8497
|
+
*/
|
|
8428
8498
|
getClickLocation(targetId, pageX, pageY, targetElement, x, y, type) {
|
|
8429
8499
|
let layerIndex = 0;
|
|
8500
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
8430
8501
|
let latLongValue;
|
|
8431
8502
|
if (targetId.indexOf('_LayerIndex_') !== -1 && !this.isTileMap && (!isNullOrUndefined(type) ||
|
|
8432
8503
|
((parseInt(this.mouseDownEvent['x'], 10) === parseInt(this.mouseClickEvent['x'], 10)) &&
|
|
@@ -8434,6 +8505,7 @@ let Maps = class Maps extends Component {
|
|
|
8434
8505
|
layerIndex = parseFloat(targetId.split('_LayerIndex_')[1].split('_')[0]);
|
|
8435
8506
|
if (this.layers[layerIndex].geometryType === 'Normal') {
|
|
8436
8507
|
if (targetId.indexOf('_shapeIndex_') > -1) {
|
|
8508
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
8437
8509
|
const immediateParent = targetElement.parentElement;
|
|
8438
8510
|
const parentElement = immediateParent.id.indexOf('_Point_Group') > -1 || immediateParent.id.indexOf('_LineString_Group') > -1
|
|
8439
8511
|
|| immediateParent.id.indexOf('_MultiLineString_Group') > -1 || immediateParent.id.indexOf('_Polygon_Group') > -1 ?
|
|
@@ -8447,9 +8519,11 @@ let Maps = class Maps extends Component {
|
|
|
8447
8519
|
longitude: Math.abs((location.x / zoomScaleValue) + this.baseMapBounds.longitude.min)
|
|
8448
8520
|
};
|
|
8449
8521
|
if (this.baseMapBounds.longitude.min < 0 && minLongitude > location.x) {
|
|
8522
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
8450
8523
|
latLongValue.longitude = -latLongValue.longitude;
|
|
8451
8524
|
}
|
|
8452
8525
|
if (this.baseMapBounds.latitude.min < 0 && minLatitude > location.y) {
|
|
8526
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
8453
8527
|
latLongValue.latitude = -latLongValue.latitude;
|
|
8454
8528
|
}
|
|
8455
8529
|
}
|
|
@@ -8457,6 +8531,7 @@ let Maps = class Maps extends Component {
|
|
|
8457
8531
|
const markerIndex = parseInt(targetId.split('_MarkerIndex_')[1].split('_')[0], 10);
|
|
8458
8532
|
const dataIndex = parseInt(targetId.split('_dataIndex_')[1].split('_')[0], 10);
|
|
8459
8533
|
if (!isNaN(markerIndex) && !isNaN(dataIndex)) {
|
|
8534
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
8460
8535
|
const dataObject = this.layers[layerIndex].markerSettings[markerIndex].dataSource[dataIndex];
|
|
8461
8536
|
latLongValue = { latitude: dataObject['latitude'], longitude: dataObject.longitude };
|
|
8462
8537
|
}
|
|
@@ -8471,13 +8546,17 @@ let Maps = class Maps extends Component {
|
|
|
8471
8546
|
const minLongitude = Math.abs((-this.baseMapBounds.longitude.min) * this.mapLayerPanel.currentFactor);
|
|
8472
8547
|
const minLatitude = Math.abs(this.baseMapBounds.latitude.max * this.mapLayerPanel.currentFactor);
|
|
8473
8548
|
latLongValue = {
|
|
8474
|
-
latitude: Math.abs(this.baseMapBounds.latitude.max
|
|
8475
|
-
|
|
8549
|
+
latitude: Math.abs(this.baseMapBounds.latitude.max
|
|
8550
|
+
- (location.y / (this.mapLayerPanel.currentFactor * this.scale))),
|
|
8551
|
+
longitude: Math.abs((location.x / (this.mapLayerPanel.currentFactor * this.scale))
|
|
8552
|
+
+ this.baseMapBounds.longitude.min)
|
|
8476
8553
|
};
|
|
8477
8554
|
if (this.baseMapBounds.longitude.min < 0 && minLongitude > location.x) {
|
|
8555
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
8478
8556
|
latLongValue.longitude = -latLongValue.longitude;
|
|
8479
8557
|
}
|
|
8480
8558
|
if (this.baseMapBounds.latitude.min < 0 && minLatitude > location.y) {
|
|
8559
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
8481
8560
|
latLongValue.latitude = -latLongValue.latitude;
|
|
8482
8561
|
}
|
|
8483
8562
|
}
|
|
@@ -8513,25 +8592,17 @@ let Maps = class Maps extends Component {
|
|
|
8513
8592
|
* @private
|
|
8514
8593
|
*/
|
|
8515
8594
|
mouseEndOnMap(e) {
|
|
8516
|
-
const targetEle = e.target;
|
|
8517
|
-
const targetId = targetEle.id;
|
|
8518
8595
|
let pageX;
|
|
8519
|
-
let latitude = null;
|
|
8520
|
-
let longitude = null;
|
|
8521
8596
|
let pageY;
|
|
8522
|
-
let target;
|
|
8523
8597
|
let touchArg;
|
|
8524
8598
|
let layerX = 0;
|
|
8525
8599
|
let layerY = 0;
|
|
8526
|
-
const rect = this.element.getBoundingClientRect();
|
|
8527
|
-
const element = e.target;
|
|
8528
8600
|
if (e.type.indexOf('touch') !== -1) {
|
|
8529
8601
|
this.isTouch = true;
|
|
8530
8602
|
touchArg = e;
|
|
8531
8603
|
layerX = pageX = touchArg.changedTouches[0].pageX;
|
|
8532
8604
|
pageY = touchArg.changedTouches[0].pageY;
|
|
8533
8605
|
layerY = pageY - (this.isTileMap ? 10 : 0);
|
|
8534
|
-
target = touchArg.target;
|
|
8535
8606
|
this.mouseClickEvent = { x: pageX, y: pageY };
|
|
8536
8607
|
}
|
|
8537
8608
|
else {
|
|
@@ -8540,19 +8611,11 @@ let Maps = class Maps extends Component {
|
|
|
8540
8611
|
pageY = e.pageY;
|
|
8541
8612
|
layerX = e['layerX'];
|
|
8542
8613
|
layerY = e['layerY'] - (this.isTileMap ? 10 : 0);
|
|
8543
|
-
target = e.target;
|
|
8544
8614
|
}
|
|
8545
8615
|
if (this.isTileMap) {
|
|
8546
8616
|
this.removeTileMap();
|
|
8547
8617
|
}
|
|
8548
8618
|
if (this.isTouch) {
|
|
8549
|
-
if (targetEle.id.indexOf('_ToolBar') === -1) {
|
|
8550
|
-
const latLongValue = this.getClickLocation(targetId, pageX, pageY, targetEle, pageX, pageY);
|
|
8551
|
-
if (!isNullOrUndefined(latLongValue)) {
|
|
8552
|
-
latitude = latLongValue.latitude;
|
|
8553
|
-
longitude = latLongValue.longitude;
|
|
8554
|
-
}
|
|
8555
|
-
}
|
|
8556
8619
|
this.titleTooltip(e, pageX, pageY, true);
|
|
8557
8620
|
if (!isNullOrUndefined(this.legendModule)) {
|
|
8558
8621
|
this.legendTooltip(e, e.pageX, e.pageY, true);
|
|
@@ -8563,12 +8626,13 @@ let Maps = class Maps extends Component {
|
|
|
8563
8626
|
e.preventDefault();
|
|
8564
8627
|
}
|
|
8565
8628
|
if (!isNullOrUndefined(this.markerDragArgument)) {
|
|
8629
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
8566
8630
|
const marker$$1 = this.markerDragArgument;
|
|
8567
8631
|
this.mouseClickEvent['x'] = this.mouseDownEvent['x'];
|
|
8568
8632
|
this.mouseClickEvent['y'] = this.mouseDownEvent['y'];
|
|
8569
8633
|
const latLongValue = this.getMarkerClickLocation(pageX, pageY, layerX, layerY, this.markerDragArgument, true);
|
|
8570
8634
|
const markerObject = this.layers[marker$$1.layerIndex].markerSettings[marker$$1.markerIndex];
|
|
8571
|
-
document.getElementById(this.element.id +
|
|
8635
|
+
document.getElementById(this.element.id + '_svg').style.cursor = markerObject.enableDrag ? 'pointer' : 'grabbing';
|
|
8572
8636
|
const dragEventArgs = {
|
|
8573
8637
|
name: 'markerDragEnd', x: pageX, y: pageY,
|
|
8574
8638
|
latitude: latLongValue.latitude, longitude: latLongValue.longitude,
|
|
@@ -8595,7 +8659,7 @@ let Maps = class Maps extends Component {
|
|
|
8595
8659
|
this.trigger('markerDragEnd', dragEventArgs);
|
|
8596
8660
|
}
|
|
8597
8661
|
else {
|
|
8598
|
-
document.getElementById(this.element.id +
|
|
8662
|
+
document.getElementById(this.element.id + '_svg').style.cursor = 'auto';
|
|
8599
8663
|
}
|
|
8600
8664
|
if (this.zoomModule && this.isDevice) {
|
|
8601
8665
|
this.zoomModule.removeToolbarOpacity(this.isTileMap ? Math.round(this.tileZoomLevel) : this.scale, this.element.id + '_Zooming_');
|
|
@@ -8612,13 +8676,14 @@ let Maps = class Maps extends Component {
|
|
|
8612
8676
|
*/
|
|
8613
8677
|
mouseDownOnMap(e) {
|
|
8614
8678
|
this.mouseDownEvent = { x: e.x, y: e.y };
|
|
8679
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
8615
8680
|
if (e.type.indexOf('touch') !== -1 && e.changedTouches) {
|
|
8681
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
8616
8682
|
this.mouseDownEvent = { x: e.changedTouches[0].pageX, y: e.changedTouches[0].pageY };
|
|
8617
8683
|
}
|
|
8618
8684
|
if (this.isDevice && !isNullOrUndefined(this.mapsTooltipModule)) {
|
|
8619
8685
|
this.mapsTooltipModule.renderTooltip(e);
|
|
8620
8686
|
}
|
|
8621
|
-
const rect = this.element.getBoundingClientRect();
|
|
8622
8687
|
const element = e.target;
|
|
8623
8688
|
this.markerDragId = element.id;
|
|
8624
8689
|
const animatedTiles = document.getElementById(this.element.id + '_animated_tiles');
|
|
@@ -8649,7 +8714,7 @@ let Maps = class Maps extends Component {
|
|
|
8649
8714
|
mergeCluster() {
|
|
8650
8715
|
if (this.markerModule && (this.markerModule.sameMarkerData.length > 0) &&
|
|
8651
8716
|
(this.zoomModule ? this.zoomModule.isSingleClick : true)) {
|
|
8652
|
-
mergeSeparateCluster(this.markerModule.sameMarkerData, this
|
|
8717
|
+
mergeSeparateCluster(this.markerModule.sameMarkerData, this);
|
|
8653
8718
|
this.markerModule.sameMarkerData = [];
|
|
8654
8719
|
}
|
|
8655
8720
|
}
|
|
@@ -8690,6 +8755,7 @@ let Maps = class Maps extends Component {
|
|
|
8690
8755
|
const targetElement = e.target;
|
|
8691
8756
|
const targetId = targetElement.id;
|
|
8692
8757
|
let layerIndex = 0;
|
|
8758
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
8693
8759
|
let latLongValue;
|
|
8694
8760
|
let latitude = null;
|
|
8695
8761
|
let longitude = null;
|
|
@@ -8735,8 +8801,8 @@ let Maps = class Maps extends Component {
|
|
|
8735
8801
|
if (this.bubbleModule) {
|
|
8736
8802
|
this.bubbleModule.bubbleMove(e);
|
|
8737
8803
|
}
|
|
8738
|
-
if (target.id.indexOf('MarkerIndex')
|
|
8739
|
-
document.getElementById(this.element.id +
|
|
8804
|
+
if (target.id.indexOf('MarkerIndex') === -1) {
|
|
8805
|
+
document.getElementById(this.element.id + '_svg').style.cursor = 'auto';
|
|
8740
8806
|
}
|
|
8741
8807
|
this.onMouseMove(e);
|
|
8742
8808
|
this.notify(Browser.touchMoveEvent, e);
|
|
@@ -8756,7 +8822,7 @@ let Maps = class Maps extends Component {
|
|
|
8756
8822
|
let touches = null;
|
|
8757
8823
|
let layerX = 0;
|
|
8758
8824
|
let layerY = 0;
|
|
8759
|
-
if (e.type.indexOf('touch')
|
|
8825
|
+
if (e.type.indexOf('touch') === -1) {
|
|
8760
8826
|
pageX = e.pageX;
|
|
8761
8827
|
pageY = e.pageY;
|
|
8762
8828
|
layerX = e['layerX'];
|
|
@@ -8772,6 +8838,7 @@ let Maps = class Maps extends Component {
|
|
|
8772
8838
|
layerY = pageY = touches[0].clientY - (this.isTileMap ? 10 : 0);
|
|
8773
8839
|
}
|
|
8774
8840
|
if (!isNullOrUndefined(this.markerDragArgument)) {
|
|
8841
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
8775
8842
|
const marker$$1 = this.markerDragArgument;
|
|
8776
8843
|
this.mouseClickEvent['x'] = this.mouseDownEvent['x'];
|
|
8777
8844
|
this.mouseClickEvent['y'] = this.mouseDownEvent['y'];
|
|
@@ -8787,6 +8854,7 @@ let Maps = class Maps extends Component {
|
|
|
8787
8854
|
let legendText;
|
|
8788
8855
|
let page = this.legendModule.currentPage;
|
|
8789
8856
|
let legendIndex = event.target.id.split('_Index_')[1];
|
|
8857
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
8790
8858
|
let collection;
|
|
8791
8859
|
page = this.legendModule.totalPages.length <= this.legendModule.currentPage
|
|
8792
8860
|
? this.legendModule.totalPages.length - 1 : this.legendModule.currentPage < 0 ?
|
|
@@ -8829,6 +8897,7 @@ let Maps = class Maps extends Component {
|
|
|
8829
8897
|
*
|
|
8830
8898
|
* @param e - Specifies the arguments of window resize event.
|
|
8831
8899
|
*/
|
|
8900
|
+
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
8832
8901
|
mapsOnResize(e) {
|
|
8833
8902
|
if (!this.isDestroyed && !this.isExportInitialTileMap) {
|
|
8834
8903
|
this.isResize = this.isReset = true;
|
|
@@ -8862,6 +8931,8 @@ let Maps = class Maps extends Component {
|
|
|
8862
8931
|
* This method is used to zoom the map by specifying the center position.
|
|
8863
8932
|
*
|
|
8864
8933
|
* @param {number} centerPosition - Specifies the location of the maps to be zoomed as geographical coordinates.
|
|
8934
|
+
* @param {number} centerPosition.longitude - Specifies the longitude of the location to be zoomed.
|
|
8935
|
+
* @param {number} centerPosition.latitude - Specifies the latitude of the location to be zoomed.
|
|
8865
8936
|
* @param {number} zoomFactor - Specifies the zoom factor for the maps.
|
|
8866
8937
|
* @returns {void}
|
|
8867
8938
|
*/
|
|
@@ -9009,9 +9080,11 @@ let Maps = class Maps extends Component {
|
|
|
9009
9080
|
let dataIndex;
|
|
9010
9081
|
let shapeIndex;
|
|
9011
9082
|
let indexValue;
|
|
9083
|
+
/* eslint-disable @typescript-eslint/no-explicit-any */
|
|
9012
9084
|
let shapeDataValue;
|
|
9013
9085
|
let data;
|
|
9014
9086
|
const shapeData = this.layers[layerIndex].shapeData['features'];
|
|
9087
|
+
/* eslint-enable @typescript-eslint/no-explicit-any */
|
|
9015
9088
|
for (let i = 0; i < shapeData.length; i++) {
|
|
9016
9089
|
for (let j = 0; j < popertyNameArray.length; j++) {
|
|
9017
9090
|
const propertyName = !isNullOrUndefined(shapeData[i]['properties'][popertyNameArray[j]])
|
|
@@ -9021,7 +9094,9 @@ let Maps = class Maps extends Component {
|
|
|
9021
9094
|
let k;
|
|
9022
9095
|
if (propertyName === shapeName) {
|
|
9023
9096
|
if (!isNullOrUndefined(this.layers[layerIndex].shapeSettings.colorValuePath)) {
|
|
9024
|
-
k = checkShapeDataFields(
|
|
9097
|
+
k = checkShapeDataFields(
|
|
9098
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
9099
|
+
this.layers[layerIndex].dataSource, shapeData[i]['properties'], this.layers[layerIndex].shapeDataPath, this.layers[layerIndex].shapePropertyPath, this.layers[layerIndex]);
|
|
9025
9100
|
}
|
|
9026
9101
|
const baseLayer = this.layers[layerIndex];
|
|
9027
9102
|
if (this.baseLayerIndex >= 0 && baseLayer.isBaseLayer) {
|
|
@@ -9302,11 +9377,6 @@ let Maps = class Maps extends Component {
|
|
|
9302
9377
|
let isMarker = false;
|
|
9303
9378
|
let isLayer = false;
|
|
9304
9379
|
let isStaticMapType = false;
|
|
9305
|
-
let layerEle;
|
|
9306
|
-
if (newProp['layers']) {
|
|
9307
|
-
const newLayerLength = Object.keys(newProp['layers']).length;
|
|
9308
|
-
layerEle = document.getElementById(this.element.id + '_LayerIndex_' + (newLayerLength - 1));
|
|
9309
|
-
}
|
|
9310
9380
|
for (const prop of Object.keys(newProp)) {
|
|
9311
9381
|
switch (prop) {
|
|
9312
9382
|
case 'background':
|
|
@@ -9571,6 +9641,8 @@ let Maps = class Maps extends Component {
|
|
|
9571
9641
|
}
|
|
9572
9642
|
/**
|
|
9573
9643
|
* To find marker visibility
|
|
9644
|
+
*
|
|
9645
|
+
* @returns {boolean} - Returns whether the bubble is visible or not.
|
|
9574
9646
|
*/
|
|
9575
9647
|
isBubbleVisible() {
|
|
9576
9648
|
let isVisible = false;
|
|
@@ -9625,12 +9697,14 @@ let Maps = class Maps extends Component {
|
|
|
9625
9697
|
allowDownload = true;
|
|
9626
9698
|
}
|
|
9627
9699
|
if ((type !== 'PDF') && (this.allowImageExport) && (this.imageExportModule)) {
|
|
9628
|
-
|
|
9700
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
9701
|
+
return new Promise((resolve) => {
|
|
9629
9702
|
resolve(this.imageExportModule.export(this, type, fileName, allowDownload));
|
|
9630
9703
|
});
|
|
9631
9704
|
}
|
|
9632
9705
|
else if ((this.allowPdfExport) && (this.pdfExportModule)) {
|
|
9633
|
-
|
|
9706
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
9707
|
+
return new Promise((resolve) => {
|
|
9634
9708
|
resolve(this.pdfExportModule.export(this, type, fileName, allowDownload, orientation));
|
|
9635
9709
|
});
|
|
9636
9710
|
}
|
|
@@ -9646,10 +9720,11 @@ let Maps = class Maps extends Component {
|
|
|
9646
9720
|
getBingUrlTemplate(url) {
|
|
9647
9721
|
let promise;
|
|
9648
9722
|
if (!this.isDestroyed) {
|
|
9649
|
-
|
|
9723
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
9724
|
+
promise = new Promise((resolve) => {
|
|
9650
9725
|
const fetchApi = new Fetch({
|
|
9651
9726
|
url: url
|
|
9652
|
-
});
|
|
9727
|
+
}); // eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
9653
9728
|
fetchApi.onSuccess = (json) => {
|
|
9654
9729
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
9655
9730
|
const resource = json['resourceSets'][0]['resources'][0];
|
|
@@ -9669,7 +9744,7 @@ let Maps = class Maps extends Component {
|
|
|
9669
9744
|
* @param {boolean} istooltipVisible - Specifies whether the tooltip is visible or not.
|
|
9670
9745
|
* @param {boolean} isSelection - Specifies whether the shape is selectd or not.
|
|
9671
9746
|
* @param {boolean} isHighlight - Specfies whether the shape is highlighted or not.
|
|
9672
|
-
* @returns {
|
|
9747
|
+
* @returns {object} - Returns the boolean values in object.
|
|
9673
9748
|
*/
|
|
9674
9749
|
findVisibleLayers(layers, isLayerVisible = false, isBubblevisible = false, istooltipVisible = false, isSelection = false, isHighlight = false) {
|
|
9675
9750
|
let bubbles;
|
|
@@ -9681,11 +9756,13 @@ let Maps = class Maps extends Component {
|
|
|
9681
9756
|
bubbles = layer.bubbleSettings;
|
|
9682
9757
|
markers = layer.markerSettings;
|
|
9683
9758
|
polygonSetting = layer.polygonSettings;
|
|
9684
|
-
|
|
9759
|
+
const navigationLine = layer.navigationLineSettings;
|
|
9685
9760
|
for (const navigation of navigationLine) {
|
|
9686
9761
|
if (navigation.visible) {
|
|
9687
|
-
isSelection = (!isNullOrUndefined(navigation.highlightSettings) &&
|
|
9688
|
-
|
|
9762
|
+
isSelection = (!isNullOrUndefined(navigation.highlightSettings) &&
|
|
9763
|
+
navigation.highlightSettings.enable) || isSelection;
|
|
9764
|
+
isHighlight = (!isNullOrUndefined(navigation.selectionSettings) &&
|
|
9765
|
+
navigation.selectionSettings.enable) || isHighlight;
|
|
9689
9766
|
}
|
|
9690
9767
|
}
|
|
9691
9768
|
for (const polygon of polygonSetting.polygons) {
|
|
@@ -9744,6 +9821,7 @@ let Maps = class Maps extends Component {
|
|
|
9744
9821
|
const pageX = x - (isNullOrUndefined(this.markerDragArgument) ? container.offsetLeft : 0);
|
|
9745
9822
|
const pageY = y - (isNullOrUndefined(this.markerDragArgument) ? container.offsetTop : 0);
|
|
9746
9823
|
const currentLayer = this.layersCollection[layerIndex];
|
|
9824
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
9747
9825
|
const translate = getTranslate(this, currentLayer, false);
|
|
9748
9826
|
const translatePoint = translate['location'];
|
|
9749
9827
|
const translatePointX = translatePoint.x * this.scale;
|
|
@@ -9773,6 +9851,7 @@ let Maps = class Maps extends Component {
|
|
|
9773
9851
|
if (!this.isDestroyed) {
|
|
9774
9852
|
const container = document.getElementById(this.element.id);
|
|
9775
9853
|
const ele = document.getElementById(this.element.id + '_tile_parent');
|
|
9854
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
9776
9855
|
const latLong = this.pointToLatLong(x + this.mapAreaRect.x - (ele.offsetLeft - (isNullOrUndefined(this.markerDragArgument) ? container.offsetLeft : 0)), y + this.mapAreaRect.y - (ele.offsetTop - (isNullOrUndefined(this.markerDragArgument) ? container.offsetTop : 0)));
|
|
9777
9856
|
latitude = latLong['latitude'];
|
|
9778
9857
|
longitude = latLong['longitude'];
|
|
@@ -9986,21 +10065,33 @@ class Bubble {
|
|
|
9986
10065
|
constructor(maps) {
|
|
9987
10066
|
/**
|
|
9988
10067
|
* Bubble Id for current layer
|
|
10068
|
+
*
|
|
9989
10069
|
* @private
|
|
9990
10070
|
*/
|
|
9991
10071
|
this.id = '';
|
|
9992
10072
|
this.maps = maps;
|
|
9993
10073
|
this.bubbleCollection = [];
|
|
9994
10074
|
}
|
|
9995
|
-
// eslint-disable-next-line valid-jsdoc
|
|
9996
10075
|
/**
|
|
9997
10076
|
* To render bubble
|
|
9998
10077
|
*
|
|
10078
|
+
* @param {BubbleSettingsModel} bubbleSettings - Specifies the bubble data to be rendered
|
|
10079
|
+
* @param {object} shapeData - Specifies the data about the shape
|
|
10080
|
+
* @param {string} color - Specifies the color of the bubble
|
|
10081
|
+
* @param {number} range - Specifies the range of the bubble
|
|
10082
|
+
* @param {number} range.min - Specifies the minimum range of the bubble
|
|
10083
|
+
* @param {number} range.max - Specifies the maximum range of the bubble
|
|
10084
|
+
* @param {number} bubbleIndex - Specifies the index of the bubble
|
|
10085
|
+
* @param {number} dataIndex - Specifies the index of the data
|
|
10086
|
+
* @param {number} layerIndex - Specifies the index of the layer
|
|
10087
|
+
* @param {LayerSettings} layer - Specifies the layer data
|
|
10088
|
+
* @param {Element} group - Specifies the element group
|
|
10089
|
+
* @param {string} bubbleID - Specifies the ID of the bubble
|
|
10090
|
+
* @returns {void}
|
|
10091
|
+
*
|
|
9999
10092
|
* @private
|
|
10000
10093
|
*/
|
|
10001
|
-
renderBubble(
|
|
10002
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
10003
|
-
bubbleSettings, shapeData, color, range, bubbleIndex, dataIndex, layerIndex, layer, group, bubbleID) {
|
|
10094
|
+
renderBubble(bubbleSettings, shapeData, color, range, bubbleIndex, dataIndex, layerIndex, layer, group, bubbleID) {
|
|
10004
10095
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
10005
10096
|
const layerData = layer.layerData;
|
|
10006
10097
|
const colorValuePath = bubbleSettings.colorValuePath;
|
|
@@ -10099,6 +10190,7 @@ class Bubble {
|
|
|
10099
10190
|
return;
|
|
10100
10191
|
}
|
|
10101
10192
|
}
|
|
10193
|
+
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
10102
10194
|
this.maps.trigger('bubbleRendering', eventArgs, (bubbleArgs) => {
|
|
10103
10195
|
if (eventArgs.cancel) {
|
|
10104
10196
|
return;
|
|
@@ -10137,7 +10229,9 @@ class Bubble {
|
|
|
10137
10229
|
const bubbleDataSource = bubbleSettings.dataSource;
|
|
10138
10230
|
const scale = translate['scale'];
|
|
10139
10231
|
const transPoint = translate['location'];
|
|
10140
|
-
const position = new MapLocation((this.maps.isTileMap ? ((eventArgs.cx + this.maps.translatePoint.x) * this.maps.tileZoomLevel)
|
|
10232
|
+
const position = new MapLocation((this.maps.isTileMap ? ((eventArgs.cx + this.maps.translatePoint.x) * this.maps.tileZoomLevel)
|
|
10233
|
+
: ((eventArgs.cx + transPoint.x) * scale)), (this.maps.isTileMap ? ((eventArgs.cy + this.maps.translatePoint.y) * this.maps.tileZoomLevel)
|
|
10234
|
+
: ((eventArgs.cy + transPoint.y) * scale)));
|
|
10141
10235
|
bubbleElement.setAttribute('transform', 'translate( ' + (position.x) + ' ' + (position.y) + ' )');
|
|
10142
10236
|
const bubble = (bubbleDataSource.length - 1) === dataIndex ? 'bubble' : null;
|
|
10143
10237
|
if (bubbleSettings.bubbleType === 'Square') {
|
|
@@ -10310,6 +10404,7 @@ class Marker {
|
|
|
10310
10404
|
border: markerSettings.border, colorValuePath: markerSettings.colorValuePath,
|
|
10311
10405
|
shapeValuePath: markerSettings.shapeValuePath, imageUrlValuePath: markerSettings.imageUrlValuePath
|
|
10312
10406
|
};
|
|
10407
|
+
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
10313
10408
|
maps.trigger('markerRendering', eventArgs, (MarkerArgs) => {
|
|
10314
10409
|
eventArgs = markerColorChoose(eventArgs, data);
|
|
10315
10410
|
eventArgs = markerShapeChoose(eventArgs, data);
|
|
@@ -10533,6 +10628,7 @@ class Marker {
|
|
|
10533
10628
|
}
|
|
10534
10629
|
/**
|
|
10535
10630
|
* To check and trigger marker click event
|
|
10631
|
+
*
|
|
10536
10632
|
* @param {PointerEvent} e - Specifies the pointer event argument.
|
|
10537
10633
|
* @returns {void}
|
|
10538
10634
|
* @private
|
|
@@ -10553,7 +10649,7 @@ class Marker {
|
|
|
10553
10649
|
return;
|
|
10554
10650
|
}
|
|
10555
10651
|
if (options.marker.enableDrag) {
|
|
10556
|
-
document.getElementById(this.maps.element.id +
|
|
10652
|
+
document.getElementById(this.maps.element.id + '_svg').style.cursor = 'grabbing';
|
|
10557
10653
|
}
|
|
10558
10654
|
const eventArgs = {
|
|
10559
10655
|
cancel: false, name: markerClick, data: options.data, maps: this.maps,
|
|
@@ -10570,7 +10666,7 @@ class Marker {
|
|
|
10570
10666
|
const dataIndex = parseInt(target.split('_dataIndex_')[1].split('_')[0], 10);
|
|
10571
10667
|
const marker$$1 = this.maps.layers[layerIndex].markerSettings[markerIndex];
|
|
10572
10668
|
if (this.sameMarkerData.length > 0) {
|
|
10573
|
-
isCluster = (this.sameMarkerData[0].data.filter((el) => { return (el['index']
|
|
10669
|
+
isCluster = (this.sameMarkerData[0].data.filter((el) => { return (el['index'] === dataIndex); })).length > 0 &&
|
|
10574
10670
|
this.sameMarkerData[0].layerIndex === layerIndex && this.sameMarkerData[0].markerIndex === markerIndex;
|
|
10575
10671
|
}
|
|
10576
10672
|
if (!isCluster) {
|
|
@@ -10585,7 +10681,8 @@ class Marker {
|
|
|
10585
10681
|
targetId: target, x: e.clientX, y: e.clientY,
|
|
10586
10682
|
latitude: options.data['latitude'] || options.data['Latitude'],
|
|
10587
10683
|
longitude: options.data['longitude'] || options.data['Longitude'],
|
|
10588
|
-
shape: isNullOrUndefined(marker$$1.shapeValuePath) ? marker$$1.shape
|
|
10684
|
+
shape: isNullOrUndefined(marker$$1.shapeValuePath) ? marker$$1.shape
|
|
10685
|
+
: marker$$1.dataSource[dataIndex][marker$$1.shapeValuePath],
|
|
10589
10686
|
layerIndex: layerIndex, markerIndex: markerIndex, dataIndex: dataIndex
|
|
10590
10687
|
};
|
|
10591
10688
|
}
|
|
@@ -10593,6 +10690,7 @@ class Marker {
|
|
|
10593
10690
|
}
|
|
10594
10691
|
/**
|
|
10595
10692
|
* To check and trigger Cluster click event
|
|
10693
|
+
*
|
|
10596
10694
|
* @param {PointerEvent} e - Specifies the pointer event argument.
|
|
10597
10695
|
* @returns {void}
|
|
10598
10696
|
* @private
|
|
@@ -10613,7 +10711,7 @@ class Marker {
|
|
|
10613
10711
|
}
|
|
10614
10712
|
if (this.sameMarkerData.length > 0 && !this.maps.markerClusterExpandCheck) {
|
|
10615
10713
|
this.maps.markerClusterExpandCheck = true;
|
|
10616
|
-
mergeSeparateCluster(this.sameMarkerData, this.maps
|
|
10714
|
+
mergeSeparateCluster(this.sameMarkerData, this.maps);
|
|
10617
10715
|
}
|
|
10618
10716
|
else {
|
|
10619
10717
|
this.sameMarkerData = options.clusterCollection;
|
|
@@ -10633,7 +10731,7 @@ class Marker {
|
|
|
10633
10731
|
* To get marker from target id
|
|
10634
10732
|
*
|
|
10635
10733
|
* @param {string} target - Specifies the target
|
|
10636
|
-
* @returns {
|
|
10734
|
+
* @returns {object} - Returns the marker, data, clusterCollection, markCollection
|
|
10637
10735
|
*/
|
|
10638
10736
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
10639
10737
|
getMarker(target) {
|
|
@@ -10701,7 +10799,7 @@ class Marker {
|
|
|
10701
10799
|
return;
|
|
10702
10800
|
}
|
|
10703
10801
|
if (options.marker.enableDrag) {
|
|
10704
|
-
document.getElementById(this.maps.element.id +
|
|
10802
|
+
document.getElementById(this.maps.element.id + '_svg').style.cursor = isNullOrUndefined(this.maps.markerDragArgument) ?
|
|
10705
10803
|
'pointer' : 'grabbing';
|
|
10706
10804
|
}
|
|
10707
10805
|
const eventArgs = {
|
|
@@ -10735,7 +10833,10 @@ class Marker {
|
|
|
10735
10833
|
};
|
|
10736
10834
|
this.maps.trigger(markerClusterMouseMove, eventArgs);
|
|
10737
10835
|
}
|
|
10738
|
-
/** @private
|
|
10836
|
+
/** @private
|
|
10837
|
+
*
|
|
10838
|
+
* @returns {void}
|
|
10839
|
+
*/
|
|
10739
10840
|
initializeMarkerClusterList() {
|
|
10740
10841
|
for (let i = 0; i < this.maps.layers.length; i++) {
|
|
10741
10842
|
this.initialMarkerCluster[i] = [];
|
|
@@ -10770,8 +10871,12 @@ class Marker {
|
|
|
10770
10871
|
* When injected, this module will be used to render polygon shapes over the Maps.
|
|
10771
10872
|
*/
|
|
10772
10873
|
class Polygon {
|
|
10874
|
+
/* eslint-disable @typescript-eslint/no-unused-vars */
|
|
10875
|
+
/* eslint-disable @typescript-eslint/no-empty-function */
|
|
10773
10876
|
constructor(maps) {
|
|
10774
10877
|
}
|
|
10878
|
+
/* eslint-enable @typescript-eslint/no-unused-vars */
|
|
10879
|
+
/* eslint-enable @typescript-eslint/no-empty-function */
|
|
10775
10880
|
/**
|
|
10776
10881
|
* To render polygon for maps
|
|
10777
10882
|
*
|
|
@@ -10790,7 +10895,6 @@ class Polygon {
|
|
|
10790
10895
|
const polygonSVGObject = maps.renderer.createGroup({
|
|
10791
10896
|
id: maps.element.id + '_LayerIndex_' + layerIndex + '_Polygons_Group_' + polygonIndex
|
|
10792
10897
|
});
|
|
10793
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
10794
10898
|
const polygonData = polygonSetting.points;
|
|
10795
10899
|
const path = calculatePolygonPath(maps, factor, currentLayer, polygonData);
|
|
10796
10900
|
const pathOptions = new PathOption(maps.element.id + '_LayerIndex_' + layerIndex + '_PolygonIndex_' + polygonIndex, polygonSetting.fill, (polygonSetting.borderWidth / factor), polygonSetting.borderColor, polygonSetting.opacity, polygonSetting.borderOpacity, '', path);
|
|
@@ -10815,6 +10919,7 @@ class Polygon {
|
|
|
10815
10919
|
* @returns {void}
|
|
10816
10920
|
* @private
|
|
10817
10921
|
*/
|
|
10922
|
+
//eslint-disable-next-line @typescript-eslint/no-empty-function
|
|
10818
10923
|
destroy() {
|
|
10819
10924
|
}
|
|
10820
10925
|
}
|
|
@@ -10853,7 +10958,7 @@ class DataLabel {
|
|
|
10853
10958
|
*
|
|
10854
10959
|
* @param {LayerSettings} layer - Specifies the layer settings
|
|
10855
10960
|
* @param {number} layerIndex - Specifies the layer index.
|
|
10856
|
-
* @param {
|
|
10961
|
+
* @param {object} shape - Specifies the shape.
|
|
10857
10962
|
* @param {any[]} layerData - Specifies the layer data.
|
|
10858
10963
|
* @param {Element} group Specifies the element.
|
|
10859
10964
|
* @param {HTMLElement} labelTemplateElement - Specifies the template element.
|
|
@@ -10862,9 +10967,7 @@ class DataLabel {
|
|
|
10862
10967
|
* @returns {void}
|
|
10863
10968
|
* @private
|
|
10864
10969
|
*/
|
|
10865
|
-
renderLabel(
|
|
10866
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
10867
|
-
layer, layerIndex, shape,
|
|
10970
|
+
renderLabel(layer, layerIndex, shape,
|
|
10868
10971
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
10869
10972
|
layerData, group, labelTemplateElement, index, intersect) {
|
|
10870
10973
|
const dataLabel = layer.dataLabelSettings;
|
|
@@ -11006,7 +11109,7 @@ class DataLabel {
|
|
|
11006
11109
|
location['y'] = ((location['y'] + zoomTransPoint['y']) * scale);
|
|
11007
11110
|
}
|
|
11008
11111
|
location['y'] = (this.maps.projectionType === 'Mercator') || layer.geometryType === 'Normal' ? location['y'] : (-location['y']);
|
|
11009
|
-
if (!isNullOrUndefined(this.maps.format) && !isNaN(parseFloat(text))) {
|
|
11112
|
+
if (!isNullOrUndefined(this.maps.format) && !isNaN(Number(text)) && !isNaN(parseFloat(text))) {
|
|
11010
11113
|
if (this.maps.useGroupingSeparator) {
|
|
11011
11114
|
text = Internalize(this.maps, parseFloat(text));
|
|
11012
11115
|
if (!isNullOrUndefined(datasrcObj)) {
|
|
@@ -11066,7 +11169,7 @@ class DataLabel {
|
|
|
11066
11169
|
const templateElement = templateFn ? templateFn(!isNullOrUndefined(datasrcObj) ?
|
|
11067
11170
|
datasrcObj : shapeData['properties'], this.maps, eventargs.template, this.maps.element.id + '_LabelTemplate', false) : document.createElement('div');
|
|
11068
11171
|
templateElement.innerHTML = !templateFn ? eventargs.template : '';
|
|
11069
|
-
labelElement = convertElementFromLabel(templateElement, labelId, !isNullOrUndefined(datasrcObj) ? datasrcObj : shapeData['properties']
|
|
11172
|
+
labelElement = convertElementFromLabel(templateElement, labelId, !isNullOrUndefined(datasrcObj) ? datasrcObj : shapeData['properties']);
|
|
11070
11173
|
if (this.maps.isTileMap) {
|
|
11071
11174
|
labelElement.style.left = (((location['x'] + transPoint['x']) * scale) - (textSize['width'] / 2)) + 'px';
|
|
11072
11175
|
labelElement.style.top = (((location['y'] + transPoint['y']) * scale) - textSize['height']) + 'px';
|
|
@@ -11220,7 +11323,7 @@ class DataLabel {
|
|
|
11220
11323
|
element.setAttribute(isRect ? 'fill-opacity' : 'opacity', (opacity * height).toString());
|
|
11221
11324
|
}
|
|
11222
11325
|
},
|
|
11223
|
-
end: (
|
|
11326
|
+
end: () => {
|
|
11224
11327
|
element.style.visibility = 'visible';
|
|
11225
11328
|
element.setAttribute(isRect ? 'fill-opacity' : 'opacity', opacity.toString());
|
|
11226
11329
|
}
|
|
@@ -11387,6 +11490,7 @@ class NavigationLine {
|
|
|
11387
11490
|
pathOption = new PathOption(arcId, 'none', width, color, 1, 1, dashArray, d);
|
|
11388
11491
|
navigationEle = this.maps.renderer.drawPath(pathOption);
|
|
11389
11492
|
if (!isNullOrUndefined(arrowPosition)) {
|
|
11493
|
+
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
11390
11494
|
const position = (arrowPosition === 'Start') ? navigationEle.setAttribute('marker-start', startArrow)
|
|
11391
11495
|
: navigationEle.setAttribute('marker-end', endArrow);
|
|
11392
11496
|
}
|
|
@@ -11783,9 +11887,9 @@ class Legend {
|
|
|
11783
11887
|
* Get the legend collections
|
|
11784
11888
|
*
|
|
11785
11889
|
* @param {number} layerIndex - Specifies the layer index
|
|
11786
|
-
* @param {
|
|
11890
|
+
* @param {any[]} layerData - Specifies the layer data
|
|
11787
11891
|
* @param {ColorMappingSettings[]} colorMapping - Specifies the color mapping
|
|
11788
|
-
* @param {
|
|
11892
|
+
* @param {any[]} dataSource - Specifies the data source
|
|
11789
11893
|
* @param {string} dataPath - Specifies the data path
|
|
11790
11894
|
* @param {string} colorValuePath - Specifies the color value path
|
|
11791
11895
|
* @param {string | string[]} propertyPath - Specifies the property path
|
|
@@ -11827,6 +11931,7 @@ class Legend {
|
|
|
11827
11931
|
// eslint-disable-next-line valid-jsdoc
|
|
11828
11932
|
/**
|
|
11829
11933
|
* To draw the legend shape and text.
|
|
11934
|
+
*
|
|
11830
11935
|
* @private
|
|
11831
11936
|
*/
|
|
11832
11937
|
drawLegend() {
|
|
@@ -11871,7 +11976,7 @@ class Legend {
|
|
|
11871
11976
|
}
|
|
11872
11977
|
}
|
|
11873
11978
|
/**
|
|
11874
|
-
* @param {
|
|
11979
|
+
* @param {number} page - Specifies the legend page.
|
|
11875
11980
|
* @returns {void}
|
|
11876
11981
|
* @private
|
|
11877
11982
|
*/
|
|
@@ -11895,8 +12000,6 @@ class Legend {
|
|
|
11895
12000
|
const legendElement = render.createGroup({ id: map.element.id + '_Legend_Index_' + collection['idIndex'] });
|
|
11896
12001
|
let legendText = collection['DisplayText'];
|
|
11897
12002
|
const pagingArrowPadding = 4;
|
|
11898
|
-
const shape = ((legend.type === 'Markers') ? ((isNullOrUndefined(collection['ImageSrc'])) ?
|
|
11899
|
-
legend.shape : 'Image') : collection['legendShape']);
|
|
11900
12003
|
const strokeColor = (legend.shape === 'HorizontalLine' || legend.shape === 'VerticalLine'
|
|
11901
12004
|
|| legend.shape === 'Cross') ? isNullOrUndefined(legend.fill) ? '#000000' : legend.fill : shapeBorder.color;
|
|
11902
12005
|
const strokeWidth = (legend.shape === 'HorizontalLine' || legend.shape === 'VerticalLine'
|
|
@@ -12281,9 +12384,7 @@ class Legend {
|
|
|
12281
12384
|
}
|
|
12282
12385
|
}
|
|
12283
12386
|
}
|
|
12284
|
-
shapeHighLightAndSelection(
|
|
12285
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
12286
|
-
targetElement, data, module, getValue, layerIndex) {
|
|
12387
|
+
shapeHighLightAndSelection(targetElement, data, module, getValue, layerIndex) {
|
|
12287
12388
|
if (data !== undefined) {
|
|
12288
12389
|
this.updateLegendElement();
|
|
12289
12390
|
this.shapeToggled = true;
|
|
@@ -12709,9 +12810,12 @@ class Legend {
|
|
|
12709
12810
|
}
|
|
12710
12811
|
if (legendTitle) {
|
|
12711
12812
|
textStyle.color = (textStyle.color !== null) ? textStyle.color : this.maps.themeStyle.legendTitleFontColor;
|
|
12712
|
-
textStyle.fontFamily = !isNullOrUndefined(textStyle.fontFamily) ? textStyle.fontFamily
|
|
12713
|
-
|
|
12714
|
-
textStyle.
|
|
12813
|
+
textStyle.fontFamily = !isNullOrUndefined(textStyle.fontFamily) ? textStyle.fontFamily
|
|
12814
|
+
: this.maps.themeStyle.fontFamily;
|
|
12815
|
+
textStyle.size = !isNullOrUndefined(textStyle.size) ? textStyle.size
|
|
12816
|
+
: this.maps.themeStyle.subTitleFontSize || Theme.legendTitleFont.size;
|
|
12817
|
+
textStyle.fontWeight = !isNullOrUndefined(textStyle.fontWeight) ? textStyle.fontWeight
|
|
12818
|
+
: this.maps.themeStyle.titleFontWeight || Theme.legendTitleFont.fontWeight;
|
|
12715
12819
|
textOptions = new TextOption(map.element.id + '_LegendTitle', (this.legendItemRect.x) + (this.legendItemRect.width / 2), this.legendItemRect.y - (textSize.height / 2) - spacing / 2, 'middle', trimTitle, '');
|
|
12716
12820
|
const element = renderTextElement(textOptions, textStyle, textStyle.color, this.legendGroup);
|
|
12717
12821
|
element.setAttribute('aria-label', legendTitle);
|
|
@@ -12814,6 +12918,7 @@ class Legend {
|
|
|
12814
12918
|
const field = marker$$1.legendText;
|
|
12815
12919
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
12816
12920
|
let templateFn;
|
|
12921
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
12817
12922
|
Array.prototype.forEach.call(dataSource, (data, dataIndex) => {
|
|
12818
12923
|
let imageSrc = null;
|
|
12819
12924
|
const showLegend = isNullOrUndefined(data[this.maps.legendSettings.showLegendPath]) ? true :
|
|
@@ -12824,6 +12929,7 @@ class Legend {
|
|
|
12824
12929
|
const templateElement = templateFn(this.maps);
|
|
12825
12930
|
const markerEle = isNullOrUndefined(templateElement.childElementCount) ? templateElement[0] :
|
|
12826
12931
|
templateElement;
|
|
12932
|
+
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
12827
12933
|
imageSrc = markerEle.querySelector('img').src;
|
|
12828
12934
|
}
|
|
12829
12935
|
const text = isNullOrUndefined(data[field]) ? '' : data[field];
|
|
@@ -13013,7 +13119,6 @@ class Legend {
|
|
|
13013
13119
|
}
|
|
13014
13120
|
});
|
|
13015
13121
|
if (outOfRangeValues.length === 0) {
|
|
13016
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
13017
13122
|
let range = false;
|
|
13018
13123
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
13019
13124
|
Array.prototype.forEach.call(dataSource, (data, dataIndex) => {
|
|
@@ -13248,7 +13353,12 @@ class Legend {
|
|
|
13248
13353
|
this.setToggleAttributes(legendTextId, legendShapeId, legendToggleFill, legendToggleOpacity, legendToggleBorderColor, legendToggleBorderWidth, legendToggleBorderOpacity, legendToggleFill);
|
|
13249
13354
|
}
|
|
13250
13355
|
else {
|
|
13251
|
-
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)
|
|
13356
|
+
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)
|
|
13357
|
+
? 0 : this.maps.layers[k].shapeSettings.border.width,
|
|
13358
|
+
/* eslint-disable-next-line max-len */
|
|
13359
|
+
isNullOrUndefined(this.maps.layers[k].shapeSettings.border.opacity)
|
|
13360
|
+
? this.maps.layers[k].shapeSettings.opacity
|
|
13361
|
+
: this.maps.layers[k].shapeSettings.border.opacity, this.maps.layers[k].shapeSettings.fill);
|
|
13252
13362
|
}
|
|
13253
13363
|
}
|
|
13254
13364
|
}
|
|
@@ -13317,7 +13427,12 @@ class Legend {
|
|
|
13317
13427
|
this.setToggleAttributes(legendTextId, legendShapeId, legendToggleFill, legendToggleOpacity, legendToggleBorderColor, legendToggleBorderWidth, legendToggleBorderOpacity, legendToggleFill);
|
|
13318
13428
|
}
|
|
13319
13429
|
else {
|
|
13320
|
-
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)
|
|
13430
|
+
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)
|
|
13431
|
+
? 0 : this.maps.layers[j].shapeSettings.border.width,
|
|
13432
|
+
/* eslint-disable-next-line max-len */
|
|
13433
|
+
isNullOrUndefined(this.maps.layers[j].shapeSettings.border.opacity)
|
|
13434
|
+
? this.maps.layers[j].shapeSettings.opacity
|
|
13435
|
+
: this.maps.layers[j].shapeSettings.border.opacity, this.maps.layers[j].shapeSettings.fill);
|
|
13321
13436
|
}
|
|
13322
13437
|
}
|
|
13323
13438
|
}
|
|
@@ -13395,7 +13510,15 @@ class Legend {
|
|
|
13395
13510
|
this.setToggleAttributes(legendTextId, legendShapeId, legendToggleFill, legendToggleOpacity, legendToggleBorderColor, legendToggleBorderWidth, legendToggleBorderOpacity, legendToggleFill);
|
|
13396
13511
|
}
|
|
13397
13512
|
else {
|
|
13398
|
-
this.setToggleAttributes(legendTextId, legendShapeId, this.maps.layers[k].shapeSettings.fill, this.maps.layers[k].shapeSettings.opacity, this.maps.layers[k].shapeSettings.border.color,
|
|
13513
|
+
this.setToggleAttributes(legendTextId, legendShapeId, this.maps.layers[k].shapeSettings.fill, this.maps.layers[k].shapeSettings.opacity, this.maps.layers[k].shapeSettings.border.color,
|
|
13514
|
+
/* eslint-disable-next-line max-len */
|
|
13515
|
+
(isNullOrUndefined(this.maps.layers[k].shapeSettings.border.width)
|
|
13516
|
+
? 0
|
|
13517
|
+
: this.maps.layers[k].shapeSettings.border.width),
|
|
13518
|
+
/* eslint-disable-next-line max-len */
|
|
13519
|
+
(isNullOrUndefined(this.maps.layers[k].shapeSettings.border.opacity)
|
|
13520
|
+
? this.maps.layers[k].shapeSettings.opacity
|
|
13521
|
+
: this.maps.layers[k].shapeSettings.border.opacity), this.maps.layers[k].shapeSettings.fill);
|
|
13399
13522
|
}
|
|
13400
13523
|
}
|
|
13401
13524
|
}
|
|
@@ -13466,7 +13589,13 @@ class Legend {
|
|
|
13466
13589
|
this.setToggleAttributes(legendTextId, legendShapeId, legendToggleFill, legendToggleOpacity, legendToggleBorderColor, legendToggleBorderWidth, legendToggleBorderOpacity, legendToggleFill);
|
|
13467
13590
|
}
|
|
13468
13591
|
else {
|
|
13469
|
-
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)
|
|
13592
|
+
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)
|
|
13593
|
+
? 0
|
|
13594
|
+
: this.maps.layers[k].shapeSettings.border.width,
|
|
13595
|
+
/* eslint-disable-next-line max-len */
|
|
13596
|
+
isNullOrUndefined(this.maps.layers[k].shapeSettings.border.opacity)
|
|
13597
|
+
? this.maps.layers[k].shapeSettings.opacity
|
|
13598
|
+
: this.maps.layers[k].shapeSettings.border.opacity, this.maps.layers[0].shapeSettings.fill);
|
|
13470
13599
|
}
|
|
13471
13600
|
}
|
|
13472
13601
|
}
|
|
@@ -13674,9 +13803,13 @@ class Highlight {
|
|
|
13674
13803
|
this.maps.off(Browser.touchMoveEvent, this.mouseMove);
|
|
13675
13804
|
this.maps.off(Browser.touchStartEvent, this.mouseMove);
|
|
13676
13805
|
}
|
|
13677
|
-
// eslint-disable-next-line valid-jsdoc
|
|
13678
13806
|
/**
|
|
13679
13807
|
* Public method for highlight module
|
|
13808
|
+
*
|
|
13809
|
+
* @param {number} layerIndex - Specifies the index of the layer.
|
|
13810
|
+
* @param {string} name - Specifies the name.
|
|
13811
|
+
* @param {boolean} enable - Specifies the enabling of highlight in map.
|
|
13812
|
+
* @returns {void}
|
|
13680
13813
|
* @private
|
|
13681
13814
|
*/
|
|
13682
13815
|
addHighlight(layerIndex, name, enable) {
|
|
@@ -13783,9 +13916,15 @@ class Highlight {
|
|
|
13783
13916
|
}
|
|
13784
13917
|
}
|
|
13785
13918
|
/**
|
|
13919
|
+
* Handles the highlighting events in map
|
|
13920
|
+
*
|
|
13921
|
+
* @param {Element} targetElement - Specifies the target element.
|
|
13922
|
+
* @param {number} layerIndex - Specifies the index of the layer.
|
|
13923
|
+
* @param {object} data - Specifies the data for the map.
|
|
13924
|
+
* @param {object} shapeData - Specifies the data for the map to render.
|
|
13925
|
+
* @returns {void}
|
|
13786
13926
|
* @private
|
|
13787
13927
|
*/
|
|
13788
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
13789
13928
|
handleHighlight(targetElement, layerIndex, data, shapeData) {
|
|
13790
13929
|
if (this.maps.legendSettings.visible && targetElement.id.indexOf('_MarkerIndex_') === -1 && this.maps.legendModule
|
|
13791
13930
|
&& this.maps.legendSettings.type === 'Layers') {
|
|
@@ -13996,9 +14135,15 @@ class Selection {
|
|
|
13996
14135
|
}
|
|
13997
14136
|
}
|
|
13998
14137
|
/**
|
|
14138
|
+
* Selects the element in the map
|
|
14139
|
+
*
|
|
14140
|
+
* @param {Element} targetElement - Specifies the target element.
|
|
14141
|
+
* @param {number} layerIndex - Specifies the index of the layer.
|
|
14142
|
+
* @param {object} data - Specifies the data for the map.
|
|
14143
|
+
* @param {object} shapeData - Specifies the data for the map to render.
|
|
14144
|
+
* @returns {void}
|
|
13999
14145
|
* @private
|
|
14000
14146
|
*/
|
|
14001
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
14002
14147
|
selectElement(targetElement, layerIndex, data, shapeData) {
|
|
14003
14148
|
this.maps.mapSelect = targetElement ? true : false;
|
|
14004
14149
|
if (this.maps.legendModule && this.maps.legendSettings.visible && targetElement.id.indexOf('_MarkerIndex_') === -1) {
|
|
@@ -14010,9 +14155,13 @@ class Selection {
|
|
|
14010
14155
|
this.selectMap(targetElement, shapeData, data);
|
|
14011
14156
|
}
|
|
14012
14157
|
}
|
|
14013
|
-
// eslint-disable-next-line valid-jsdoc
|
|
14014
14158
|
/**
|
|
14015
14159
|
* Public method for selection
|
|
14160
|
+
*
|
|
14161
|
+
* @param {number} layerIndex - Specifies the index of the layer.
|
|
14162
|
+
* @param {string} name - Specifies the name.
|
|
14163
|
+
* @param {boolean} enable - Specifies the enabling of selection in map.
|
|
14164
|
+
* @returns {void}
|
|
14016
14165
|
* @private
|
|
14017
14166
|
*/
|
|
14018
14167
|
addSelection(layerIndex, name, enable) {
|
|
@@ -14034,9 +14183,7 @@ class Selection {
|
|
|
14034
14183
|
*/
|
|
14035
14184
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
14036
14185
|
selectMap(targetElement, shapeData, data) {
|
|
14037
|
-
const layerIndex = parseInt(targetElement.id.split('_LayerIndex_')[1].split('_')[0], 10);
|
|
14038
14186
|
const isLineStringShape = targetElement.parentElement.id.indexOf('LineString') > -1;
|
|
14039
|
-
const selectionsettings = this.selectionsettings;
|
|
14040
14187
|
const border = {
|
|
14041
14188
|
color: isLineStringShape ? (this.selectionsettings.fill || this.selectionsettings.border.color) :
|
|
14042
14189
|
this.selectionsettings.border.color,
|
|
@@ -14055,6 +14202,7 @@ class Selection {
|
|
|
14055
14202
|
data: data,
|
|
14056
14203
|
maps: this.maps
|
|
14057
14204
|
};
|
|
14205
|
+
//eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
14058
14206
|
this.maps.trigger('itemSelection', eventArgs, (observedArgs) => {
|
|
14059
14207
|
eventArgs.border.opacity = isNullOrUndefined(this.selectionsettings.border.opacity) ?
|
|
14060
14208
|
this.selectionsettings.opacity : this.selectionsettings.border.opacity;
|
|
@@ -14226,6 +14374,8 @@ class MapsTooltip {
|
|
|
14226
14374
|
this.addEventListener();
|
|
14227
14375
|
}
|
|
14228
14376
|
/**
|
|
14377
|
+
* @param {PointerEvent} e - Specifies the event.
|
|
14378
|
+
* @returns {void}
|
|
14229
14379
|
* @private
|
|
14230
14380
|
*/
|
|
14231
14381
|
renderTooltip(e) {
|
|
@@ -14414,6 +14564,7 @@ class MapsTooltip {
|
|
|
14414
14564
|
}
|
|
14415
14565
|
document.getElementById(this.maps.element.id + '_Secondary_Element').appendChild(tooltipEle);
|
|
14416
14566
|
}
|
|
14567
|
+
// eslint-disable-next-line no-constant-condition
|
|
14417
14568
|
if (typeof (isPolygon ? polygon.tooltipTemplate !== 'function' : option.template !== 'function') && (isPolygon ? polygon.tooltipTemplate !== null : option.template !== null) && Object.keys(typeof (isPolygon ? polygon.tooltipTemplate === 'object' : option.template === 'object') ? (isPolygon ? polygon.tooltipTemplate : option.template) : {}).length === 1) {
|
|
14418
14569
|
if (isPolygon) {
|
|
14419
14570
|
polygon.tooltipTemplate = polygon.tooltipTemplate[Object.keys(polygon.tooltipTemplate)[0]];
|
|
@@ -14532,7 +14683,7 @@ class MapsTooltip {
|
|
|
14532
14683
|
}
|
|
14533
14684
|
}
|
|
14534
14685
|
else {
|
|
14535
|
-
|
|
14686
|
+
const tooltipElement = e.target.closest('#' + this.maps.element.id + '_mapsTooltipparent_template');
|
|
14536
14687
|
if (isNullOrUndefined(tooltipElement)) {
|
|
14537
14688
|
this.clearTooltip(e.target);
|
|
14538
14689
|
}
|
|
@@ -14571,6 +14722,10 @@ class MapsTooltip {
|
|
|
14571
14722
|
return format;
|
|
14572
14723
|
}
|
|
14573
14724
|
/**
|
|
14725
|
+
* Handles the mouse up
|
|
14726
|
+
*
|
|
14727
|
+
* @param {PointerEvent} e - Specifies the event
|
|
14728
|
+
* @returns {void}
|
|
14574
14729
|
* @private
|
|
14575
14730
|
*/
|
|
14576
14731
|
mouseUpHandler(e) {
|
|
@@ -14583,6 +14738,9 @@ class MapsTooltip {
|
|
|
14583
14738
|
}
|
|
14584
14739
|
}
|
|
14585
14740
|
/**
|
|
14741
|
+
* Removes the tooltip
|
|
14742
|
+
*
|
|
14743
|
+
* @returns {boolean} - Returns the boolean whether tooltip is removed or not.
|
|
14586
14744
|
* @private
|
|
14587
14745
|
*/
|
|
14588
14746
|
removeTooltip() {
|
|
@@ -14594,7 +14752,8 @@ class MapsTooltip {
|
|
|
14594
14752
|
return isTooltipRemoved;
|
|
14595
14753
|
}
|
|
14596
14754
|
clearTooltip(element) {
|
|
14597
|
-
|
|
14755
|
+
// eslint-disable-next-line @typescript-eslint/tslint/config
|
|
14756
|
+
const tooltipElement = element.closest('#' + this.maps.element.id + '_mapsTooltipparent_template');
|
|
14598
14757
|
if (isNullOrUndefined(tooltipElement)) {
|
|
14599
14758
|
const isTooltipRemoved = this.removeTooltip();
|
|
14600
14759
|
if (isTooltipRemoved) {
|
|
@@ -14603,9 +14762,10 @@ class MapsTooltip {
|
|
|
14603
14762
|
}
|
|
14604
14763
|
}
|
|
14605
14764
|
}
|
|
14606
|
-
// eslint-disable-next-line valid-jsdoc
|
|
14607
14765
|
/**
|
|
14608
14766
|
* To bind events for tooltip module
|
|
14767
|
+
*
|
|
14768
|
+
* @returns {void}
|
|
14609
14769
|
* @private
|
|
14610
14770
|
*/
|
|
14611
14771
|
addEventListener() {
|
|
@@ -14625,6 +14785,9 @@ class MapsTooltip {
|
|
|
14625
14785
|
this.maps.element.addEventListener('contextmenu', this.removeTooltip);
|
|
14626
14786
|
}
|
|
14627
14787
|
/**
|
|
14788
|
+
* Removes the event listeners
|
|
14789
|
+
*
|
|
14790
|
+
* @returns {void}
|
|
14628
14791
|
* @private
|
|
14629
14792
|
*/
|
|
14630
14793
|
removeEventListener() {
|
|
@@ -14683,7 +14846,6 @@ class Zoom {
|
|
|
14683
14846
|
this.rectZoomingStart = false;
|
|
14684
14847
|
/** @private */
|
|
14685
14848
|
this.browserName = Browser.info.name;
|
|
14686
|
-
// eslint-disable-next-line @typescript-eslint/ban-types
|
|
14687
14849
|
/** @private */
|
|
14688
14850
|
this.isPointer = Browser.isPointer;
|
|
14689
14851
|
this.handled = false;
|
|
@@ -14693,10 +14855,8 @@ class Zoom {
|
|
|
14693
14855
|
this.pinchFactor = 1;
|
|
14694
14856
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
14695
14857
|
this.startTouches = [];
|
|
14696
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
14697
14858
|
/** @private */
|
|
14698
14859
|
this.mouseDownLatLong = { x: 0, y: 0 };
|
|
14699
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
14700
14860
|
/** @private */
|
|
14701
14861
|
this.mouseMoveLatLong = { x: 0, y: 0 };
|
|
14702
14862
|
/** @private */
|
|
@@ -14812,7 +14972,6 @@ class Zoom {
|
|
|
14812
14972
|
}
|
|
14813
14973
|
this.markerLineAnimation(map);
|
|
14814
14974
|
map.mapLayerPanel.generateTiles(newZoomFactor, map.tileTranslatePoint, type + 'wheel', null, position);
|
|
14815
|
-
const element1 = document.getElementById(this.maps.element.id + '_tiles');
|
|
14816
14975
|
const animationDuration = this.maps.layersCollection[0].animationDuration === 0 && animationMode === 'Enable' ? 1000 : this.maps.layersCollection[0].animationDuration;
|
|
14817
14976
|
setTimeout(() => {
|
|
14818
14977
|
// if (type === 'ZoomOut') {
|
|
@@ -14891,6 +15050,7 @@ class Zoom {
|
|
|
14891
15050
|
position.y - ((y * totalSize) / 100);
|
|
14892
15051
|
}
|
|
14893
15052
|
/**
|
|
15053
|
+
* @returns {void}
|
|
14894
15054
|
* @private
|
|
14895
15055
|
*/
|
|
14896
15056
|
performRectZooming() {
|
|
@@ -14970,26 +15130,29 @@ class Zoom {
|
|
|
14970
15130
|
}
|
|
14971
15131
|
}
|
|
14972
15132
|
/**
|
|
15133
|
+
* @param {PointerEvent} e - Specifies the vent in the map
|
|
15134
|
+
* @returns {void}
|
|
14973
15135
|
* @private
|
|
14974
15136
|
*/
|
|
15137
|
+
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
14975
15138
|
performPinchZooming(e) {
|
|
14976
15139
|
const map = this.maps;
|
|
14977
15140
|
const prevLevel = map.tileZoomLevel;
|
|
14978
|
-
const availSize = map.mapAreaRect;
|
|
14979
|
-
map.isMarkerZoomCompleted = false;
|
|
14980
|
-
map.previousScale = map.scale;
|
|
14981
|
-
map.previousPoint = map.translatePoint;
|
|
14982
|
-
map.previousProjection = map.projectionType;
|
|
14983
|
-
const prevTilePoint = map.tileTranslatePoint;
|
|
14984
|
-
const scale = calculateScale(this.touchStartList, this.touchMoveList);
|
|
14985
|
-
const touchCenter = getTouchCenter(getTouches(this.touchMoveList, this.maps));
|
|
14986
|
-
const newScale = scale / this.lastScale;
|
|
14987
|
-
this.lastScale = scale;
|
|
14988
|
-
this.pinchFactor *= newScale;
|
|
14989
|
-
this.pinchFactor = Math.min(this.maps.zoomSettings.maxZoom, Math.max(this.pinchFactor, this.maps.zoomSettings.minZoom));
|
|
14990
15141
|
let zoomCalculationFactor = this.pinchFactor;
|
|
14991
15142
|
let isZoomCancelled;
|
|
15143
|
+
const prevTilePoint = map.tileTranslatePoint;
|
|
14992
15144
|
if (!map.isTileMap) {
|
|
15145
|
+
const availSize = map.mapAreaRect;
|
|
15146
|
+
map.isMarkerZoomCompleted = false;
|
|
15147
|
+
map.previousScale = map.scale;
|
|
15148
|
+
map.previousPoint = map.translatePoint;
|
|
15149
|
+
map.previousProjection = map.projectionType;
|
|
15150
|
+
const scale = calculateScale(this.touchStartList, this.touchMoveList);
|
|
15151
|
+
const touchCenter = getTouchCenter(getTouches(this.touchMoveList, this.maps));
|
|
15152
|
+
const newScale = scale / this.lastScale;
|
|
15153
|
+
this.lastScale = scale;
|
|
15154
|
+
this.pinchFactor *= newScale;
|
|
15155
|
+
this.pinchFactor = Math.min(this.maps.zoomSettings.maxZoom, Math.max(this.pinchFactor, this.maps.zoomSettings.minZoom));
|
|
14993
15156
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
14994
15157
|
const minBounds = map.baseMapRectBounds['min'];
|
|
14995
15158
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
@@ -15024,24 +15187,38 @@ class Zoom {
|
|
|
15024
15187
|
}
|
|
15025
15188
|
}
|
|
15026
15189
|
else {
|
|
15027
|
-
const
|
|
15028
|
-
this.
|
|
15029
|
-
map.tileZoomLevel
|
|
15030
|
-
|
|
15031
|
-
(
|
|
15032
|
-
|
|
15033
|
-
|
|
15034
|
-
|
|
15035
|
-
|
|
15036
|
-
|
|
15037
|
-
|
|
15038
|
-
|
|
15039
|
-
|
|
15040
|
-
|
|
15041
|
-
|
|
15042
|
-
|
|
15043
|
-
|
|
15190
|
+
const touchCenter = this.getTouchCenterPoint();
|
|
15191
|
+
const distance = Math.sqrt(Math.pow((this.touchMoveList[0].pageX - this.touchMoveList[1].pageX), 2) + Math.pow((this.touchMoveList[0].pageY - this.touchMoveList[1].pageY), 2));
|
|
15192
|
+
let factor = map.tileZoomLevel;
|
|
15193
|
+
if (!isNullOrUndefined(this.pinchDistance)) {
|
|
15194
|
+
if (this.pinchDistance > distance) {
|
|
15195
|
+
factor = factor - 1;
|
|
15196
|
+
}
|
|
15197
|
+
else if (this.pinchDistance < distance) {
|
|
15198
|
+
factor = factor + 1;
|
|
15199
|
+
}
|
|
15200
|
+
factor = Math.min(this.maps.zoomSettings.maxZoom, Math.max(this.maps.zoomSettings.minZoom, factor));
|
|
15201
|
+
if (factor !== map.tileZoomLevel) {
|
|
15202
|
+
this.pinchFactor = factor;
|
|
15203
|
+
map.previousScale = map.scale;
|
|
15204
|
+
map.tileZoomLevel = this.pinchFactor;
|
|
15205
|
+
map.scale = Math.pow(2, map.tileZoomLevel - 1);
|
|
15206
|
+
this.getTileTranslatePosition(prevLevel, this.pinchFactor, { x: touchCenter.x, y: touchCenter.y }, null);
|
|
15207
|
+
map.translatePoint.x = (map.tileTranslatePoint.x - (0.01 * map.scale)) / map.scale;
|
|
15208
|
+
map.translatePoint.y = (map.tileTranslatePoint.y - (0.01 * map.scale)) / map.scale;
|
|
15209
|
+
isZoomCancelled = this.triggerZoomEvent(prevTilePoint, prevLevel, '');
|
|
15210
|
+
if (isZoomCancelled) {
|
|
15211
|
+
map.translatePoint = map.tileTranslatePoint = new Point(0, 0);
|
|
15212
|
+
map.scale = map.previousScale;
|
|
15213
|
+
map.tileZoomLevel = prevLevel;
|
|
15214
|
+
map.zoomSettings.zoomFactor = map.previousScale;
|
|
15215
|
+
}
|
|
15216
|
+
else {
|
|
15217
|
+
map.mapLayerPanel.generateTiles(factor, map.tileTranslatePoint);
|
|
15218
|
+
}
|
|
15219
|
+
}
|
|
15044
15220
|
}
|
|
15221
|
+
this.pinchDistance = distance;
|
|
15045
15222
|
}
|
|
15046
15223
|
map.mapScaleValue = zoomCalculationFactor;
|
|
15047
15224
|
if (!isZoomCancelled) {
|
|
@@ -15052,6 +15229,16 @@ class Zoom {
|
|
|
15052
15229
|
this.removeToolbarOpacity(map.isTileMap ? Math.round(map.tileZoomLevel) : map.scale, map.element.id + '_Zooming_');
|
|
15053
15230
|
}
|
|
15054
15231
|
}
|
|
15232
|
+
getTouchCenterPoint() {
|
|
15233
|
+
const touchList = [];
|
|
15234
|
+
for (let i = 0; i < this.touchMoveList.length; i++) {
|
|
15235
|
+
touchList.push(this.getMousePosition(this.touchMoveList[i].pageX, this.touchMoveList[i].pageY));
|
|
15236
|
+
}
|
|
15237
|
+
return {
|
|
15238
|
+
x: (touchList[0].x + touchList[1].x) / 2,
|
|
15239
|
+
y: (touchList[0].y + touchList[1].y) / 2
|
|
15240
|
+
};
|
|
15241
|
+
}
|
|
15055
15242
|
triggerZoomComplete(map, prevLevel, type) {
|
|
15056
15243
|
if (map.zoomSettings.enable) {
|
|
15057
15244
|
let zoomArgs;
|
|
@@ -15083,6 +15270,7 @@ class Zoom {
|
|
|
15083
15270
|
}
|
|
15084
15271
|
}
|
|
15085
15272
|
/**
|
|
15273
|
+
* @returns {void}
|
|
15086
15274
|
* @private
|
|
15087
15275
|
*/
|
|
15088
15276
|
drawZoomRectangle() {
|
|
@@ -15095,7 +15283,6 @@ class Zoom {
|
|
|
15095
15283
|
const height = Math.abs(move.y - down.y);
|
|
15096
15284
|
const x = ((move.x > down.x) ? down.x : down.x - width);
|
|
15097
15285
|
const y = ((move.y > down.y) ? down.y : down.y - height);
|
|
15098
|
-
const elementRect = getElementByID(map.element.id).getBoundingClientRect();
|
|
15099
15286
|
if ((x > map.mapAreaRect.x && x < (map.mapAreaRect.x + map.mapAreaRect.width)) &&
|
|
15100
15287
|
(y > map.mapAreaRect.y) && (y < map.mapAreaRect.y + map.mapAreaRect.height)) {
|
|
15101
15288
|
this.zoomingRect = new Rect(x, y, width, height);
|
|
@@ -15133,6 +15320,10 @@ class Zoom {
|
|
|
15133
15320
|
}
|
|
15134
15321
|
}
|
|
15135
15322
|
/**
|
|
15323
|
+
* @param {Maps} maps - Specifies the Map control
|
|
15324
|
+
* @param {boolean} animate - Specifies the animation is available or not
|
|
15325
|
+
* @param {boolean} isPanning - Specifies that it is panning or not
|
|
15326
|
+
* @returns {void}
|
|
15136
15327
|
* @private
|
|
15137
15328
|
*/
|
|
15138
15329
|
applyTransform(maps, animate$$1, isPanning) {
|
|
@@ -15143,7 +15334,6 @@ class Zoom {
|
|
|
15143
15334
|
const x = maps.translatePoint.x;
|
|
15144
15335
|
const y = maps.translatePoint.y;
|
|
15145
15336
|
let currentLabelIndex = 0;
|
|
15146
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
15147
15337
|
maps.zoomShapeCollection = [];
|
|
15148
15338
|
if (document.getElementById(maps.element.id + '_mapsTooltip')) {
|
|
15149
15339
|
removeElement(maps.element.id + '_mapsTooltip');
|
|
@@ -15175,7 +15365,7 @@ class Zoom {
|
|
|
15175
15365
|
this.currentLayer.polygonSettings.polygons.map((polygonSettings, polygonIndex) => {
|
|
15176
15366
|
const markerData = polygonSettings.points;
|
|
15177
15367
|
const path = calculatePolygonPath(maps, maps.tileZoomLevel, this.currentLayer, markerData);
|
|
15178
|
-
|
|
15368
|
+
const element = document.getElementById(maps.element.id + '_LayerIndex_' + this.index + '_PolygonIndex_' + polygonIndex);
|
|
15179
15369
|
element.setAttribute('d', path);
|
|
15180
15370
|
});
|
|
15181
15371
|
document.getElementById(maps.element.id + '_LayerIndex_' + this.index + '_Polygons_Group').style.visibility = '';
|
|
@@ -15189,14 +15379,13 @@ class Zoom {
|
|
|
15189
15379
|
}
|
|
15190
15380
|
else if (currentEle.id.indexOf('_Markers_Group') > -1) {
|
|
15191
15381
|
if ((!this.isPanModeEnabled) && !isNullOrUndefined(currentEle.childNodes[0])) {
|
|
15192
|
-
this.markerTranslates(currentEle.childNodes[0], factor, x, y, scale, 'Marker', layerElement
|
|
15382
|
+
this.markerTranslates(currentEle.childNodes[0], factor, x, y, scale, 'Marker', layerElement);
|
|
15193
15383
|
}
|
|
15194
15384
|
currentEle = layerElement.childNodes[j];
|
|
15195
15385
|
let markerAnimation;
|
|
15196
15386
|
if (!isNullOrUndefined(currentEle) && currentEle.id.indexOf('Markers') !== -1) {
|
|
15197
15387
|
Array.prototype.forEach.call(currentEle.childNodes, (childNode, k) => {
|
|
15198
15388
|
this.markerTranslate(childNode, factor, x, y, scale, 'Marker', animate$$1);
|
|
15199
|
-
const layerIndex = parseInt(childNode['id'].split('_LayerIndex_')[1].split('_')[0], 10);
|
|
15200
15389
|
const dataIndex = parseInt(childNode['id'].split('_dataIndex_')[1].split('_')[0], 10);
|
|
15201
15390
|
const markerIndex = parseInt(childNode['id'].split('_MarkerIndex_')[1].split('_')[0], 10);
|
|
15202
15391
|
markerAnimation = this.currentLayer.markerSettings[markerIndex].animationDuration > 0 || animationMode === 'Enable';
|
|
@@ -15289,11 +15478,13 @@ class Zoom {
|
|
|
15289
15478
|
maps.zoomLabelPositions = [];
|
|
15290
15479
|
maps.zoomLabelPositions = maps.dataLabelModule.dataLabelCollections;
|
|
15291
15480
|
const labelAnimate = !maps.isTileMap && animate$$1;
|
|
15481
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
15292
15482
|
const intersect = [];
|
|
15483
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
15293
15484
|
Array.prototype.forEach.call(currentEle.childNodes, (childNode, k) => {
|
|
15294
15485
|
if (currentEle.childNodes[k]['id'].indexOf('_LabelIndex_') > -1) {
|
|
15295
15486
|
const labelIndex = parseFloat(currentEle.childNodes[k]['id'].split('_LabelIndex_')[1].split('_')[0]);
|
|
15296
|
-
|
|
15487
|
+
const zoomShapeWidth = currentEle.childNodes[k].id;
|
|
15297
15488
|
maps.zoomShapeCollection.push(zoomShapeWidth);
|
|
15298
15489
|
this.dataLabelTranslate(currentEle.childNodes[k], factor, x, y, scale, 'DataLabel', labelAnimate, currentLabelIndex, isPanning, intersect);
|
|
15299
15490
|
currentLabelIndex++;
|
|
@@ -15328,7 +15519,7 @@ class Zoom {
|
|
|
15328
15519
|
}
|
|
15329
15520
|
}
|
|
15330
15521
|
}
|
|
15331
|
-
markerTranslates(element, factor, x, y, scale, type, layerElement
|
|
15522
|
+
markerTranslates(element, factor, x, y, scale, type, layerElement) {
|
|
15332
15523
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
15333
15524
|
let templateFn;
|
|
15334
15525
|
let nullCount = 0;
|
|
@@ -15372,6 +15563,7 @@ class Zoom {
|
|
|
15372
15563
|
};
|
|
15373
15564
|
eventArgs = markerShapeChoose(eventArgs, data);
|
|
15374
15565
|
eventArgs = markerColorChoose(eventArgs, data);
|
|
15566
|
+
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
15375
15567
|
this.maps.trigger('markerRendering', eventArgs, (MarkerArgs) => {
|
|
15376
15568
|
if (markerSettings.shapeValuePath !== eventArgs.shapeValuePath) {
|
|
15377
15569
|
eventArgs = markerShapeChoose(eventArgs, data);
|
|
@@ -15478,12 +15670,13 @@ class Zoom {
|
|
|
15478
15670
|
}
|
|
15479
15671
|
if (!isNullOrUndefined(polygonElement)) {
|
|
15480
15672
|
for (let k = 0; k < polygonElement.childElementCount; k++) {
|
|
15481
|
-
|
|
15673
|
+
const width = maps.layersCollection[i].polygonSettings.polygons[k].borderWidth;
|
|
15482
15674
|
polygonElement.childNodes[k].childNodes[0].setAttribute('stroke-width', (width / scale).toString());
|
|
15483
15675
|
}
|
|
15484
15676
|
}
|
|
15485
15677
|
}
|
|
15486
15678
|
}
|
|
15679
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
15487
15680
|
dataLabelTranslate(element, factor, x, y, scale, type, animate$$1 = false, currentLabelIndex, isPanning, intersect) {
|
|
15488
15681
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
15489
15682
|
const labelCollection = this.maps.dataLabelModule.dataLabelCollections;
|
|
@@ -15501,8 +15694,8 @@ class Zoom {
|
|
|
15501
15694
|
}
|
|
15502
15695
|
const duration = this.currentLayer.animationDuration === 0 && animationMode === 'Enable' ? 1000 : this.currentLayer.animationDuration;
|
|
15503
15696
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
15504
|
-
|
|
15505
|
-
|
|
15697
|
+
const label = labelCollection[currentLabelIndex];
|
|
15698
|
+
const index = currentLabelIndex;
|
|
15506
15699
|
if (label['layerIndex'] === layerIndex && label['shapeIndex'] === shapeIndex
|
|
15507
15700
|
&& label['labelIndex'] === labelIndex) {
|
|
15508
15701
|
let labelX = label['location']['x'];
|
|
@@ -15554,7 +15747,7 @@ class Zoom {
|
|
|
15554
15747
|
element.textContent = text;
|
|
15555
15748
|
}
|
|
15556
15749
|
}
|
|
15557
|
-
|
|
15750
|
+
const widthList = [];
|
|
15558
15751
|
if (this.maps.layers[this.index].dataLabelSettings.smartLabelMode === 'Trim') {
|
|
15559
15752
|
if (scale > 1) {
|
|
15560
15753
|
zoomtrimLabel = textTrim((this.maps.dataLabelShape[index] * scale), zoomtext, style, zoomtextSize.width, true, widthList);
|
|
@@ -15595,7 +15788,7 @@ class Zoom {
|
|
|
15595
15788
|
|| textLocations['heightTop'] > intersect[j]['heightBottom']) {
|
|
15596
15789
|
trimmedLable = !isNullOrUndefined(text) ? text : zoomtext;
|
|
15597
15790
|
if (scale > 1) {
|
|
15598
|
-
|
|
15791
|
+
const trimmedWidth = widthList.length > 0 ? widthList[0] : zoomtextSize.width;
|
|
15599
15792
|
trimmedLable = textTrim((this.maps.dataLabelShape[index] * scale), trimmedLable, style, trimmedWidth, true);
|
|
15600
15793
|
}
|
|
15601
15794
|
element.textContent = trimmedLable;
|
|
@@ -15605,7 +15798,7 @@ class Zoom {
|
|
|
15605
15798
|
const width = intersect[j]['rightWidth'] - textLocations['leftWidth'];
|
|
15606
15799
|
const difference = width - (textLocations['rightWidth'] - textLocations['leftWidth']);
|
|
15607
15800
|
text = !isNullOrUndefined(text) ? text : zoomtext;
|
|
15608
|
-
|
|
15801
|
+
const trimmedWidth = widthList.length > 0 ? widthList[0] : zoomtextSize.width;
|
|
15609
15802
|
trimmedLable = textTrim(difference, text, style, trimmedWidth, true);
|
|
15610
15803
|
element.textContent = trimmedLable;
|
|
15611
15804
|
break;
|
|
@@ -15614,7 +15807,7 @@ class Zoom {
|
|
|
15614
15807
|
const width = textLocations['rightWidth'] - intersect[j]['leftWidth'];
|
|
15615
15808
|
const difference = Math.abs(width - (textLocations['rightWidth'] - textLocations['leftWidth']));
|
|
15616
15809
|
text = !isNullOrUndefined(text) ? text : zoomtext;
|
|
15617
|
-
|
|
15810
|
+
const trimmedWidth = widthList.length > 0 ? widthList[0] : zoomtextSize.width;
|
|
15618
15811
|
trimmedLable = textTrim(difference, text, style, trimmedWidth, true);
|
|
15619
15812
|
element.textContent = trimmedLable;
|
|
15620
15813
|
break;
|
|
@@ -15729,11 +15922,11 @@ class Zoom {
|
|
|
15729
15922
|
* @param {PanDirection} direction - Specifies the direction of the panning.
|
|
15730
15923
|
* @param {number} xDifference - Specifies the distance moved in the horizontal direction.
|
|
15731
15924
|
* @param {number} yDifference - Specifies the distance moved in the vertical direction.
|
|
15732
|
-
* @param {PointerEvent | TouchEvent | KeyboardEvent}
|
|
15925
|
+
* @param {PointerEvent | TouchEvent | KeyboardEvent} event - Specifies the pointer event argument.
|
|
15733
15926
|
* @returns {void}
|
|
15734
15927
|
* @private
|
|
15735
15928
|
*/
|
|
15736
|
-
panning(direction, xDifference, yDifference,
|
|
15929
|
+
panning(direction, xDifference, yDifference, event) {
|
|
15737
15930
|
const map = this.maps;
|
|
15738
15931
|
let panArgs;
|
|
15739
15932
|
const down = this.mouseDownPoints;
|
|
@@ -15749,6 +15942,8 @@ class Zoom {
|
|
|
15749
15942
|
let y;
|
|
15750
15943
|
xDifference = !isNullOrUndefined(xDifference) ? xDifference : (down.x - move.x);
|
|
15751
15944
|
yDifference = !isNullOrUndefined(yDifference) ? yDifference : (down.y - move.y);
|
|
15945
|
+
const layerX = event.type.indexOf('mouse') > -1 || event.type.indexOf('key') > -1 ? event['layerX'] : event.touches[0].pageX;
|
|
15946
|
+
const layerY = event.type.indexOf('mouse') > -1 || event.type.indexOf('key') > -1 ? event['layerY'] : event.touches[0].pageY;
|
|
15752
15947
|
this.maps.mergeCluster();
|
|
15753
15948
|
if (!map.isTileMap) {
|
|
15754
15949
|
const legendElement = document.getElementById(map.element.id + '_Legend_Group');
|
|
@@ -15762,7 +15957,7 @@ class Zoom {
|
|
|
15762
15957
|
const panningYDirection = ((yDifference < 0 ? layerRect.top <= (elementRect.top + map.mapAreaRect.y) :
|
|
15763
15958
|
((layerRect.top + layerRect.height + legendHeight + map.margin.top) >= (elementRect.top + elementRect.height))));
|
|
15764
15959
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
15765
|
-
const location = this.maps.getGeoLocation(this.maps.layersCollection.length - 1,
|
|
15960
|
+
const location = this.maps.getGeoLocation(this.maps.layersCollection.length - 1, layerX, layerY);
|
|
15766
15961
|
const minMaxLatitudeLongitude = this.maps.getMinMaxLatitudeLongitude();
|
|
15767
15962
|
panArgs = {
|
|
15768
15963
|
cancel: false, name: pan, maps: map,
|
|
@@ -15791,8 +15986,6 @@ class Zoom {
|
|
|
15791
15986
|
else if (this.maps.tileZoomLevel > 1) {
|
|
15792
15987
|
x = map.tileTranslatePoint.x - xDifference;
|
|
15793
15988
|
y = map.tileTranslatePoint.y - yDifference;
|
|
15794
|
-
this.distanceX = x - map.tileTranslatePoint.x;
|
|
15795
|
-
this.distanceY = y - map.tileTranslatePoint.y;
|
|
15796
15989
|
map.tileTranslatePoint.x = x;
|
|
15797
15990
|
map.tileTranslatePoint.y = y;
|
|
15798
15991
|
if ((map.tileTranslatePoint.y > -10 && yDifference < 0) || ((map.tileTranslatePoint.y < -((Math.pow(2, this.maps.tileZoomLevel) - 2) * 256) && yDifference > 0))) {
|
|
@@ -15802,7 +15995,7 @@ class Zoom {
|
|
|
15802
15995
|
map.translatePoint.x = (map.tileTranslatePoint.x) / map.scale;
|
|
15803
15996
|
map.translatePoint.y = (map.tileTranslatePoint.y) / map.scale;
|
|
15804
15997
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
15805
|
-
const location = this.maps.getTileGeoLocation(
|
|
15998
|
+
const location = this.maps.getTileGeoLocation(layerX, layerY);
|
|
15806
15999
|
const minMaxLatitudeLongitude = this.maps.getMinMaxLatitudeLongitude();
|
|
15807
16000
|
panArgs = {
|
|
15808
16001
|
cancel: false, name: pan, maps: map,
|
|
@@ -15822,14 +16015,10 @@ class Zoom {
|
|
|
15822
16015
|
this.mouseDownPoints = this.mouseMovePoints;
|
|
15823
16016
|
this.isSingleClick = false;
|
|
15824
16017
|
}
|
|
15825
|
-
toAlignSublayer() {
|
|
15826
|
-
this.maps.translatePoint.x = !isNullOrUndefined(this.distanceX) ? (this.maps.translatePoint.x -
|
|
15827
|
-
(this.distanceX / this.maps.scale)) : this.maps.translatePoint.x;
|
|
15828
|
-
this.maps.translatePoint.y = !isNullOrUndefined(this.distanceY) ? this.maps.translatePoint.y -
|
|
15829
|
-
(this.distanceY / this.maps.scale) : this.maps.translatePoint.y;
|
|
15830
|
-
this.applyTransform(this.maps, false);
|
|
15831
|
-
}
|
|
15832
16018
|
/**
|
|
16019
|
+
* @param {number} zoomFactor - Specifies the factor for zooming
|
|
16020
|
+
* @param {string} type - Specifies the type
|
|
16021
|
+
* @returns {void}
|
|
15833
16022
|
* @private
|
|
15834
16023
|
*/
|
|
15835
16024
|
toolBarZooming(zoomFactor, type) {
|
|
@@ -15922,7 +16111,6 @@ class Zoom {
|
|
|
15922
16111
|
}
|
|
15923
16112
|
this.markerLineAnimation(map);
|
|
15924
16113
|
map.mapLayerPanel.generateTiles(tileZoomFactor, map.tileTranslatePoint, type);
|
|
15925
|
-
const element1 = document.getElementById(this.maps.element.id + '_tiles');
|
|
15926
16114
|
const animationDuration = this.maps.layersCollection[0].animationDuration === 0 && animationMode === 'Enable' ? 1000 : this.maps.layersCollection[0].animationDuration;
|
|
15927
16115
|
setTimeout(() => {
|
|
15928
16116
|
this.applyTransform(this.maps, true);
|
|
@@ -15938,12 +16126,11 @@ class Zoom {
|
|
|
15938
16126
|
this.triggerZoomComplete(map, prevLevel, type);
|
|
15939
16127
|
}
|
|
15940
16128
|
/**
|
|
16129
|
+
* @returns {void}
|
|
15941
16130
|
* @private
|
|
15942
16131
|
*/
|
|
15943
16132
|
createZoomingToolbars() {
|
|
15944
16133
|
const map = this.maps;
|
|
15945
|
-
let zoomInElements;
|
|
15946
|
-
let zoomOutElements;
|
|
15947
16134
|
this.toolBarGroup = map.renderer.createGroup({
|
|
15948
16135
|
id: map.element.id + '_Zooming_KitCollection',
|
|
15949
16136
|
opacity: map.theme.toLowerCase() === 'fluentdark' ? 0.6 : 0.3
|
|
@@ -15997,7 +16184,7 @@ class Zoom {
|
|
|
15997
16184
|
});
|
|
15998
16185
|
this.currentToolbarEle.setAttribute('class', 'e-maps-toolbar');
|
|
15999
16186
|
this.currentToolbarEle.appendChild(map.renderer.drawCircle(new CircleOption(map.element.id + '_Zooming_ToolBar_' + toolbar + '_Rect', button.fill, { color: borderColor, width: button.borderWidth, opacity: button.borderOpacity }, button.opacity, cx, cy, radius, '')));
|
|
16000
|
-
|
|
16187
|
+
const opacity = 1;
|
|
16001
16188
|
let direction = '';
|
|
16002
16189
|
const fill = button.fill;
|
|
16003
16190
|
this.selectionColor = this.maps.toolbarProperties.selectionColor || this.maps.themeStyle.zoomSelectionColor;
|
|
@@ -16025,10 +16212,6 @@ class Zoom {
|
|
|
16025
16212
|
fillColor = this.maps.themeStyle.zoomFillColor;
|
|
16026
16213
|
strokeColor = pathStroke;
|
|
16027
16214
|
}
|
|
16028
|
-
else if (!this.maps.zoomSettings.enablePanning && !this.maps.zoomSettings.enableSelectionZooming) {
|
|
16029
|
-
fillColor = fill;
|
|
16030
|
-
strokeColor = pathStroke;
|
|
16031
|
-
}
|
|
16032
16215
|
else {
|
|
16033
16216
|
fillColor = this.selectionColor;
|
|
16034
16217
|
strokeColor = this.selectionColor;
|
|
@@ -16042,18 +16225,20 @@ class Zoom {
|
|
|
16042
16225
|
}
|
|
16043
16226
|
case 'zoomin':
|
|
16044
16227
|
direction = 'M 8, 0 L 8, 16 M 0, 8 L 16, 8';
|
|
16228
|
+
/* eslint-disable no-case-declarations */
|
|
16045
16229
|
const zoomInPath = map.renderer.drawPath(new PathOption(map.element.id + '_Zooming_ToolBar_' + toolbar + '_Path', fill, 3, pathStroke, 1, 1, null, direction));
|
|
16230
|
+
/* eslint-enable no-case-declarations */
|
|
16046
16231
|
zoomInPath.setAttribute('transform', 'scale( ' + scaleX + ',' + scaleX + ' )');
|
|
16047
16232
|
this.currentToolbarEle.appendChild(zoomInPath);
|
|
16048
|
-
zoomInElements = this.currentToolbarEle;
|
|
16049
16233
|
this.wireEvents(this.currentToolbarEle, this.performToolBarAction);
|
|
16050
16234
|
break;
|
|
16051
16235
|
case 'zoomout':
|
|
16052
16236
|
direction = 'M 0, 8 L 16, 8';
|
|
16237
|
+
/* eslint-disable no-case-declarations */
|
|
16053
16238
|
const zoomOutPath = map.renderer.drawPath(new PathOption(map.element.id + '_Zooming_ToolBar_' + toolbar, fill, 3, pathStroke, 1, 1, null, direction));
|
|
16239
|
+
/* eslint-enable no-case-declarations */
|
|
16054
16240
|
zoomOutPath.setAttribute('transform', 'scale( ' + scaleX + ',' + scaleX + ' )');
|
|
16055
16241
|
this.currentToolbarEle.appendChild(zoomOutPath);
|
|
16056
|
-
zoomOutElements = this.currentToolbarEle;
|
|
16057
16242
|
this.wireEvents(this.currentToolbarEle, this.performToolBarAction);
|
|
16058
16243
|
break;
|
|
16059
16244
|
case 'pan': {
|
|
@@ -16083,7 +16268,9 @@ class Zoom {
|
|
|
16083
16268
|
direction = 'M12.364,8h-2.182l2.909,3.25L16,8h-2.182c0-3.575-2.618-6.5-5.818-6.5c-1.128,0-2.218,0.366-3.091,';
|
|
16084
16269
|
direction += '1.016l1.055,1.178C6.581,3.328,7.272,3.125,8,3.125C10.4,3.125,12.363,5.319,12.364,8L12.364,8z M11.091,';
|
|
16085
16270
|
direction += '13.484l-1.055-1.178C9.419,12.672,8.728,12.875,8,12.875c-2.4,0-4.364-2.194-4.364-4.875h2.182L2.909,4.75L0,8h2.182c0,';
|
|
16271
|
+
/* eslint-disable no-case-declarations */
|
|
16086
16272
|
const resetPath = map.renderer.drawPath(new PathOption(map.element.id + '_Zooming_ToolBar_' + toolbar, fill, null, pathStroke, 1, 1, null, direction + '3.575,2.618,6.5,5.818,6.5C9.128,14.5,10.219,14.134,11.091,13.484L11.091,13.484z'));
|
|
16273
|
+
/* eslint-enable no-case-declarations */
|
|
16087
16274
|
resetPath.setAttribute('transform', 'scale( ' + scaleX + ',' + scaleX + ' )');
|
|
16088
16275
|
this.currentToolbarEle.appendChild(resetPath);
|
|
16089
16276
|
this.wireEvents(this.currentToolbarEle, this.performToolBarAction);
|
|
@@ -16093,6 +16280,8 @@ class Zoom {
|
|
|
16093
16280
|
}
|
|
16094
16281
|
}
|
|
16095
16282
|
/**
|
|
16283
|
+
* @param {PointerEvent} e - Specifies the event in the map
|
|
16284
|
+
* @returns {void}
|
|
16096
16285
|
* @private
|
|
16097
16286
|
*/
|
|
16098
16287
|
performToolBarAction(e) {
|
|
@@ -16106,13 +16295,15 @@ class Zoom {
|
|
|
16106
16295
|
isToolbarPerform = (this.maps.isTileMap ? this.maps.tileZoomLevel : this.maps.scale) + 1 <= this.maps.zoomSettings.maxZoom;
|
|
16107
16296
|
break;
|
|
16108
16297
|
case 'zoomout':
|
|
16298
|
+
/* eslint-disable no-case-declarations */
|
|
16109
16299
|
const scaleValue = this.maps.isTileMap ? this.maps.tileZoomLevel : this.maps.scale;
|
|
16300
|
+
/* eslint-enable no-case-declarations */
|
|
16110
16301
|
isToolbarPerform = (this.maps.projectionType === 'Miller' || this.maps.projectionType === 'Winkel3' ||
|
|
16111
16302
|
this.maps.projectionType === 'AitOff') ? Math.round(scaleValue) - 1 >= this.maps.zoomSettings.minZoom :
|
|
16112
16303
|
(scaleValue) - 1 >= this.maps.zoomSettings.minZoom;
|
|
16113
16304
|
break;
|
|
16114
16305
|
case 'reset':
|
|
16115
|
-
isToolbarPerform = Math.round(this.maps.isTileMap ? this.maps.tileZoomLevel : this.maps.scale)
|
|
16306
|
+
isToolbarPerform = Math.round(this.maps.isTileMap ? this.maps.tileZoomLevel : this.maps.scale) !== this.maps.zoomSettings.minZoom;
|
|
16116
16307
|
break;
|
|
16117
16308
|
}
|
|
16118
16309
|
if (isTouch && isToolbarPerform) {
|
|
@@ -16246,6 +16437,8 @@ class Zoom {
|
|
|
16246
16437
|
}
|
|
16247
16438
|
}
|
|
16248
16439
|
/**
|
|
16440
|
+
* @param {PointerEvent} e - Specifies the event in the map
|
|
16441
|
+
* @returns {void}
|
|
16249
16442
|
* @private
|
|
16250
16443
|
*/
|
|
16251
16444
|
showTooltip(e) {
|
|
@@ -16274,6 +16467,7 @@ class Zoom {
|
|
|
16274
16467
|
}
|
|
16275
16468
|
}
|
|
16276
16469
|
/**
|
|
16470
|
+
* @returns {void}
|
|
16277
16471
|
* @private
|
|
16278
16472
|
*/
|
|
16279
16473
|
removeTooltip() {
|
|
@@ -16282,6 +16476,7 @@ class Zoom {
|
|
|
16282
16476
|
}
|
|
16283
16477
|
}
|
|
16284
16478
|
/**
|
|
16479
|
+
* @returns {void}
|
|
16285
16480
|
* @private
|
|
16286
16481
|
*/
|
|
16287
16482
|
alignToolBar() {
|
|
@@ -16341,6 +16536,9 @@ class Zoom {
|
|
|
16341
16536
|
element.appendChild(style);
|
|
16342
16537
|
}
|
|
16343
16538
|
/**
|
|
16539
|
+
* @param {number} factor - Specifies the factor for toolbar
|
|
16540
|
+
* @param {string} id - Specifies the id
|
|
16541
|
+
* @returns {void}
|
|
16344
16542
|
* @private
|
|
16345
16543
|
*/
|
|
16346
16544
|
removeToolbarOpacity(factor, id) {
|
|
@@ -16353,8 +16551,8 @@ class Zoom {
|
|
|
16353
16551
|
else {
|
|
16354
16552
|
this.removeToolbarClass(this.maps.zoomSettings.enableSelectionZooming ? 'e-maps-toolbar' : '', 'e-maps-toolbar', 'e-maps-toolbar', this.maps.zoomSettings.enablePanning ? 'e-maps-toolbar' : '', 'e-maps-toolbar');
|
|
16355
16553
|
}
|
|
16356
|
-
|
|
16357
|
-
|
|
16554
|
+
const toolbarShapeOpacity = this.maps.toolbarProperties.shapeOpacity;
|
|
16555
|
+
const toolbarButtonOpacity = this.maps.toolbarProperties.borderOpacity;
|
|
16358
16556
|
if (this.maps.isTileMap && (factor <= 1.1 || this.maps.zoomSettings.minZoom === factor)) {
|
|
16359
16557
|
if (!this.maps.isDevice) {
|
|
16360
16558
|
this.removeToolbarClass(this.maps.zoomSettings.enableSelectionZooming ? 'e-maps-toolbar' : '', 'e-maps-toolbar', '', this.maps.zoomSettings.enablePanning ? 'e-maps-toolbar' : '', '');
|
|
@@ -16442,6 +16640,12 @@ class Zoom {
|
|
|
16442
16640
|
this.setOpacity('_Zooming_ToolBar_Reset_Rect', '_Zooming_ToolBar_Reset', resetStrokeOpacity, resetOpacity);
|
|
16443
16641
|
}
|
|
16444
16642
|
/**
|
|
16643
|
+
* @param {string} zoomClassStyle - Specifies the style for zoom class.
|
|
16644
|
+
* @param {string} zoomInClassStyle - Specifies the style for zoom in.
|
|
16645
|
+
* @param {string} zoomOutClassStyle - Specifies the style for zoom out.
|
|
16646
|
+
* @param {string} panClassStyle - Specifies the style for pan.
|
|
16647
|
+
* @param {string} resetClassStyle - Specifies the style for reset.
|
|
16648
|
+
* @returns {void}
|
|
16445
16649
|
* @private
|
|
16446
16650
|
*/
|
|
16447
16651
|
removeToolbarClass(zoomClassStyle, zoomInClassStyle, zoomOutClassStyle, panClassStyle, resetClassStyle) {
|
|
@@ -16479,30 +16683,30 @@ class Zoom {
|
|
|
16479
16683
|
* To bind events.
|
|
16480
16684
|
*
|
|
16481
16685
|
* @param {Element} element - Specifies the element.
|
|
16482
|
-
* @param {
|
|
16686
|
+
* @param {Function} process - Specifies the process.
|
|
16483
16687
|
* @returns {void}
|
|
16484
16688
|
* @private
|
|
16485
16689
|
*/
|
|
16486
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
16487
16690
|
wireEvents(element, process) {
|
|
16488
16691
|
EventHandler.add(element, Browser.touchStartEvent, process, this);
|
|
16489
16692
|
EventHandler.add(element, 'mouseover', this.showTooltip, this);
|
|
16490
16693
|
EventHandler.add(element, 'mouseout', this.removeTooltip, this);
|
|
16491
16694
|
}
|
|
16492
16695
|
/**
|
|
16696
|
+
* @param {WheelEvent} e - Specifies the wheel event in the map for zooming
|
|
16697
|
+
* @returns {void}
|
|
16493
16698
|
* @private
|
|
16494
16699
|
*/
|
|
16495
16700
|
mapMouseWheel(e) {
|
|
16496
16701
|
if (this.maps.zoomSettings.enable && this.maps.zoomSettings.mouseWheelZoom) {
|
|
16497
16702
|
const map = this.maps;
|
|
16498
|
-
const size = map.availableSize;
|
|
16499
16703
|
map.markerZoomedState = false;
|
|
16500
16704
|
map.zoomPersistence = map.enablePersistence;
|
|
16501
16705
|
const position = this.getMousePosition(e.pageX, e.pageY);
|
|
16502
16706
|
const prevLevel = map.tileZoomLevel;
|
|
16503
16707
|
const prevScale = map.scale;
|
|
16504
16708
|
const delta = 1;
|
|
16505
|
-
const staticMaxZoomLevel =
|
|
16709
|
+
const staticMaxZoomLevel = map.zoomSettings.maxZoom;
|
|
16506
16710
|
const value = (map.isTileMap) ? prevLevel : prevScale;
|
|
16507
16711
|
if (((position.x > map.mapAreaRect.x) && (position.x < (map.mapAreaRect.x + map.mapAreaRect.width))) &&
|
|
16508
16712
|
(position.y > map.mapAreaRect.y) && position.y < (map.mapAreaRect.y + map.mapAreaRect.height)) {
|
|
@@ -16515,8 +16719,8 @@ class Zoom {
|
|
|
16515
16719
|
map.staticMapZoom = map.tileZoomLevel;
|
|
16516
16720
|
if (map.staticMapZoom > 0 && map.staticMapZoom < staticMaxZoomLevel) {
|
|
16517
16721
|
map.staticMapZoom += 1;
|
|
16722
|
+
this.performZooming(position, (value + delta), direction);
|
|
16518
16723
|
}
|
|
16519
|
-
this.performZooming(position, (value + delta), direction);
|
|
16520
16724
|
}
|
|
16521
16725
|
else {
|
|
16522
16726
|
map.mapScaleValue = value - delta;
|
|
@@ -16537,18 +16741,18 @@ class Zoom {
|
|
|
16537
16741
|
}
|
|
16538
16742
|
}
|
|
16539
16743
|
/**
|
|
16744
|
+
* @param {PointerEvent} e - Specifies the event in the map
|
|
16745
|
+
* @returns {void}
|
|
16540
16746
|
* @private
|
|
16541
16747
|
*/
|
|
16542
16748
|
doubleClick(e) {
|
|
16543
16749
|
const pageX = e.pageX;
|
|
16544
16750
|
const pageY = e.pageY;
|
|
16545
|
-
const
|
|
16546
|
-
let tooltipElement = e.target.closest('#' + this.maps.element.id + '_mapsTooltipparent_template');
|
|
16751
|
+
const tooltipElement = e.target.closest('#' + this.maps.element.id + '_mapsTooltipparent_template');
|
|
16547
16752
|
if (this.maps.zoomSettings.enable && this.maps.zoomSettings.doubleClickZoom
|
|
16548
16753
|
&& !(e.target['id'].indexOf('_Zooming_') > -1) && isNullOrUndefined(tooltipElement)) {
|
|
16549
16754
|
const position = this.getMousePosition(pageX, pageY);
|
|
16550
16755
|
const map = this.maps;
|
|
16551
|
-
const size = map.availableSize;
|
|
16552
16756
|
const prevLevel = map.tileZoomLevel;
|
|
16553
16757
|
const prevScale = map.scale;
|
|
16554
16758
|
map.mapScaleValue = map.mapScaleValue + 1;
|
|
@@ -16560,6 +16764,8 @@ class Zoom {
|
|
|
16560
16764
|
}
|
|
16561
16765
|
}
|
|
16562
16766
|
/**
|
|
16767
|
+
* @param {PointerEvent} e - Specifies the event in the map
|
|
16768
|
+
* @returns {void}
|
|
16563
16769
|
* @private
|
|
16564
16770
|
*/
|
|
16565
16771
|
mouseDownHandler(e) {
|
|
@@ -16567,6 +16773,7 @@ class Zoom {
|
|
|
16567
16773
|
let pageY;
|
|
16568
16774
|
let target;
|
|
16569
16775
|
let touches = null;
|
|
16776
|
+
//eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
16570
16777
|
const element = e.target;
|
|
16571
16778
|
if (e.type === 'touchstart') {
|
|
16572
16779
|
this.isTouch = true;
|
|
@@ -16578,6 +16785,7 @@ class Zoom {
|
|
|
16578
16785
|
else {
|
|
16579
16786
|
pageX = e.pageX;
|
|
16580
16787
|
pageY = e.pageY;
|
|
16788
|
+
//eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
16581
16789
|
target = e.target;
|
|
16582
16790
|
}
|
|
16583
16791
|
if (!this.maps.zoomSettings.enablePanning) {
|
|
@@ -16588,10 +16796,10 @@ class Zoom {
|
|
|
16588
16796
|
this.isPan = this.isPanModeEnabled = !this.isZoomSelection;
|
|
16589
16797
|
}
|
|
16590
16798
|
this.mouseDownLatLong = { x: pageX, y: pageY };
|
|
16591
|
-
|
|
16799
|
+
const scale = this.maps.isTileMap ? Math.round(this.maps.tileZoomLevel) : Math.round(this.maps.mapScaleValue);
|
|
16592
16800
|
this.rectZoomingStart = ((this.isZoomSelection && scale < this.maps.zoomSettings.maxZoom) && this.maps.zoomSettings.enable);
|
|
16593
16801
|
this.mouseDownPoints = this.getMousePosition(pageX, pageY);
|
|
16594
|
-
if (this.isTouch) {
|
|
16802
|
+
if (this.isTouch && touches !== null) {
|
|
16595
16803
|
this.firstMove = true;
|
|
16596
16804
|
this.pinchFactor = this.maps.scale;
|
|
16597
16805
|
this.fingers = touches.length;
|
|
@@ -16599,12 +16807,15 @@ class Zoom {
|
|
|
16599
16807
|
this.isSingleClick = true;
|
|
16600
16808
|
}
|
|
16601
16809
|
/**
|
|
16810
|
+
* @param {PointerEvent} e - Specifies the event in the map
|
|
16811
|
+
* @returns {void}
|
|
16602
16812
|
* @private
|
|
16603
16813
|
*/
|
|
16604
16814
|
mouseMoveHandler(e) {
|
|
16605
16815
|
let pageX;
|
|
16606
16816
|
let pageY;
|
|
16607
16817
|
const map = this.maps;
|
|
16818
|
+
//eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
16608
16819
|
let target;
|
|
16609
16820
|
let touches = null;
|
|
16610
16821
|
const zoom = this.maps.zoomSettings;
|
|
@@ -16629,7 +16840,7 @@ class Zoom {
|
|
|
16629
16840
|
}
|
|
16630
16841
|
}
|
|
16631
16842
|
if (this.isTouch) {
|
|
16632
|
-
if (this.maps.zoomSettings.pinchZooming) {
|
|
16843
|
+
if (this.maps.zoomSettings.pinchZooming && touches !== null) {
|
|
16633
16844
|
if (this.firstMove && touches.length === 2) {
|
|
16634
16845
|
this.rectZoomingStart = false;
|
|
16635
16846
|
this.updateInteraction();
|
|
@@ -16645,9 +16856,7 @@ class Zoom {
|
|
|
16645
16856
|
}
|
|
16646
16857
|
}
|
|
16647
16858
|
this.mouseMovePoints = this.getMousePosition(pageX, pageY);
|
|
16648
|
-
|
|
16649
|
-
const targetEle = e.target;
|
|
16650
|
-
if (zoom.enable && this.isPanModeEnabled && this.maps.markerDragId.indexOf('_MarkerIndex_') == -1 && ((Browser.isDevice && touches.length >= 1) || !Browser.isDevice)) {
|
|
16859
|
+
if (zoom.enable && this.isPanModeEnabled && this.maps.markerDragId.indexOf('_MarkerIndex_') === -1 && ((Browser.isDevice && touches.length >= 1) || !Browser.isDevice)) {
|
|
16651
16860
|
e.preventDefault();
|
|
16652
16861
|
this.maps.element.style.cursor = 'pointer';
|
|
16653
16862
|
this.mouseMoveLatLong = { x: pageX, y: pageY };
|
|
@@ -16659,9 +16868,9 @@ class Zoom {
|
|
|
16659
16868
|
this.mouseDownLatLong['y'] = pageY;
|
|
16660
16869
|
}
|
|
16661
16870
|
}
|
|
16662
|
-
if (this.isTouch ? (touches.length === 1 && this.rectZoomingStart) : this.rectZoomingStart) {
|
|
16871
|
+
if (this.isTouch ? (touches !== null && touches.length === 1 && this.rectZoomingStart) : this.rectZoomingStart) {
|
|
16663
16872
|
e.preventDefault();
|
|
16664
|
-
|
|
16873
|
+
const scale = this.maps.isTileMap ? Math.round(this.maps.tileZoomLevel) : Math.round(this.maps.mapScaleValue);
|
|
16665
16874
|
if (this.maps.zoomSettings.enableSelectionZooming && scale < this.maps.zoomSettings.maxZoom) {
|
|
16666
16875
|
this.drawZoomRectangle();
|
|
16667
16876
|
}
|
|
@@ -16672,10 +16881,11 @@ class Zoom {
|
|
|
16672
16881
|
}
|
|
16673
16882
|
}
|
|
16674
16883
|
/**
|
|
16884
|
+
* @param {PointerEvent} e - Specifies the event in the map
|
|
16885
|
+
* @returns {void}
|
|
16675
16886
|
* @private
|
|
16676
16887
|
*/
|
|
16677
16888
|
mouseUpHandler(e) {
|
|
16678
|
-
const map = this.maps;
|
|
16679
16889
|
this.rectZoomingStart = false;
|
|
16680
16890
|
this.isSingleClick = this.isSingleClick ? true : false;
|
|
16681
16891
|
this.isTouch = false;
|
|
@@ -16683,7 +16893,6 @@ class Zoom {
|
|
|
16683
16893
|
this.touchMoveList = [];
|
|
16684
16894
|
this.lastScale = 1;
|
|
16685
16895
|
this.maps.element.style.cursor = 'auto';
|
|
16686
|
-
// eslint-disable-next-line max-len
|
|
16687
16896
|
if (this.isPanModeEnabled && this.maps.zoomSettings.enablePanning && !isNullOrUndefined(this.maps.previousPoint) &&
|
|
16688
16897
|
(this.maps.translatePoint.x !== this.maps.previousPoint.x && this.maps.translatePoint.y !== this.maps.previousPoint.y)) {
|
|
16689
16898
|
let pageX;
|
|
@@ -16691,10 +16900,9 @@ class Zoom {
|
|
|
16691
16900
|
let layerX = 0;
|
|
16692
16901
|
let layerY = 0;
|
|
16693
16902
|
let target;
|
|
16694
|
-
const rect = this.maps.element.getBoundingClientRect();
|
|
16695
16903
|
const element = e.target;
|
|
16696
16904
|
if (e.type.indexOf('touch') !== -1) {
|
|
16697
|
-
|
|
16905
|
+
const touchArg = e;
|
|
16698
16906
|
layerX = pageX = touchArg.changedTouches[0].pageX;
|
|
16699
16907
|
pageY = touchArg.changedTouches[0].pageY;
|
|
16700
16908
|
layerY = pageY - (this.maps.isTileMap ? 10 : 0);
|
|
@@ -16706,6 +16914,7 @@ class Zoom {
|
|
|
16706
16914
|
pageY = e.pageY;
|
|
16707
16915
|
layerX = e['layerX'];
|
|
16708
16916
|
layerY = e['layerY'] - (this.maps.isTileMap ? 10 : 0);
|
|
16917
|
+
//eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
16709
16918
|
target = e.target;
|
|
16710
16919
|
}
|
|
16711
16920
|
let panCompleteEventArgs;
|
|
@@ -16737,10 +16946,6 @@ class Zoom {
|
|
|
16737
16946
|
this.maps.trigger('panComplete', panCompleteEventArgs);
|
|
16738
16947
|
}
|
|
16739
16948
|
this.isPanModeEnabled = false;
|
|
16740
|
-
if ((!isNullOrUndefined(this.distanceX) || !isNullOrUndefined(this.distanceY)) && (!isNullOrUndefined(this.currentLayer) && this.currentLayer.type === 'SubLayer')) {
|
|
16741
|
-
this.toAlignSublayer();
|
|
16742
|
-
this.distanceX = this.distanceY = null;
|
|
16743
|
-
}
|
|
16744
16949
|
const zoomRectElement = getElementByID(this.maps.element.id + '_Selection_Rect_Zooming');
|
|
16745
16950
|
if (zoomRectElement && this.maps.zoomSettings.enable && this.maps.zoomSettings.enableSelectionZooming) {
|
|
16746
16951
|
remove(zoomRectElement);
|
|
@@ -16748,10 +16953,14 @@ class Zoom {
|
|
|
16748
16953
|
}
|
|
16749
16954
|
this.mouseMoveLatLong = { x: 0, y: 0 };
|
|
16750
16955
|
this.mouseDownLatLong = { x: 0, y: 0 };
|
|
16956
|
+
this.pinchDistance = null;
|
|
16751
16957
|
}
|
|
16752
16958
|
/**
|
|
16959
|
+
* @param {PointerEvent} e - Specifies the event in the map
|
|
16960
|
+
* @returns {void}
|
|
16753
16961
|
* @private
|
|
16754
16962
|
*/
|
|
16963
|
+
//eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
16755
16964
|
mouseCancelHandler(e) {
|
|
16756
16965
|
this.isPanModeEnabled = false;
|
|
16757
16966
|
this.isTouch = false;
|
|
@@ -16771,7 +16980,7 @@ class Zoom {
|
|
|
16771
16980
|
*/
|
|
16772
16981
|
click(e) {
|
|
16773
16982
|
const map = this.maps;
|
|
16774
|
-
|
|
16983
|
+
const tooltipElement = e.target.closest('#' + this.maps.element.id + '_mapsTooltipparent_template');
|
|
16775
16984
|
if ((map.markerModule && map.markerModule.sameMarkerData.length > 0) ||
|
|
16776
16985
|
(e.target['id'].indexOf('MarkerIndex') > -1 && e.target['id'].indexOf('cluster') === -1) || !isNullOrUndefined(tooltipElement)) {
|
|
16777
16986
|
return null;
|
|
@@ -16792,6 +17001,11 @@ class Zoom {
|
|
|
16792
17001
|
}
|
|
16793
17002
|
}
|
|
16794
17003
|
/**
|
|
17004
|
+
* Gets the Mouse Position
|
|
17005
|
+
*
|
|
17006
|
+
* @param {number} pageX - Specifies the Page x in map
|
|
17007
|
+
* @param {number} pageY - Specifies the Page y in map
|
|
17008
|
+
* @returns {Point} - returns the mouse point position
|
|
16795
17009
|
* @private
|
|
16796
17010
|
*/
|
|
16797
17011
|
getMousePosition(pageX, pageY) {
|
|
@@ -16806,6 +17020,7 @@ class Zoom {
|
|
|
16806
17020
|
return new Point(Math.abs(pageX - positionX), Math.abs(pageY - positionY));
|
|
16807
17021
|
}
|
|
16808
17022
|
/**
|
|
17023
|
+
* @returns {void}
|
|
16809
17024
|
* @private
|
|
16810
17025
|
*/
|
|
16811
17026
|
addEventListener() {
|
|
@@ -16821,6 +17036,7 @@ class Zoom {
|
|
|
16821
17036
|
EventHandler.add(this.maps.element, this.cancelEvent, this.mouseCancelHandler, this);
|
|
16822
17037
|
}
|
|
16823
17038
|
/**
|
|
17039
|
+
* @returns {void}
|
|
16824
17040
|
* @private
|
|
16825
17041
|
*/
|
|
16826
17042
|
removeEventListener() {
|
|
@@ -16867,6 +17083,7 @@ class Zoom {
|
|
|
16867
17083
|
this.removeEventListener();
|
|
16868
17084
|
this.layerCollectionEle = null;
|
|
16869
17085
|
this.currentLayer = null;
|
|
17086
|
+
this.pinchDistance = null;
|
|
16870
17087
|
this.maps = null;
|
|
16871
17088
|
}
|
|
16872
17089
|
}
|
|
@@ -16899,6 +17116,7 @@ class Print {
|
|
|
16899
17116
|
const argsData = {
|
|
16900
17117
|
cancel: false, htmlContent: this.getHTMLContent(maps, elements), name: beforePrint
|
|
16901
17118
|
};
|
|
17119
|
+
//eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
16902
17120
|
maps.trigger('beforePrint', argsData, (beforePrintArgs) => {
|
|
16903
17121
|
if (!argsData.cancel) {
|
|
16904
17122
|
print(argsData.htmlContent, printWindow);
|
|
@@ -16916,6 +17134,7 @@ class Print {
|
|
|
16916
17134
|
getHTMLContent(maps, elements) {
|
|
16917
17135
|
const div = createElement('div');
|
|
16918
17136
|
const divElement = maps.element.cloneNode(true);
|
|
17137
|
+
//eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
16919
17138
|
let backgroundElement = (!maps.isTileMap ? divElement.getElementsByTagName('svg')[0] : divElement.getElementsByTagName('svg')[1]);
|
|
16920
17139
|
if (!isNullOrUndefined(backgroundElement)) {
|
|
16921
17140
|
backgroundElement = backgroundElement.childNodes[0];
|
|
@@ -17023,7 +17242,7 @@ class ImageExport {
|
|
|
17023
17242
|
const svgParent = document.getElementById(maps.element.id + '_Tile_SVG_Parent');
|
|
17024
17243
|
let svgDataElement;
|
|
17025
17244
|
let tileSvg;
|
|
17026
|
-
|
|
17245
|
+
const svgObject = getElementByID(maps.element.id + '_svg').cloneNode(true);
|
|
17027
17246
|
const backgroundElement = svgObject.childNodes[0];
|
|
17028
17247
|
const backgroundColor = backgroundElement.getAttribute('fill');
|
|
17029
17248
|
if ((maps.theme === 'Tailwind' || maps.theme === 'Bootstrap5' || maps.theme === 'Fluent' || maps.theme === 'Material3') && (backgroundColor === 'rgba(255,255,255, 0.0)' || backgroundColor === 'transparent')) {
|
|
@@ -17083,7 +17302,7 @@ class ImageExport {
|
|
|
17083
17302
|
const tile = document.getElementById(maps.element.id + '_tile_' + (i - 1));
|
|
17084
17303
|
const exportTileImg = new Image();
|
|
17085
17304
|
exportTileImg.crossOrigin = 'Anonymous';
|
|
17086
|
-
|
|
17305
|
+
const background = maps.background ? maps.background : ((maps.theme === 'Tailwind' || maps.theme === 'Bootstrap5' || maps.theme === 'Fluent' || maps.theme === 'Material3') && (backgroundColor === 'rgba(255,255,255, 0.0)' || backgroundColor === 'transparent')) ? '#ffffff' :
|
|
17087
17306
|
(maps.theme === 'TailwindDark' || maps.theme === 'Bootstrap5Dark' || maps.theme === 'FluentDark' || maps.theme === 'Material3Dark') && (backgroundColor === 'rgba(255,255,255, 0.0)' || backgroundColor === 'transparent') ? '#000000' : '#ffffff';
|
|
17088
17307
|
ctxt.fillStyle = background;
|
|
17089
17308
|
ctxt.fillRect(0, 0, maps.availableSize.width, maps.availableSize.height);
|
|
@@ -17163,7 +17382,7 @@ class ImageExport {
|
|
|
17163
17382
|
* @returns {void}
|
|
17164
17383
|
* @private
|
|
17165
17384
|
*/
|
|
17166
|
-
// eslint-disable-next-line @typescript-eslint/no-
|
|
17385
|
+
// eslint-disable-next-line @typescript-eslint/no-empty-function
|
|
17167
17386
|
destroy() { }
|
|
17168
17387
|
}
|
|
17169
17388
|
|
|
@@ -17177,7 +17396,7 @@ class PdfExport {
|
|
|
17177
17396
|
* Constructor for Maps
|
|
17178
17397
|
*
|
|
17179
17398
|
*/
|
|
17180
|
-
// eslint-disable-next-line @typescript-eslint/no-
|
|
17399
|
+
// eslint-disable-next-line @typescript-eslint/no-empty-function
|
|
17181
17400
|
constructor() { }
|
|
17182
17401
|
/**
|
|
17183
17402
|
* To export the file as image/svg format
|
|
@@ -17192,7 +17411,7 @@ class PdfExport {
|
|
|
17192
17411
|
*/
|
|
17193
17412
|
export(maps, type, fileName, allowDownload, orientation) {
|
|
17194
17413
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
17195
|
-
const promise = new Promise((resolve
|
|
17414
|
+
const promise = new Promise((resolve) => {
|
|
17196
17415
|
if (maps.isTileMap) {
|
|
17197
17416
|
maps.isExportInitialTileMap = true;
|
|
17198
17417
|
}
|
|
@@ -17250,7 +17469,7 @@ class PdfExport {
|
|
|
17250
17469
|
const tile = document.getElementById(maps.element.id + '_tile_' + (i - 1));
|
|
17251
17470
|
const tileImg = new Image();
|
|
17252
17471
|
tileImg.crossOrigin = 'Anonymous';
|
|
17253
|
-
|
|
17472
|
+
const background = maps.background ? maps.background : ((maps.theme === 'Tailwind' || maps.theme === 'Bootstrap5' || maps.theme === 'Fluent' || maps.theme === 'Material3') && (backgroundColor === 'rgba(255,255,255, 0.0)' || backgroundColor === 'transparent')) ? '#ffffff' :
|
|
17254
17473
|
(maps.theme === 'TailwindDark' || maps.theme === 'Bootstrap5Dark' || maps.theme === 'FluentDark' || maps.theme === 'Material3Dark') && (backgroundColor === 'rgba(255,255,255, 0.0)' || backgroundColor === 'transparent') ? '#000000' : '#ffffff';
|
|
17255
17474
|
ctx.fillStyle = background;
|
|
17256
17475
|
ctx.fillRect(0, 0, maps.availableSize.width, maps.availableSize.height);
|
|
@@ -17328,7 +17547,7 @@ class PdfExport {
|
|
|
17328
17547
|
* @returns {void}
|
|
17329
17548
|
* @private
|
|
17330
17549
|
*/
|
|
17331
|
-
// eslint-disable-next-line @typescript-eslint/no-
|
|
17550
|
+
// eslint-disable-next-line @typescript-eslint/no-empty-function
|
|
17332
17551
|
destroy() { }
|
|
17333
17552
|
}
|
|
17334
17553
|
|