huweili-cesium 1.2.97 → 1.2.99

package/js/glbInfoBadge.js

@@ -7,9 +7,12 @@
 import * as Cesium from 'cesium'
 import { getDroneLabelBatchManager } from './cardPool'
 
-const STYLE_ID = 'glb-info-badge-style'
+const STYLE_ID = 'glb-info-badge-style-v2'
 const DEFAULT_LABEL_OFFSET = 1
-const DEFAULT_PIXEL_GAP = 2
+const DEFAULT_PIXEL_GAP = 0
+const DEFAULT_HEIGHT_SCALE = 0.72
+/** 包围球半径折算到车顶的系数（中心点已在模型中部，无需再加整颗半径） */
+const BOUNDING_SPHERE_TOP_FACTOR = 0.22
 
 const scratchBoundingSphere = new Cesium.BoundingSphere()
 const scratchEnu = new Cesium.Matrix4()
@@ -35,16 +38,16 @@ const ensureGlbInfoBadgeStyle = () => {
       position: relative;
       display: inline-flex;
       align-items: center;
-      gap: 6px;
-      padding: 4px 12px 4px 10px;
+      gap: 4px;
+      padding: 2px 8px 2px 6px;
       border-radius: 999px;
       background: linear-gradient(135deg, rgba(8, 20, 40, 0.92) 0%, rgba(12, 32, 58, 0.88) 100%);
       border: 1px solid rgba(0, 229, 255, 0.45);
       box-shadow:
-        inset 0 0 12px rgba(0, 229, 255, 0.08),
-        0 0 16px rgba(0, 229, 255, 0.15);
+        inset 0 0 8px rgba(0, 229, 255, 0.08),
+        0 0 10px rgba(0, 229, 255, 0.15);
       overflow: hidden;
-      backdrop-filter: blur(6px);
+      backdrop-filter: blur(4px);
       white-space: nowrap;
     }
     .glb-info-badge-scan {
@@ -58,27 +61,28 @@ const ensureGlbInfoBadgeStyle = () => {
       pointer-events: none;
     }
     .glb-info-badge-dot {
-      width: 8px;
-      height: 8px;
+      width: 5px;
+      height: 5px;
       border-radius: 50%;
       flex-shrink: 0;
-      box-shadow: 0 0 8px currentColor;
+      box-shadow: 0 0 5px currentColor;
     }
     .glb-info-badge-text {
-      font-size: 12px;
+      font-size: 10px;
       font-weight: 600;
-      letter-spacing: 0.08em;
+      line-height: 1;
+      letter-spacing: 0.06em;
       color: #e8f7ff;
-      text-shadow: 0 0 6px rgba(0, 229, 255, 0.5);
+      text-shadow: 0 0 4px rgba(0, 229, 255, 0.5);
     }
     .glb-info-badge-pointer {
       width: 0;
       height: 0;
-      margin: 2px auto 0;
-      border-left: 5px solid transparent;
-      border-right: 5px solid transparent;
-      border-top: 6px solid rgba(0, 229, 255, 0.55);
-      filter: drop-shadow(0 0 4px rgba(0, 229, 255, 0.4));
+      margin: 1px auto 0;
+      border-left: 4px solid transparent;
+      border-right: 4px solid transparent;
+      border-top: 5px solid rgba(0, 229, 255, 0.55);
+      filter: drop-shadow(0 0 3px rgba(0, 229, 255, 0.4));
     }
     .glb-info-badge.is-online .glb-info-badge-inner {
       border-color: rgba(0, 255, 170, 0.55);
@@ -174,8 +178,11 @@ const resolveModelTopWorldPosition = (map, entity, basePos, fallbackOffset) => {
   if (entity && dataSourceDisplay?.getBoundingSphere) {
     const ok = dataSourceDisplay.getBoundingSphere(entity, true, scratchBoundingSphere)
     if (ok && scratchBoundingSphere.radius > 0) {
-      Cesium.Cartesian3.multiplyByScalar(scratchUp, scratchBoundingSphere.radius, scratchOffset)
-      return Cesium.Cartesian3.add(scratchBoundingSphere.center, scratchOffset, scratchTop)
+      Cesium.Cartesian3.subtract(scratchBoundingSphere.center, basePos, scratchOffset)
+      const centerAlongUp = Math.max(0, Cesium.Cartesian3.dot(scratchOffset, scratchUp))
+      const topAlongUp = centerAlongUp + scratchBoundingSphere.radius * BOUNDING_SPHERE_TOP_FACTOR
+      Cesium.Cartesian3.multiplyByScalar(scratchUp, topAlongUp, scratchOffset)
+      return Cesium.Cartesian3.add(basePos, scratchOffset, scratchTop)
     }
   }
 
@@ -190,28 +197,37 @@ const resolveModelTopWorldPosition = (map, entity, basePos, fallbackOffset) => {
  * @param {Cesium.Cartesian3} topWorldPos
  * @param {number} minPixelSize
  * @param {number} pixelGap
+ * @param {number} heightScale
  * @returns {{ x: number, y: number }|null}
  */
-const resolveBadgeScreenPosition = (scene, basePos, topWorldPos, minPixelSize, pixelGap) => {
+const resolveBadgeScreenPosition = (scene, basePos, topWorldPos, minPixelSize, pixelGap, heightScale) => {
   const anchorWin = scene.cartesianToCanvasCoordinates(basePos)
   if (!anchorWin || Number.isNaN(anchorWin.x) || Number.isNaN(anchorWin.y)) {
     return null
   }
 
-  const topWin = scene.cartesianToCanvasCoordinates(topWorldPos)
+  const topWin = topWorldPos ? scene.cartesianToCanvasCoordinates(topWorldPos) : null
   let offsetY = 0
 
   if (topWin && !Number.isNaN(topWin.y)) {
-    offsetY = anchorWin.y - topWin.y
+    offsetY = (anchorWin.y - topWin.y) * heightScale
+  }
+
+  // 包围球常大于实际 mesh，对过大偏移做软压缩
+  if (offsetY > 0 && minPixelSize > 0 && offsetY > minPixelSize * 0.5) {
+    const base = minPixelSize * 0.3
+    offsetY = base + (offsetY - base) * 0.35
   }
 
-  // minimumPixelSize 会让远景模型在屏幕上被抬高，仅用世界高度会产生“飘”感
   if (minPixelSize > 0) {
-    offsetY = Math.max(offsetY, minPixelSize * 0.55)
+    const visualRoofOffset = minPixelSize * 0.28
+    if (offsetY <= 0 || offsetY < visualRoofOffset) {
+      offsetY = visualRoofOffset
+    }
   }
 
   if (offsetY <= 0) {
-    offsetY = minPixelSize > 0 ? minPixelSize * 0.55 : 28
+    offsetY = minPixelSize > 0 ? minPixelSize * 0.28 : 16
   }
 
   return {
@@ -230,7 +246,8 @@ const resolveBadgeScreenPosition = (scene, basePos, topWorldPos, minPixelSize, p
  * @param {Function} [options.getVisible] 是否显示信息牌
  * @param {boolean} [options.isOffline=false] true=离线，false=在线
  * @param {number} [options.labelOffset=1] 模型未加载完成时的兜底高度（米）
- * @param {number} [options.pixelGap=2] 信息牌与车顶之间的像素间距
+ * @param {number} [options.pixelGap=0] 信息牌与车顶之间的像素间距
+ * @param {number} [options.heightScale=0.72] 屏幕偏移收紧系数（越小越贴近车顶）
  */
 export function createGlbInfoBadge(options = {}) {
   const {
@@ -242,6 +259,7 @@ export function createGlbInfoBadge(options = {}) {
     isOffline = false,
     labelOffset = DEFAULT_LABEL_OFFSET,
     pixelGap = DEFAULT_PIXEL_GAP,
+    heightScale = DEFAULT_HEIGHT_SCALE,
   } = options
 
   if (!map || typeof getPosition !== 'function') {
@@ -302,7 +320,8 @@ export function createGlbInfoBadge(options = {}) {
         basePos,
         topWorldPos,
         minPixelSize,
-        pixelGap
+        pixelGap,
+        heightScale
       )
 
       if (!screenPos) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "huweili-cesium",
-  "version": "1.2.97",
+  "version": "1.2.99",
   "description": "基于 Cesium 的地图工具库（无人机态势、轨迹、围栏、工具栏等）",
   "type": "module",
   "main": "./index.js",