@sapui5/sap.ui.vbm 1.136.1 → 1.139.0
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/package.json +1 -1
- package/src/sap/ui/vbm/.library +1 -1
- package/src/sap/ui/vbm/Adapter.js +1 -1
- package/src/sap/ui/vbm/Adapter3D.js +1 -1
- package/src/sap/ui/vbm/ContainerBase.js +4 -4
- package/src/sap/ui/vbm/MapContainer.js +3 -2
- package/src/sap/ui/vbm/Viewport.js +1 -1
- package/src/sap/ui/vbm/adapter3d/ColladaBounds.js +1 -1
- package/src/sap/ui/vbm/adapter3d/DragDropHandler.js +1 -1
- package/src/sap/ui/vbm/adapter3d/ModelHandler.js +1 -1
- package/src/sap/ui/vbm/adapter3d/ObjectFactory.js +1 -1
- package/src/sap/ui/vbm/adapter3d/PolygonHandler.js +1 -1
- package/src/sap/ui/vbm/adapter3d/RectangleTracker.js +20 -12
- package/src/sap/ui/vbm/adapter3d/SceneBuilder.js +1 -1
- package/src/sap/ui/vbm/adapter3d/VBIJSONParser.js +1 -1
- package/src/sap/ui/vbm/library.js +2 -2
- package/src/sap/ui/vbm/vector/MapRenderer.js +144 -7
- package/src/sap/ui/vbm/vector/PayloadGenerator.js +1 -1
- package/src/sap/ui/vbm/vector/RectangularSelection.js +1 -1
- package/src/sap/ui/vbm/vector/VBITransformer.js +14 -3
- package/src/sap/ui/vbm/vector/VectorUtils.js +2 -1
package/package.json
CHANGED
package/src/sap/ui/vbm/.library
CHANGED
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
<name>sap.ui.vbm</name>
|
|
4
4
|
<vendor>SAP SE</vendor>
|
|
5
5
|
<copyright>SAP UI development toolkit for HTML5 (SAPUI5) (c) Copyright 2009-2012 SAP AG. All rights reserved</copyright>
|
|
6
|
-
<version>1.
|
|
6
|
+
<version>1.139.0</version>
|
|
7
7
|
|
|
8
8
|
<documentation>SAP UI library: sap.ui.vbm</documentation>
|
|
9
9
|
|
|
@@ -24,7 +24,7 @@ sap.ui.define([
|
|
|
24
24
|
* @param {string} [sId] id for the new control, generated automatically if no id is given
|
|
25
25
|
* @param {object} [mSettings] initial settings for the new object
|
|
26
26
|
* @author SAP SE
|
|
27
|
-
* @version 1.
|
|
27
|
+
* @version 1.139.0
|
|
28
28
|
* @extends sap.ui.core.Element
|
|
29
29
|
* @constructor
|
|
30
30
|
* @public
|
|
@@ -47,7 +47,7 @@ sap.ui.define([
|
|
|
47
47
|
* @param {string} [sId] id for the new control, generated automatically if no id is given
|
|
48
48
|
* @param {object} [mSettings] initial settings for the new object
|
|
49
49
|
* @author SAP SE
|
|
50
|
-
* @version 1.
|
|
50
|
+
* @version 1.139.0
|
|
51
51
|
* @extends sap.ui.core.Element
|
|
52
52
|
* @constructor
|
|
53
53
|
* @public
|
|
@@ -299,7 +299,7 @@ sap.ui.define([
|
|
|
299
299
|
// segmentedButton for for multiple content entries
|
|
300
300
|
this._oContentSegmentedButton = new SegmentedButton({
|
|
301
301
|
layoutData: oLayoutData.clone(),
|
|
302
|
-
|
|
302
|
+
selectionChange: this._onContentButtonSelect.bind(this)
|
|
303
303
|
});
|
|
304
304
|
|
|
305
305
|
// Left side...
|
|
@@ -628,12 +628,12 @@ sap.ui.define([
|
|
|
628
628
|
ContainerBase.prototype._contentChange = function() {
|
|
629
629
|
var aContent = this.getContent();
|
|
630
630
|
// remove and destroy all buttons for old content
|
|
631
|
-
this._oContentSegmentedButton.
|
|
631
|
+
this._oContentSegmentedButton.removeAllItems();
|
|
632
632
|
this._destroyButtons(this._aContentIcons);
|
|
633
633
|
|
|
634
634
|
this._aContentIcons = [];
|
|
635
635
|
if (aContent.length === 0) {
|
|
636
|
-
this._oContentSegmentedButton.
|
|
636
|
+
this._oContentSegmentedButton.removeAllItems();
|
|
637
637
|
this._setDefaultOnSegmentedButton();
|
|
638
638
|
this.switchContent(null);
|
|
639
639
|
}
|
|
@@ -660,7 +660,7 @@ sap.ui.define([
|
|
|
660
660
|
};
|
|
661
661
|
|
|
662
662
|
ContainerBase.prototype._onContentButtonSelect = function(oEvent) {
|
|
663
|
-
var sContentId = oEvent.getParameter("
|
|
663
|
+
var sContentId = oEvent.getParameter("item").getKey();
|
|
664
664
|
this._switchContent(sContentId);
|
|
665
665
|
};
|
|
666
666
|
|
|
@@ -86,7 +86,7 @@ sap.ui.define([
|
|
|
86
86
|
* List Panel aggregation
|
|
87
87
|
*/
|
|
88
88
|
"listPanelStack": {
|
|
89
|
-
type: "sap.ui.
|
|
89
|
+
type: "sap.ui.vbm.ListPanelStack",
|
|
90
90
|
multiple: false
|
|
91
91
|
},
|
|
92
92
|
/**
|
|
@@ -267,7 +267,8 @@ sap.ui.define([
|
|
|
267
267
|
this._box = new sap.m.HBox().addStyleClass("mapContainerHboxPopover");
|
|
268
268
|
|
|
269
269
|
this._popover = new sap.m.Popover({
|
|
270
|
-
|
|
270
|
+
horizontalScrolling: false,
|
|
271
|
+
verticalScrolling: false,
|
|
271
272
|
placement: sap.m.PlacementType.Horizontal,
|
|
272
273
|
content: this._box,
|
|
273
274
|
showHeader: false
|
|
@@ -22,7 +22,7 @@ sap.ui.define([
|
|
|
22
22
|
*
|
|
23
23
|
* @private
|
|
24
24
|
* @author SAP SE
|
|
25
|
-
* @version 1.
|
|
25
|
+
* @version 1.139.0
|
|
26
26
|
* @alias sap.ui.vbm.adapter3d.ColladaBounds
|
|
27
27
|
*/
|
|
28
28
|
var ColladaBounds = BaseObject.extend("sap.ui.vbm.adapter3d.ColladaBounds", /** @lends sap.ui.vbm.adapter3d.ColladaBounds.prototype */ {
|
|
@@ -83,7 +83,7 @@ sap.ui.define([
|
|
|
83
83
|
*
|
|
84
84
|
* @private
|
|
85
85
|
* @author SAP SE
|
|
86
|
-
* @version 1.
|
|
86
|
+
* @version 1.139.0
|
|
87
87
|
* @alias sap.ui.vbm.adapter3d.DragDropHandler
|
|
88
88
|
*/
|
|
89
89
|
var DragDropHandler = BaseObject.extend("sap.ui.vbm.adapter3d.DragDropHandler", /** @lends sap.ui.vbm.adapter3d.DragDropHandler.prototype */ {
|
|
@@ -29,7 +29,7 @@ sap.ui.define([
|
|
|
29
29
|
*
|
|
30
30
|
* @private
|
|
31
31
|
* @author SAP SE
|
|
32
|
-
* @version 1.
|
|
32
|
+
* @version 1.139.0
|
|
33
33
|
* @alias sap.ui.vbm.adapter3d.ModelHandler
|
|
34
34
|
*/
|
|
35
35
|
var ModelHandler = BaseObject.extend("sap.ui.vbm.adapter3d.ModelHandler", /** @lends sap.ui.vbm.adapter3d.ModelHandler.prototype */ {
|
|
@@ -377,7 +377,7 @@ sap.ui.define([
|
|
|
377
377
|
*
|
|
378
378
|
* @private
|
|
379
379
|
* @author SAP SE
|
|
380
|
-
* @version 1.
|
|
380
|
+
* @version 1.139.0
|
|
381
381
|
* @alias sap.ui.vbm.adapter3d.ObjectFactory
|
|
382
382
|
*/
|
|
383
383
|
var ObjectFactory = BaseObject.extend("sap.ui.vbm.adapter3d.ObjectFactory", /** @lends sap.ui.vbm.adapter3d.ObjectFactory.prototype */ {});
|
|
@@ -32,7 +32,7 @@ sap.ui.define([
|
|
|
32
32
|
*
|
|
33
33
|
* @private
|
|
34
34
|
* @author SAP SE
|
|
35
|
-
* @version 1.
|
|
35
|
+
* @version 1.139.0
|
|
36
36
|
* @alias sap.ui.vbm.adapter3d.PolygonHandler
|
|
37
37
|
*/
|
|
38
38
|
var PolygonHandler = BaseObject.extend("sap.ui.vbm.adapter3d.PolygonHandler", /** @lends sap.ui.vbm.adapter3d.PolygonHandler.prototype */ {
|
|
@@ -39,7 +39,7 @@ sap.ui.define([
|
|
|
39
39
|
*
|
|
40
40
|
* @private
|
|
41
41
|
* @author SAP SE
|
|
42
|
-
* @version 1.
|
|
42
|
+
* @version 1.139.0
|
|
43
43
|
* @alias sap.ui.vbm.adapter3d.RectangleTracker
|
|
44
44
|
*/
|
|
45
45
|
var RectangleTracker = BaseObject.extend("sap.ui.vbm.adapter3d.RectangleTracker", /** @lends sap.ui.vbm.adapter3d.RectangleTracker.prototype */ {
|
|
@@ -114,7 +114,7 @@ sap.ui.define([
|
|
|
114
114
|
var ref = this._viewport.getDomRef();
|
|
115
115
|
if (ref) {
|
|
116
116
|
this._dom = ref;
|
|
117
|
-
this._addListener(ref, "pointerup", this.
|
|
117
|
+
this._addListener(ref, "pointerup", this._onPointerUp);
|
|
118
118
|
this._addListener(ref, "pointerdown", this._onPointerDown);
|
|
119
119
|
this._addListener(ref, "pointermove", this._onPointerMove);
|
|
120
120
|
this._addListener(ref, "pointerleave", this._onPointerCancel);
|
|
@@ -228,15 +228,20 @@ sap.ui.define([
|
|
|
228
228
|
|
|
229
229
|
RectangleTracker.prototype._onPointerMove = function (event) {
|
|
230
230
|
event.preventDefault();
|
|
231
|
-
|
|
232
|
-
if (!this._mouseDown) {
|
|
233
|
-
this._updatePointer(event, _pointer);
|
|
234
|
-
this._handleHover(_pointer);
|
|
235
|
-
}
|
|
236
|
-
|
|
231
|
+
//this._updateController(false);
|
|
237
232
|
if (this._mouseDown) {
|
|
238
|
-
this.
|
|
233
|
+
this._cameraControls.enableRotate = false;
|
|
239
234
|
this.onSelectMove(event);
|
|
235
|
+
this._updatePointer(event, _pointer);
|
|
236
|
+
this._handleHover(_pointer);
|
|
237
|
+
}
|
|
238
|
+
// else if (!this._mouseDown) {
|
|
239
|
+
// this._cameraControls.enableRotate = false;
|
|
240
|
+
// }
|
|
241
|
+
}
|
|
242
|
+
RectangleTracker.prototype._onPointerUp = function (event) {
|
|
243
|
+
this._updateController(true);
|
|
244
|
+
if (!this._mouseDown) {
|
|
240
245
|
var that = this;
|
|
241
246
|
event.cursor = event.cursor || this._getXY(event);
|
|
242
247
|
var rect = this._viewport.getDomRef().getBoundingClientRect();
|
|
@@ -311,7 +316,7 @@ sap.ui.define([
|
|
|
311
316
|
E: [obj]
|
|
312
317
|
}]);
|
|
313
318
|
}
|
|
314
|
-
|
|
319
|
+
|
|
315
320
|
}
|
|
316
321
|
});
|
|
317
322
|
|
|
@@ -324,7 +329,10 @@ sap.ui.define([
|
|
|
324
329
|
});
|
|
325
330
|
}
|
|
326
331
|
}
|
|
327
|
-
|
|
332
|
+
this._mouseDown = false;
|
|
333
|
+
this._dom.style.cursor = this._hovered ? "pointer" : "auto";
|
|
334
|
+
this._updateController(true);
|
|
335
|
+
this.onSelectOver();
|
|
328
336
|
};
|
|
329
337
|
|
|
330
338
|
RectangleTracker.prototype._constructPayload = function (dataMap) {
|
|
@@ -488,7 +496,7 @@ sap.ui.define([
|
|
|
488
496
|
|
|
489
497
|
RectangleTracker.prototype.searchChildInFrustum = function (frustum, object) {
|
|
490
498
|
var count = 0;
|
|
491
|
-
if (object._sapInstance != undefined && !object.
|
|
499
|
+
if (object._sapInstance != undefined && ((object._sapInstance["VB:c"] == 'true' ) || !(object._sapInstance["VB:c"]) )) {
|
|
492
500
|
var box1 = new THREE.BoxHelper(object, 0x000000);
|
|
493
501
|
var vertices = box1.geometry.attributes.position.array;
|
|
494
502
|
for (var i = 0, l = vertices.length; i < l; i += 3) {
|
|
@@ -47,7 +47,7 @@ sap.ui.define([
|
|
|
47
47
|
*
|
|
48
48
|
* @private
|
|
49
49
|
* @author SAP SE
|
|
50
|
-
* @version 1.
|
|
50
|
+
* @version 1.139.0
|
|
51
51
|
* @alias sap.ui.vbm.adapter3d.SceneBuilder
|
|
52
52
|
*/
|
|
53
53
|
var SceneBuilder = BaseObject.extend("sap.ui.vbm.adapter3d.SceneBuilder", /** @lends sap.ui.vbm.adapter3d.SceneBuilder.prototype */ {
|
|
@@ -56,7 +56,7 @@ sap.ui.define([
|
|
|
56
56
|
*
|
|
57
57
|
* @private
|
|
58
58
|
* @author SAP SE
|
|
59
|
-
* @version 1.
|
|
59
|
+
* @version 1.139.0
|
|
60
60
|
* @alias sap.ui.vbm.adapter3d.VBIJSONParser
|
|
61
61
|
*/
|
|
62
62
|
var VBIJSONParser = BaseObject.extend("sap.ui.vbm.adapter3d.VBIJSONParser", /** @lends sap.ui.vbm.adapter3d.VBIJSONParser.prototype */ {
|
|
@@ -20,7 +20,7 @@ sap.ui.define([
|
|
|
20
20
|
* @namespace
|
|
21
21
|
* @alias sap.ui.vbm
|
|
22
22
|
* @author SAP SE
|
|
23
|
-
* @version 1.
|
|
23
|
+
* @version 1.139.0
|
|
24
24
|
* @public
|
|
25
25
|
*/
|
|
26
26
|
|
|
@@ -46,7 +46,7 @@ sap.ui.define([
|
|
|
46
46
|
"sap.ui.vbm.ClusterBase", "sap.ui.vbm.ClusterTree", "sap.ui.vbm.ClusterGrid", "sap.ui.vbm.ClusterDistance", "sap.ui.vbm.Heatmap",
|
|
47
47
|
"sap.ui.vbm.HeatPoint", "sap.ui.vbm.ClusterContainer", "sap.ui.vbm.Adapter", "sap.ui.vbm.Adapter3D"
|
|
48
48
|
],
|
|
49
|
-
version: "1.
|
|
49
|
+
version: "1.139.0"
|
|
50
50
|
});
|
|
51
51
|
|
|
52
52
|
sap.ui.loader.config({
|
|
@@ -38,6 +38,8 @@ sap.ui.define([
|
|
|
38
38
|
let spotid = 0;
|
|
39
39
|
let fixedBounds;
|
|
40
40
|
var containerID;
|
|
41
|
+
let previousCenter = null;
|
|
42
|
+
let previousZoom = null;
|
|
41
43
|
|
|
42
44
|
|
|
43
45
|
|
|
@@ -57,6 +59,12 @@ sap.ui.define([
|
|
|
57
59
|
}
|
|
58
60
|
|
|
59
61
|
VBI.MapRenderer.renderMap = () => {
|
|
62
|
+
|
|
63
|
+
if (this.map) {
|
|
64
|
+
previousCenter = this.map.getCenter();
|
|
65
|
+
previousZoom = this.map.getZoom();
|
|
66
|
+
this.map.remove();
|
|
67
|
+
}
|
|
60
68
|
|
|
61
69
|
let geoJSON = VBI.VBITransformer.getTransformedJSON();
|
|
62
70
|
|
|
@@ -68,10 +76,23 @@ sap.ui.define([
|
|
|
68
76
|
document.head.appendChild(styleSheet);
|
|
69
77
|
|
|
70
78
|
const map = VectorUtils.createMap(geoJSON, map_container);
|
|
79
|
+
|
|
80
|
+
if (previousCenter && previousZoom !== null) {
|
|
81
|
+
map.jumpTo({
|
|
82
|
+
center: [previousCenter.lng, previousCenter.lat],
|
|
83
|
+
zoom: previousZoom
|
|
84
|
+
|
|
85
|
+
});
|
|
86
|
+
}
|
|
87
|
+
|
|
71
88
|
const canvas = map.getCanvasContainer();
|
|
72
89
|
const rectangularSelection = new RectangularSelection(map);
|
|
73
90
|
const lassoSelection = new LassoSelection(map);
|
|
74
91
|
const mapCanvas = map.getCanvas();
|
|
92
|
+
const popupLink = new maplibregl.Popup({
|
|
93
|
+
closeButton: false,
|
|
94
|
+
closeOnClick: false
|
|
95
|
+
});
|
|
75
96
|
mapCanvas.id = VectorUtils._setcanvasid();
|
|
76
97
|
// Set `true` to dispatch the event before other functions
|
|
77
98
|
// call it. This is necessary for disabling the default map
|
|
@@ -129,7 +150,11 @@ sap.ui.define([
|
|
|
129
150
|
// Create a popup, but don't add it to the map yet.
|
|
130
151
|
const popup = new maplibregl.Popup({
|
|
131
152
|
closeButton: false,
|
|
132
|
-
closeOnClick: false
|
|
153
|
+
closeOnClick: false,
|
|
154
|
+
offset: {
|
|
155
|
+
'top': [0, 0],
|
|
156
|
+
'bottom': [0, -25]
|
|
157
|
+
}
|
|
133
158
|
});
|
|
134
159
|
// add markers to map only for Points
|
|
135
160
|
const pointFeatures = [];
|
|
@@ -139,8 +164,9 @@ sap.ui.define([
|
|
|
139
164
|
// create a DOM element for the marker (parent div)
|
|
140
165
|
const el = VectorUtils.createSpotElement(marker);
|
|
141
166
|
if (marker.properties.Icon) {
|
|
167
|
+
const iconColor = marker.properties.contentColor? marker.properties.contentColor : "#000000";
|
|
142
168
|
// Create child element for the SAP icon (icon overlay)
|
|
143
|
-
const child_el = VectorUtils.createIconElement(marker.properties.Icon);
|
|
169
|
+
const child_el = VectorUtils.createIconElement(marker.properties.Icon, iconColor);
|
|
144
170
|
child_el.id = '__mapspot' + spotid++;
|
|
145
171
|
// Append the icon inside the marker
|
|
146
172
|
el.appendChild(child_el);
|
|
@@ -148,8 +174,8 @@ sap.ui.define([
|
|
|
148
174
|
// add marker to map
|
|
149
175
|
let spot = new maplibregl.Marker({
|
|
150
176
|
element: el,
|
|
151
|
-
draggable: true
|
|
152
|
-
|
|
177
|
+
draggable: true,
|
|
178
|
+
offset: [0, -20]
|
|
153
179
|
}).setLngLat(marker.geometry.coordinates)
|
|
154
180
|
.on('dragend', onDragEnd)
|
|
155
181
|
.addTo(map);
|
|
@@ -370,8 +396,69 @@ sap.ui.define([
|
|
|
370
396
|
if (that.Apressed || that.Rpressed) {
|
|
371
397
|
el.style.cursor = 'crosshair';
|
|
372
398
|
} else {
|
|
373
|
-
|
|
374
|
-
|
|
399
|
+
function renderTooltip(marker, popup, map) {
|
|
400
|
+
if (!document.getElementById('custom-maplibre-tooltip-style')) {
|
|
401
|
+
const style = document.createElement('style');
|
|
402
|
+
style.id = 'custom-maplibre-tooltip-style';
|
|
403
|
+
style.innerHTML = `
|
|
404
|
+
.maplibregl-popup {
|
|
405
|
+
background: transparent !important;
|
|
406
|
+
box-shadow: none !important;
|
|
407
|
+
padding: 0 !important;
|
|
408
|
+
width: auto;
|
|
409
|
+
}
|
|
410
|
+
.maplibregl-popup-content {
|
|
411
|
+
background: transparent !important;
|
|
412
|
+
padding: 0 !important;
|
|
413
|
+
box-shadow: none !important;
|
|
414
|
+
border-radius: 0 !important;
|
|
415
|
+
width: auto;
|
|
416
|
+
}
|
|
417
|
+
`;
|
|
418
|
+
document.head.appendChild(style);
|
|
419
|
+
}
|
|
420
|
+
|
|
421
|
+
const isDarkTheme = window.matchMedia &&
|
|
422
|
+
window.matchMedia('(prefers-color-scheme: dark)').matches;
|
|
423
|
+
|
|
424
|
+
const outerBorderColor = 'none';
|
|
425
|
+
const innerBgColor = isDarkTheme ? '#545555' : '#f0f0f0';
|
|
426
|
+
const textColor = isDarkTheme ? 'white' : 'f0f0f0';
|
|
427
|
+
|
|
428
|
+
const tooltipContent = marker.properties.ToolTip.replace(/\n/g, '<br>');
|
|
429
|
+
|
|
430
|
+
const tooltip = `
|
|
431
|
+
|
|
432
|
+
<div style="
|
|
433
|
+
background-color: ${innerBgColor};
|
|
434
|
+
color: ${textColor};
|
|
435
|
+
padding: 8px;
|
|
436
|
+
border-radius: 6px;
|
|
437
|
+
max-height: 180px;
|
|
438
|
+
display: inline-block;
|
|
439
|
+
font-family: Arial;
|
|
440
|
+
font-size: 0.875rem;
|
|
441
|
+
width: auto;
|
|
442
|
+
white-space: nowrap;
|
|
443
|
+
border: 2px solid ${outerBorderColor};
|
|
444
|
+
">
|
|
445
|
+
${tooltipContent}
|
|
446
|
+
</div>`;
|
|
447
|
+
|
|
448
|
+
popup.setLngLat(marker.geometry.coordinates)
|
|
449
|
+
.setHTML(tooltip)
|
|
450
|
+
.addTo(map);
|
|
451
|
+
}
|
|
452
|
+
|
|
453
|
+
// 2. Initial render
|
|
454
|
+
renderTooltip(marker, popup, map);
|
|
455
|
+
|
|
456
|
+
// 3. Re-render tooltip on system theme change
|
|
457
|
+
window.matchMedia('(prefers-color-scheme: dark)')
|
|
458
|
+
.addEventListener('change', () => {
|
|
459
|
+
popup.remove();
|
|
460
|
+
renderTooltip(marker, popup, map);
|
|
461
|
+
});
|
|
375
462
|
}
|
|
376
463
|
}
|
|
377
464
|
|
|
@@ -566,10 +653,59 @@ sap.ui.define([
|
|
|
566
653
|
|
|
567
654
|
});
|
|
568
655
|
// Change mouse cursor when hovering over the line
|
|
569
|
-
map.on('mouseenter', 'geojson-source-route', function () {
|
|
656
|
+
map.on('mouseenter', 'geojson-source-route', function (event) {
|
|
570
657
|
if (!that.Apressed && !that.Rpressed) {
|
|
571
658
|
map.getCanvas().style.cursor = 'pointer';
|
|
572
659
|
}
|
|
660
|
+
if (!document.getElementById('custom-maplibre-tooltip-style')) {
|
|
661
|
+
const style = document.createElement('style');
|
|
662
|
+
style.id = 'custom-maplibre-tooltip-style';
|
|
663
|
+
style.innerHTML = `
|
|
664
|
+
.maplibregl-popup {
|
|
665
|
+
background: transparent !important;
|
|
666
|
+
box-shadow: none !important;
|
|
667
|
+
padding: 0 !important;
|
|
668
|
+
width: auto;
|
|
669
|
+
}
|
|
670
|
+
.maplibregl-popup-content {
|
|
671
|
+
background: transparent !important;
|
|
672
|
+
padding: 0 !important;
|
|
673
|
+
box-shadow: none !important;
|
|
674
|
+
border-radius: 0 !important;
|
|
675
|
+
width: auto;
|
|
676
|
+
} `;
|
|
677
|
+
document.head.appendChild(style);
|
|
678
|
+
}
|
|
679
|
+
|
|
680
|
+
const isDarkTheme = window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches;
|
|
681
|
+
|
|
682
|
+
const outerBorderColor = 'none';
|
|
683
|
+
const innerBgColor = isDarkTheme ? '#545555' : '#f0f0f0';
|
|
684
|
+
const textColor = isDarkTheme ? 'white' : 'f0f0f0';
|
|
685
|
+
|
|
686
|
+
const coordinates = event.lngLat;
|
|
687
|
+
const description = event.features[0].properties.ToolTip || "";
|
|
688
|
+
|
|
689
|
+
const tooltipContent = description.replace(/\n/g, '<br>');
|
|
690
|
+
|
|
691
|
+
const tooltip = ` <div style="
|
|
692
|
+
background-color: ${innerBgColor};
|
|
693
|
+
color: ${textColor};
|
|
694
|
+
padding: 8px;
|
|
695
|
+
border-radius: 6px;
|
|
696
|
+
max-height: 180px;
|
|
697
|
+
display: inline-block;
|
|
698
|
+
font-family: Arial;
|
|
699
|
+
font-size: 0.875rem;
|
|
700
|
+
width: auto;
|
|
701
|
+
white-space: nowrap;
|
|
702
|
+
border: 2px solid ${outerBorderColor};
|
|
703
|
+
">
|
|
704
|
+
${tooltipContent}
|
|
705
|
+
</div> `;
|
|
706
|
+
|
|
707
|
+
popupLink.setLngLat(coordinates).setHTML(tooltip).addTo(map);
|
|
708
|
+
|
|
573
709
|
});
|
|
574
710
|
|
|
575
711
|
// Revert mouse cursor back when not hovering
|
|
@@ -577,6 +713,7 @@ sap.ui.define([
|
|
|
577
713
|
if (!that.Apressed && !that.Rpressed) {
|
|
578
714
|
map.getCanvas().style.cursor = '';
|
|
579
715
|
}
|
|
716
|
+
popupLink.remove();
|
|
580
717
|
});
|
|
581
718
|
map.on('click', 'geojson-source-route', function (e) {
|
|
582
719
|
//Trigger payload
|
|
@@ -362,8 +362,13 @@ sap.ui.define([
|
|
|
362
362
|
// "id" : currRoute['VB:ix'],
|
|
363
363
|
"id": route_id++,
|
|
364
364
|
};
|
|
365
|
-
|
|
366
|
-
|
|
365
|
+
let indexNum = featureCollection.findIndex(item => item.properties.Key === route_data.properties.Key)
|
|
366
|
+
if (indexNum !== -1) {
|
|
367
|
+
featureCollection[indexNum] = route_data
|
|
368
|
+
}
|
|
369
|
+
else {
|
|
370
|
+
featureCollection.push(route_data);
|
|
371
|
+
}
|
|
367
372
|
}
|
|
368
373
|
}
|
|
369
374
|
} else {
|
|
@@ -416,7 +421,13 @@ sap.ui.define([
|
|
|
416
421
|
// "id" : currRoute['VB:ix'],
|
|
417
422
|
"id": route_id++,
|
|
418
423
|
};
|
|
419
|
-
featureCollection.
|
|
424
|
+
let indexNum = featureCollection.findIndex(item => item.properties.Key === route_data.properties.Key)
|
|
425
|
+
if (indexNum !== -1) {
|
|
426
|
+
featureCollection[indexNum] = route_data
|
|
427
|
+
}
|
|
428
|
+
else {
|
|
429
|
+
featureCollection.push(route_data);
|
|
430
|
+
}
|
|
420
431
|
}
|
|
421
432
|
}
|
|
422
433
|
}
|
|
@@ -50,7 +50,7 @@ sap.ui.define([
|
|
|
50
50
|
var validDrop = drag.some(item => drop.includes(item));
|
|
51
51
|
return validDrop;
|
|
52
52
|
};
|
|
53
|
-
VectorUtils.createIconElement = (Icon) => {
|
|
53
|
+
VectorUtils.createIconElement = (Icon, iconColor) => {
|
|
54
54
|
const child_el = document.createElement('div');
|
|
55
55
|
child_el.className = 'marker';
|
|
56
56
|
child_el.style.position = 'absolute'; // Position it absolutely inside the parent
|
|
@@ -59,6 +59,7 @@ sap.ui.define([
|
|
|
59
59
|
child_el.style.transform = 'translate(-50%, -50%)'; // Center the icon
|
|
60
60
|
child_el.style.fontFamily = 'SAP-icons';
|
|
61
61
|
child_el.style.fontSize = '20px'; // Adjust size as needed
|
|
62
|
+
child_el.style.color = iconColor;
|
|
62
63
|
var iconInfo = sap.ui.core.IconPool.getIconInfo(Icon);
|
|
63
64
|
child_el.innerHTML = iconInfo.content;
|
|
64
65
|
return child_el;
|