@sapui5/sap.ui.vbm 1.143.0 → 1.144.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sapui5/sap.ui.vbm",
-  "version": "1.143.0",
+  "version": "1.144.0",
   "description": "SAPUI5 Library sap.ui.vbm",
   "homepage": "https://sap.github.io/ui5-tooling/pages/SAPUI5/",
   "author": "SAP SE (https://www.sap.com)",

package/src/sap/ui/vbm/.library

@@ -3,7 +3,7 @@
 	<name>sap.ui.vbm</name>
 	<vendor>SAP SE</vendor>
 	<copyright>SAP UI development toolkit for HTML5 (SAPUI5) (c) Copyright 2009-2012 SAP AG. All rights reserved</copyright>
-	<version>1.143.0</version>
+	<version>1.144.0</version>
 
 	<documentation>SAP UI library: sap.ui.vbm</documentation>
 

package/src/sap/ui/vbm/Adapter.js

@@ -24,7 +24,7 @@ sap.ui.define([
 	 * @param {string} [sId] id for the new control, generated automatically if no id is given
 	 * @param {object} [mSettings] initial settings for the new object
 	 * @author SAP SE
-	 * @version 1.143.0
+	 * @version 1.144.0
 	 * @extends sap.ui.core.Element
 	 * @constructor
 	 * @public

package/src/sap/ui/vbm/Adapter3D.js

@@ -47,7 +47,7 @@ sap.ui.define([
 	 * @param {string} [sId] id for the new control, generated automatically if no id is given
 	 * @param {object} [mSettings] initial settings for the new object
 	 * @author SAP SE
-	 * @version 1.143.0
+	 * @version 1.144.0
 	 * @extends sap.ui.core.Element
 	 * @constructor
 	 * @public

package/src/sap/ui/vbm/Viewport.js

@@ -23,7 +23,7 @@ sap.ui.define([
 	 *
 	 * @public
 	 * @author SAP SE
-	 * @version 1.143.0
+	 * @version 1.144.0
 	 * @extends sap.ui.core.Control
 	 * @alias sap.ui.vbm.Viewport
 	 */

package/src/sap/ui/vbm/adapter3d/ColladaBounds.js

@@ -22,7 +22,7 @@ sap.ui.define([
 		 *
 		 * @private
 		 * @author SAP SE
-		 * @version 1.143.0
+		 * @version 1.144.0
 		 * @alias sap.ui.vbm.adapter3d.ColladaBounds
 		 */
 	var ColladaBounds = BaseObject.extend("sap.ui.vbm.adapter3d.ColladaBounds", /** @lends sap.ui.vbm.adapter3d.ColladaBounds.prototype */ {

package/src/sap/ui/vbm/adapter3d/DragDropHandler.js

@@ -83,7 +83,7 @@ sap.ui.define([
 	 *
 	 * @private
 	 * @author SAP SE
-	 * @version 1.143.0
+	 * @version 1.144.0
 	 * @alias sap.ui.vbm.adapter3d.DragDropHandler
 	 */
 	var DragDropHandler = BaseObject.extend("sap.ui.vbm.adapter3d.DragDropHandler", /** @lends sap.ui.vbm.adapter3d.DragDropHandler.prototype */ {

package/src/sap/ui/vbm/adapter3d/ModelHandler.js

@@ -29,7 +29,7 @@ sap.ui.define([
 	 *
 	 * @private
 	 * @author SAP SE
-	 * @version 1.143.0
+	 * @version 1.144.0
 	 * @alias sap.ui.vbm.adapter3d.ModelHandler
 	 */
 	var ModelHandler = BaseObject.extend("sap.ui.vbm.adapter3d.ModelHandler", /** @lends sap.ui.vbm.adapter3d.ModelHandler.prototype */ {

package/src/sap/ui/vbm/adapter3d/ObjectFactory.js

@@ -377,7 +377,7 @@ sap.ui.define([
 	 *
 	 * @private
 	 * @author SAP SE
-	 * @version 1.143.0
+	 * @version 1.144.0
 	 * @alias sap.ui.vbm.adapter3d.ObjectFactory
 	 */
 	var ObjectFactory = BaseObject.extend("sap.ui.vbm.adapter3d.ObjectFactory", /** @lends sap.ui.vbm.adapter3d.ObjectFactory.prototype */ {});

package/src/sap/ui/vbm/adapter3d/PolygonHandler.js

@@ -32,7 +32,7 @@ sap.ui.define([
 	 *
 	 * @private
 	 * @author SAP SE
-	 * @version 1.143.0
+	 * @version 1.144.0
 	 * @alias sap.ui.vbm.adapter3d.PolygonHandler
 	 */
 	var PolygonHandler = BaseObject.extend("sap.ui.vbm.adapter3d.PolygonHandler", /** @lends sap.ui.vbm.adapter3d.PolygonHandler.prototype */ {

package/src/sap/ui/vbm/adapter3d/RectangleTracker.js

@@ -39,7 +39,7 @@ sap.ui.define([
 	 *
 	 * @private
 	 * @author SAP SE
-	 * @version 1.143.0
+	 * @version 1.144.0
 	 * @alias sap.ui.vbm.adapter3d.RectangleTracker
 	 */
 	var RectangleTracker = BaseObject.extend("sap.ui.vbm.adapter3d.RectangleTracker", /** @lends sap.ui.vbm.adapter3d.RectangleTracker.prototype */ {

package/src/sap/ui/vbm/adapter3d/SceneBuilder.js

@@ -47,7 +47,7 @@ sap.ui.define([
 	 *
 	 * @private
 	 * @author SAP SE
-	 * @version 1.143.0
+	 * @version 1.144.0
 	 * @alias sap.ui.vbm.adapter3d.SceneBuilder
 	 */
 	var SceneBuilder = BaseObject.extend("sap.ui.vbm.adapter3d.SceneBuilder", /** @lends sap.ui.vbm.adapter3d.SceneBuilder.prototype */ {

package/src/sap/ui/vbm/adapter3d/VBIJSONParser.js

@@ -56,7 +56,7 @@ sap.ui.define([
 	 *
 	 * @private
 	 * @author SAP SE
-	 * @version 1.143.0
+	 * @version 1.144.0
 	 * @alias sap.ui.vbm.adapter3d.VBIJSONParser
 	 */
 	var VBIJSONParser = BaseObject.extend("sap.ui.vbm.adapter3d.VBIJSONParser", /** @lends sap.ui.vbm.adapter3d.VBIJSONParser.prototype */ {

package/src/sap/ui/vbm/library.js

@@ -20,7 +20,7 @@ sap.ui.define([
 	 * @namespace
 	 * @alias sap.ui.vbm
 	 * @author SAP SE
-	 * @version 1.143.0
+	 * @version 1.144.0
 	 * @public
 	 */
 
@@ -46,7 +46,7 @@ sap.ui.define([
 			"sap.ui.vbm.ClusterBase", "sap.ui.vbm.ClusterTree", "sap.ui.vbm.ClusterGrid", "sap.ui.vbm.ClusterDistance", "sap.ui.vbm.Heatmap",
 			"sap.ui.vbm.HeatPoint", "sap.ui.vbm.ClusterContainer", "sap.ui.vbm.Adapter", "sap.ui.vbm.Adapter3D"
 		],
-		version: "1.143.0"
+		version: "1.144.0"
 	});
 
 	sap.ui.loader.config({

package/src/sap/ui/vbm/vector/MapRenderer.js

@@ -515,22 +515,33 @@ sap.ui.define([
 						predefinedMarkers.push(markerCoordinates);
 					}
 				} else if (marker.geometry.type == "LineString") {
-
+					
 					if (marker.properties.Label) {
-						const midpoint = getMidpoint(marker.geometry.coordinates);
+						const coords = marker.geometry.coordinates;            
+						let midpoint = getVisualMidpoint(coords, map);           
 				
 						const routeLabelEl = VectorUtils.createRouteLabel(
 							marker.properties.Label,
 							marker.properties.LabelBGColor
 						);
-				
-						new maplibregl.Marker({
+						const labelMarker = new maplibregl.Marker({
 							element: routeLabelEl,
-							anchor: 'left',   
+							anchor: 'left',
+							offset: [10, 0]
 						})
 						.setLngLat(midpoint)
 						.addTo(map);
+						
+						map.on('move', () => {
+							try {
+								const newPos = getVisualMidpoint(coords, map);
+								labelMarker.setLngLat(newPos);
+							} catch (e) {
+								console.warn("Label update failed:", e);
+							}
+						});
 					}
+
 					const coords = marker.geometry.coordinates;
 					const startCoord = coords[0];  // First coordinate
 					const endCoord = coords[coords.length - 1];  // Last coordinate
@@ -630,16 +641,188 @@ sap.ui.define([
 				'filter': ['==', '$type', 'LineString']
 			});
 			
-			function getMidpoint(coords) {
-				if (coords.length < 2) return coords[0]; 
-				
-				const start = coords[0];
-				const end = coords[coords.length - 1];
-				const midLng = (start[0] + end[0]) / 2;
-				const midLat = (start[1] + end[1]) / 2;
-				
-				return [midLng, midLat];
-			}
+	function getVisualMidpoint(coords, map) {
+
+    if (!Array.isArray(coords) || coords.length < 2) {
+     console.warn("getVisualMidpoint(): invalid coords", coords);
+     return coords?.[0] || [0, 0];
+    }
+
+    const clean = coords.filter(c =>
+     Array.isArray(c) &&
+     typeof c[0] === "number" &&
+     typeof c[1] === "number" &&
+     isFinite(c[0]) &&
+     isFinite(c[1])
+    );
+
+    if (clean.length < 2) {
+     console.warn("getVisualMidpoint(): after cleaning, less than 2 coords", clean);
+     return clean[0] || [0, 0];
+    }
+
+    coords = clean;
+    let projected;
+    try {
+     projected = coords.map(c => map.project({ lng: c[0], lat: c[1] }));
+    } catch (e) {
+     console.warn("project() failed for coords:", coords, e);
+     return coords[0];
+    }
+
+    const mapSize = map.getContainer().getBoundingClientRect();
+    const screenBounds = {
+     left: 0,
+     right: mapSize.width,
+     top: 0,
+     bottom: mapSize.height
+    };
+
+    const clipped = clipLineToScreen(projected, screenBounds);
+
+    if (clipped && clipped.length >= 2) {
+     try {
+      let totalLength = 0;
+      const segmentLengths = [];
+
+      for (let i = 0; i < clipped.length - 1; i++) {
+       const dx = clipped[i + 1].x - clipped[i].x;
+       const dy = clipped[i + 1].y - clipped[i].y;
+       const len = Math.sqrt(dx * dx + dy * dy);
+
+       if (isFinite(len) && len > 0) {
+        segmentLengths.push(len);
+        totalLength += len;
+       }
+      }
+
+      if (totalLength === 0) throw "Zero total length";
+
+      let half = totalLength / 2;
+      let acc = 0;
+
+      for (let i = 0; i < segmentLengths.length; i++) {
+       const seg = segmentLengths[i];
+
+       if (!seg || !isFinite(seg)) continue;
+
+       if (acc + seg >= half) {
+        const ratio = (half - acc) / seg;
+
+        const x = clipped[i].x + ratio * (clipped[i + 1].x - clipped[i].x);
+        const y = clipped[i].y + ratio * (clipped[i + 1].y - clipped[i].y);
+
+        if (!isFinite(x) || !isFinite(y)) throw "NaN midpoint";
+
+        const mid = map.unproject({ x, y });
+        return [mid.lng, mid.lat];
+       }
+       acc += seg;
+      }
+     } catch (err) {
+      console.warn("Midpoint visual calculation failed, using geographic midpoint", err);
+     }
+    }
+
+    return computeGeographicMidpoint(coords);
+   }
+   function computeGeographicMidpoint(coords) {
+    const mid = Math.floor(coords.length / 2);
+    return coords[mid];
+   }
+
+
+ 
+   function clipLineToScreen(projectedCoords, bounds) {
+    const clipped = [];
+
+    for (let i = 0; i < projectedCoords.length - 1; i++) {
+     const p1 = projectedCoords[i];
+     const p2 = projectedCoords[i + 1];
+
+     if (!p1 || !p2) continue;
+
+     const seg = clipSegmentToRect(p1, p2, bounds);
+
+     if (seg) {
+      if (clipped.length === 0) clipped.push(seg[0]);
+      clipped.push(seg[1]);
+     }
+    }
+
+    return clipped.length > 1 ? clipped : null;
+   }
+
+   function clipSegmentToRect(p1, p2, rect) {
+
+    const INSIDE = 0, LEFT = 1, RIGHT = 2, BOTTOM = 4, TOP = 8;
+
+    const computeOutCode = (x, y) => {
+     let code = INSIDE;
+     if (x < rect.left) code |= LEFT;
+     else if (x > rect.right) code |= RIGHT;
+     if (y < rect.top) code |= TOP;
+     else if (y > rect.bottom) code |= BOTTOM;
+     return code;
+    };
+
+    let x1 = p1.x, y1 = p1.y, x2 = p2.x, y2 = p2.y;
+
+    if (![x1, x2, y1, y2].every(isFinite)) return null;
+
+    let outcode1 = computeOutCode(x1, y1);
+    let outcode2 = computeOutCode(x2, y2);
+
+    let accept = false;
+
+    while (true) {
+     if (!(outcode1 | outcode2)) {
+      accept = true;
+      break;
+     } else if (outcode1 & outcode2) {
+      break;
+     } else {
+      const out = outcode1 ? outcode1 : outcode2;
+
+      const dx = x2 - x1;
+      const dy = y2 - y1;
+
+      if (!isFinite(dx) || !isFinite(dy)) return null;
+
+      let x, y;
+
+      if (out & TOP) {
+       if (dy === 0) return null;
+       x = x1 + dx * (rect.top - y1) / dy;
+       y = rect.top;
+      } else if (out & BOTTOM) {
+       if (dy === 0) return null;
+       x = x1 + dx * (rect.bottom - y1) / dy;
+       y = rect.bottom;
+      } else if (out & RIGHT) {
+       if (dx === 0) return null;
+       y = y1 + dy * (rect.right - x1) / dx;
+       x = rect.right;
+      } else if (out & LEFT) {
+       if (dx === 0) return null;
+       y = y1 + dy * (rect.left - x1) / dx;
+       x = rect.left;
+      }
+
+      if (!isFinite(x) || !isFinite(y)) return null;
+
+      if (out === outcode1) {
+       x1 = x; y1 = y;
+       outcode1 = computeOutCode(x1, y1);
+      } else {
+       x2 = x; y2 = y;
+       outcode2 = computeOutCode(x2, y2);
+      }
+     }
+    }
+
+    return accept ? [{ x: x1, y: y1 }, { x: x2, y: y2 }] : null;
+   }
 
 			// Create a new FeatureCollection for the points
 			const pointGeoJSON = {
@@ -665,7 +848,8 @@ sap.ui.define([
 						'icon-size': ['get', 'borderSize'],
 						'icon-allow-overlap': true,
 						'icon-rotation-alignment': 'map',
-						'icon-rotate': ['get', 'arrowRotation']  // Rotate based on calculated angle
+						'icon-rotate': ['get', 'arrowRotation'],  // Rotate based on calculated angle
+						'icon-offset': [-12, 4]
 					},
 					'paint': {
 						'icon-color': ['get', 'BorderColor']  // Match the arrow color with the line color
@@ -682,7 +866,8 @@ sap.ui.define([
 						'icon-size': ['get', 'size'],
 						'icon-allow-overlap': true,
 						'icon-rotation-alignment': 'map',
-						'icon-rotate': ['get', 'arrowRotation']  // Rotate based on calculated angle
+						'icon-rotate': ['get', 'arrowRotation'],  // Rotate based on calculated angle
+						'icon-offset': [-12, 4]
 					},
 					'paint': {
 						'icon-color': ['get', 'Color']  // Match the arrow color with the line color

package/src/sap/ui/vbm/vector/PayloadGenerator.js

@@ -12,7 +12,7 @@ sap.ui.define([
          *
          * @private
          * @author SAP SE
-         * @version 1.143.0
+         * @version 1.144.0
          * @alias sap.ui.vbm.vector.PayloadGenerator
          */
     var adapter = {};

package/src/sap/ui/vbm/vector/RectangularSelection.js

@@ -12,7 +12,7 @@ sap.ui.define([
          *
          * @private
          * @author SAP SE
-         * @version 1.143.0
+         * @version 1.144.0
          * @alias sap.ui.vbm.vector.RectangularSelection
          */
 

package/src/sap/ui/vbm/vector/SAPAutomationManager.js

@@ -113,7 +113,8 @@ sap.ui.define([
                 //Focus the map into the features
                 if (zoombounds) {
                     map.fitBounds(zoombounds, {
-                        padding: 150
+                        padding: 150,
+                         maxZoom: 13
                     });
                 }
                 return true;

package/src/sap/ui/vbm/vector/VectorUtils.js

@@ -471,7 +471,7 @@ VectorUtils.createRouteLabel = (label, labelcolor) => {
 
     VectorUtils.getArrowHead = (callback) => {
         const svgArrow = `
-        <svg fill="currentColor" width="60px" height="60px" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+        <svg fill="currentColor" width="80px" height="80px" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
             <g data-name="Layer 2">
                 <g data-name="arrow-right">
                     <rect width="24" height="24" transform="rotate(180 12 12)" opacity="0"/>