+
+
+
{
const coords = this.cartesianToLatLng(pos);
const isPlatform = (pr.mode === 'after' && i === 0) || (pr.mode === 'before' && i === pointsToEmit.length - 1);
- const isHold = holdCenter && Cesium.Cartesian3.equalsEpsilon(pos, holdCenter, 0.1);
+ const isHold = !!holdCenter && (pos === holdCenter || Cesium.Cartesian3.distance(pos, holdCenter) < holdDistEpsM);
latLngPoints.push({
id: i + 1,
name: isPlatform ? pr.platformName : (isHold ? 'HOLD' : `WP${i + 1}`),
@@ -1749,13 +1837,15 @@ export default {
const p = holdParams;
const isCircle = p.radius != null || p.type === 'hold_circle';
const isRaceTrack = !isCircle && p.edgeLength != null;
- const radius = isCircle ? (this.getWaypointRadius({ speed: p.speed ?? 800, turnAngle: p.turnAngle ?? 45 }) || 500) : 500;
+ const previewSpeedKmh = p.holdSpeed != null && Number(p.holdSpeed) > 0 ? Number(p.holdSpeed) : (p.speed ?? 800);
+ const previewTurnDeg = p.turnAngle ?? 45;
+ const radius = isCircle ? (this.getWaypointRadius({ speed: previewSpeedKmh, turnAngle: previewTurnDeg }) || 500) : 500;
const semiMajor = !isCircle ? (p.semiMajor ?? p.semiMajorAxis ?? 500) : radius;
const semiMinor = !isCircle ? (p.semiMinor ?? p.semiMinorAxis ?? 300) : radius;
const headingRad = !isCircle ? ((p.headingDeg ?? 0) * Math.PI) / 180 : 0;
if (isRaceTrack) {
const edgeLengthM = Math.max(1000, p.edgeLength ?? this.DEFAULT_RACE_TRACK_EDGE_LENGTH_M);
- const arcRadiusM = this.getWaypointRadius({ speed: p.speed ?? 800, turnAngle: p.turnAngle ?? 45 }) || 500;
+ const arcRadiusM = this.getWaypointRadius({ speed: previewSpeedKmh, turnAngle: previewTurnDeg }) || 500;
const clockwise = p.clockwise !== false;
const prev = this.drawingPoints && this.drawingPoints.length >= 1 ? this.drawingPoints[this.drawingPoints.length - 1] : null;
const directionRad = this.getRaceTrackDirectionRad(center, prev, null, p.headingDeg ?? 0);
@@ -2068,7 +2158,7 @@ export default {
return 'data:image/svg+xml,' + encodeURIComponent(svg);
},
- /** 从手柄实体 id 解析出平台图标 entityData 与类型（rotate / scale-0~3） */
+ /** 从手柄实体 id 解析出平台图标 entityData 与类型（rotate / 角点 scale-0~3 / 边中点 scaleEdge-0~3） */
getPlatformIconDataFromHandleId(handleEntityId) {
if (!handleEntityId || typeof handleEntityId !== 'string') return null;
const findEd = (baseId) => {
@@ -2082,6 +2172,16 @@ export default {
const ed = findEd(baseId);
return ed ? { entityData: ed, type: 'rotate' } : null;
}
+ const edgeKey = '-scaleEdge-';
+ const edgeIdx = handleEntityId.lastIndexOf(edgeKey);
+ if (edgeIdx !== -1) {
+ const baseId = handleEntityId.substring(0, edgeIdx);
+ const edgeIndex = parseInt(handleEntityId.substring(edgeIdx + edgeKey.length), 10);
+ if (!isNaN(edgeIndex) && edgeIndex >= 0 && edgeIndex <= 3) {
+ const ed = findEd(baseId);
+ return ed ? { entityData: ed, type: 'scale', edgeIndex } : null;
+ }
+ }
const scaleIdx = handleEntityId.lastIndexOf('-scale-');
if (scaleIdx !== -1) {
const baseId = handleEntityId.substring(0, scaleIdx);
@@ -2094,6 +2194,47 @@ export default {
return null;
},
+ /** 未设置时从 iconScale 补齐 X/Y，便于与旧数据兼容 */
+ ensurePlatformIconScaleAxes(entityData) {
+ if (!entityData) return;
+ const base = Math.max(0.2, Math.min(3, entityData.iconScale != null ? Number(entityData.iconScale) : 1));
+ let sx = entityData.iconScaleX;
+ let sy = entityData.iconScaleY;
+ if (sx == null || !Number.isFinite(Number(sx))) sx = base;
+ if (sy == null || !Number.isFinite(Number(sy))) sy = base;
+ entityData.iconScaleX = Math.max(0.2, Math.min(3, Number(sx)));
+ entityData.iconScaleY = Math.max(0.2, Math.min(3, Number(sy)));
+ },
+
+ /** 角点悬停：按屏幕相对中心方向选择对角线双向箭头光标 */
+ _getPlatformCornerResizeCursor(entityData, cornerIndex) {
+ if (!this.viewer || !entityData || cornerIndex == null || cornerIndex < 0 || cornerIndex > 3) return 'nwse-resize';
+ const lng = entityData.lng;
+ const lat = entityData.lat;
+ const dpp = this.getDegreesPerPixelAt(lng, lat);
+ const vis = this.getPlatformTransformBoxVisualScale(dpp);
+ this.ensurePlatformIconScaleAxes(entityData);
+ const baseHalfLng = this.DESIRED_BOX_HALF_PX * vis * dpp.degPerPxLng;
+ const baseHalfLat = this.DESIRED_BOX_HALF_PX * vis * dpp.degPerPxLat;
+ const halfLng = Math.max(entityData.iconScaleX * baseHalfLng, baseHalfLng * 0.5);
+ const halfLat = Math.max(entityData.iconScaleY * baseHalfLat, baseHalfLat * 0.5);
+ const offsets = [
+ [halfLng, halfLat],
+ [-halfLng, halfLat],
+ [-halfLng, -halfLat],
+ [halfLng, -halfLat]
+ ];
+ const off = offsets[cornerIndex];
+ const center = Cesium.Cartesian3.fromDegrees(lng, lat);
+ const corner = Cesium.Cartesian3.fromDegrees(lng + off[0], lat + off[1]);
+ const sc = Cesium.SceneTransforms.worldToWindowCoordinates(this.viewer.scene, center);
+ const sh = Cesium.SceneTransforms.worldToWindowCoordinates(this.viewer.scene, corner);
+ if (!sc || !sh) return 'nwse-resize';
+ const dx = sh.x - sc.x;
+ const dy = sh.y - sc.y;
+ return dx * dy <= 0 ? 'nesw-resize' : 'nwse-resize';
+ },
+
/** 在当前视野下，图标位置处 1 像素对应的经纬度（用于伸缩框固定屏幕尺寸） */
getDegreesPerPixelAt(lng, lat) {
if (!this.viewer || this.viewer.scene.mode !== Cesium.SceneMode.SCENE2D) {
@@ -2142,155 +2283,313 @@ export default {
return 1 - u * (1 - minS);
},
- /** 更新平台图标 billboard 的宽高（根据 iconScale） */
+ /** 更新平台图标 billboard 的宽高（iconScaleX / iconScaleY，未设置时沿用 iconScale） */
updatePlatformIconBillboardSize(entityData) {
if (!entityData || !entityData.entity || !entityData.entity.billboard) return;
- const scale = Math.max(0.2, Math.min(3, entityData.iconScale || 1));
- entityData.iconScale = scale;
- const size = this.PLATFORM_ICON_BASE_SIZE * scale;
- entityData.entity.billboard.width = new Cesium.ConstantProperty(size);
- entityData.entity.billboard.height = new Cesium.ConstantProperty(size);
+ this.ensurePlatformIconScaleAxes(entityData);
+ const sx = entityData.iconScaleX;
+ const sy = entityData.iconScaleY;
+ entityData.entity.billboard.width = new Cesium.ConstantProperty(this.PLATFORM_ICON_BASE_SIZE * sx);
+ entityData.entity.billboard.height = new Cesium.ConstantProperty(this.PLATFORM_ICON_BASE_SIZE * sy);
+ entityData.iconScale = (sx + sy) / 2;
},
- /** 显示伸缩框：旋转手柄 + 四角缩放手柄 + 矩形边线（按屏幕像素固定尺寸，任意缩放都易点） */
+ /** 显示伸缩框：DOM 叠加层（SVG 边框 + 圆角手柄），避免 Cesium polyline 模糊 */
showTransformHandles(entityData) {
if (!this.viewer || !entityData || entityData.type !== 'platformIcon') return;
this.removeTransformHandles(entityData);
- const id = entityData.id;
+ entityData.transformHandles = { mode: 'dom' };
+ this._bindPlatformTransformDomPostRender();
+ this.syncPlatformTransformDomOverlay(entityData);
+ this.viewer.scene.requestRender();
+ },
+
+ /** 移除伸缩框（DOM 层 + 监听） */
+ removeTransformHandles(entityData) {
+ this._unbindPlatformTransformDomPostRender();
+ this._detachPlatformTransformDomDocumentListeners();
+ if (entityData && entityData.transformHandles) {
+ entityData.transformHandles = null;
+ }
+ this.platformTransformDom = {
+ visible: false,
+ svgW: 1,
+ svgH: 1,
+ framePoints: '',
+ rotate: { x: 0, y: 0, visible: false },
+ rotateHalfPx: 18,
+ handleDiameterPx: 11,
+ edgeHandleDiameterPx: 10,
+ cornerHandles: [],
+ edgeHandles: []
+ };
+ },
+
+ _bindPlatformTransformDomPostRender() {
+ if (this._platformTransformDomPostRenderBound || !this.viewer || !this.viewer.scene) return;
+ this._platformTransformDomPostRenderBound = true;
+ this._platformTransformDomPostRenderListener = () => {
+ if (!this.selectedPlatformIcon || !this.selectedPlatformIcon.transformHandles || this.selectedPlatformIcon.transformHandles.mode !== 'dom') return;
+ this.syncPlatformTransformDomOverlay(this.selectedPlatformIcon);
+ };
+ this.viewer.scene.postRender.addEventListener(this._platformTransformDomPostRenderListener);
+ },
+
+ _unbindPlatformTransformDomPostRender() {
+ if (!this._platformTransformDomPostRenderBound) {
+ return;
+ }
+ this._platformTransformDomPostRenderBound = false;
+ if (this.viewer && this.viewer.scene && this._platformTransformDomPostRenderListener) {
+ try {
+ this.viewer.scene.postRender.removeEventListener(this._platformTransformDomPostRenderListener);
+ } catch (e) {}
+ }
+ this._platformTransformDomPostRenderListener = null;
+ },
+
+ /** 将经纬度框投影到画布像素，刷新 DOM 伸缩框 */
+ syncPlatformTransformDomOverlay(entityData) {
+ if (!this.viewer || !entityData || entityData.transformHandles == null || entityData.transformHandles.mode !== 'dom') return;
+ const scene = this.viewer.scene;
+ const canvas = scene.canvas;
+ const w = canvas.clientWidth;
+ const h = canvas.clientHeight;
const lng = entityData.lng;
const lat = entityData.lat;
const dpp = this.getDegreesPerPixelAt(lng, lat);
const vis = this.getPlatformTransformBoxVisualScale(dpp);
- const baseHalfDeg = this.DESIRED_BOX_HALF_PX * vis * Math.min(dpp.degPerPxLng, dpp.degPerPxLat);
- const half = Math.max((entityData.iconScale || 1) * baseHalfDeg, baseHalfDeg * 0.5);
+ this.ensurePlatformIconScaleAxes(entityData);
+ const baseHalfLng = this.DESIRED_BOX_HALF_PX * vis * dpp.degPerPxLng;
+ const baseHalfLat = this.DESIRED_BOX_HALF_PX * vis * dpp.degPerPxLat;
+ const halfLng = Math.max(entityData.iconScaleX * baseHalfLng, baseHalfLng * 0.5);
+ const halfLat = Math.max(entityData.iconScaleY * baseHalfLat, baseHalfLat * 0.5);
const rotOffsetLat = this.DESIRED_ROTATE_OFFSET_PX * vis * dpp.degPerPxLat;
const rotOffMin = this.PLATFORM_ROTATE_HANDLE_OFFSET_DEG * vis;
const rotOffset = Math.max(rotOffsetLat, rotOffMin);
- const rotImg = Math.max(20, Math.round(36 * vis));
- const ptSize = Math.max(5, this.TRANSFORM_HANDLE_POINT_SIZE * vis);
- const ptOutline = Math.max(1, Math.round(this.TRANSFORM_HANDLE_POINT_OUTLINE_WIDTH * vis));
- const fw = Math.max(1, this.TRANSFORM_HANDLE_FRAME_WIDTH * vis);
- const glowW = Math.max(1, fw + 3 * vis);
- const rotationHandle = this.viewer.entities.add({
- id: id + '-rotate-handle',
- position: Cesium.Cartesian3.fromDegrees(lng, lat + rotOffset),
- billboard: {
- image: this.getRotationHandleIconDataUrl(),
- width: rotImg,
- height: rotImg,
- verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
- horizontalOrigin: Cesium.HorizontalOrigin.CENTER,
- disableDepthTestDistance: Number.POSITIVE_INFINITY
- }
- });
- const corners = [
- Cesium.Cartesian3.fromDegrees(lng + half, lat + half),
- Cesium.Cartesian3.fromDegrees(lng - half, lat + half),
- Cesium.Cartesian3.fromDegrees(lng - half, lat - half),
- Cesium.Cartesian3.fromDegrees(lng + half, lat - half)
+ const cornersWorld = [
+ Cesium.Cartesian3.fromDegrees(lng + halfLng, lat + halfLat),
+ Cesium.Cartesian3.fromDegrees(lng - halfLng, lat + halfLat),
+ Cesium.Cartesian3.fromDegrees(lng - halfLng, lat - halfLat),
+ Cesium.Cartesian3.fromDegrees(lng + halfLng, lat - halfLat)
];
- const scaleHandles = corners.map((pos, i) =>
- this.viewer.entities.add({
- id: id + '-scale-' + i,
- position: pos,
- point: {
- pixelSize: ptSize,
- color: Cesium.Color.WHITE.withAlpha(0.98),
- outlineColor: Cesium.Color.fromCssColorString(this.TRANSFORM_HANDLE_PRIMARY_COLOR),
- outlineWidth: ptOutline,
- disableDepthTestDistance: Number.POSITIVE_INFINITY
- }
- })
- );
- const linePositions = [corners[0], corners[1], corners[2], corners[3], corners[0]];
- // 发光柔边（在主边框后面绘制，视觉更柔和）
- const frameGlow = this.viewer.entities.add({
- id: id + '-scale-frame-glow',
- polyline: {
- positions: linePositions,
- width: glowW,
- material: Cesium.Color.fromCssColorString(this.TRANSFORM_HANDLE_PRIMARY_COLOR).withAlpha(this.TRANSFORM_HANDLE_GLOW_ALPHA),
- arcType: Cesium.ArcType.NONE,
- disableDepthTestDistance: Number.POSITIVE_INFINITY
- }
- });
- const frameLine = this.viewer.entities.add({
- id: id + '-scale-frame',
- polyline: {
- positions: linePositions,
- width: fw,
- material: Cesium.Color.fromCssColorString(this.TRANSFORM_HANDLE_PRIMARY_COLOR).withAlpha(0.98),
- arcType: Cesium.ArcType.NONE,
- disableDepthTestDistance: Number.POSITIVE_INFINITY
+ const edgeWorld = [
+ Cesium.Cartesian3.fromDegrees(lng, lat + halfLat),
+ Cesium.Cartesian3.fromDegrees(lng + halfLng, lat),
+ Cesium.Cartesian3.fromDegrees(lng, lat - halfLat),
+ Cesium.Cartesian3.fromDegrees(lng - halfLng, lat)
+ ];
+ const rotWorld = Cesium.Cartesian3.fromDegrees(lng, lat + rotOffset);
+ const toScr = (cart) => {
+ try {
+ return Cesium.SceneTransforms.worldToWindowCoordinates(scene, cart);
+ } catch (e) {
+ return undefined;
}
- });
- entityData.transformHandles = {
- rotation: rotationHandle,
- scale: scaleHandles,
- frame: frameLine,
- frameGlow
+ };
+ const cornerScr = cornersWorld.map(toScr);
+ if (cornerScr.some((p) => !p || !Cesium.defined(p.x))) {
+ this.platformTransformDom.visible = false;
+ return;
+ }
+ const framePoints = cornerScr.map((p) => `${p.x},${p.y}`).join(' ');
+ const handleDiameterPx = Math.max(10, Math.round(this.TRANSFORM_HANDLE_POINT_SIZE * vis));
+ const edgeHandleDiameterPx = Math.max(9, Math.round((this.TRANSFORM_HANDLE_POINT_SIZE - 1) * vis));
+ const rotateHalfPx = Math.max(10, Math.round(18 * vis));
+ const cornerHandles = cornerScr.map((p, i) => ({
+ key: 'c' + i,
+ x: p.x,
+ y: p.y,
+ cornerIndex: i,
+ cursor: this._getPlatformCornerResizeCursor(entityData, i)
+ }));
+ const edgeHandles = [];
+ for (let i = 0; i < 4; i++) {
+ const p = toScr(edgeWorld[i]);
+ if (!p || !Cesium.defined(p.x)) continue;
+ edgeHandles.push({
+ key: 'e' + i,
+ x: p.x,
+ y: p.y,
+ edgeIndex: i,
+ cursor: (i === 0 || i === 2) ? 'ns-resize' : 'ew-resize'
+ });
+ }
+ const rscr = toScr(rotWorld);
+ const rotate = rscr && Cesium.defined(rscr.x)
+ ? { x: rscr.x, y: rscr.y, visible: true }
+ : { x: 0, y: 0, visible: false };
+ this.platformTransformDom = {
+ visible: true,
+ svgW: w,
+ svgH: h,
+ framePoints,
+ rotate,
+ rotateHalfPx,
+ handleDiameterPx,
+ edgeHandleDiameterPx,
+ cornerHandles,
+ edgeHandles
};
},
- /** 移除伸缩框手柄与边线 */
- removeTransformHandles(entityData) {
- if (!entityData || !entityData.transformHandles) return;
- const h = entityData.transformHandles;
- if (h.rotation) this.viewer.entities.remove(h.rotation);
- if (h.scale) h.scale.forEach(e => this.viewer.entities.remove(e));
- if (h.frameGlow) this.viewer.entities.remove(h.frameGlow);
- if (h.frame) this.viewer.entities.remove(h.frame);
- entityData.transformHandles = null;
+ _clientToCanvasCartesian2(clientX, clientY) {
+ if (!this.viewer || !this.viewer.scene || !this.viewer.scene.canvas) return null;
+ const canvas = this.viewer.scene.canvas;
+ const rect = canvas.getBoundingClientRect();
+ const sx = (clientX - rect.left) * (canvas.width / Math.max(rect.width, 1));
+ const sy = (clientY - rect.top) * (canvas.height / Math.max(rect.height, 1));
+ return new Cesium.Cartesian2(sx, sy);
},
- /** 根据图标当前位置、iconScale 与当前视野更新伸缩框（保持固定像素尺寸） */
- updateTransformHandlePositions(entityData) {
- if (!entityData || !entityData.transformHandles) return;
- const lng = entityData.lng;
- const lat = entityData.lat;
+ applyDraggingRotateAtCartesian2(screenPos) {
+ if (!screenPos || !this.draggingRotateHandle) return;
+ const ed = this.draggingRotateHandle;
+ if (!ed.entity || !ed.entity.position) return;
+ const now = Cesium.JulianDate.now();
+ const position = ed.entity.position.getValue(now);
+ if (!position) return;
+ const screenPosIcon = Cesium.SceneTransforms.worldToWindowCoordinates(this.viewer.scene, position);
+ if (!screenPosIcon) return;
+ const dx = screenPos.x - screenPosIcon.x;
+ const dy = screenPos.y - screenPosIcon.y;
+ const screenAngle = Math.atan2(dy, dx);
+ ed.entity.billboard.rotation = -screenAngle;
+ let headingDeg = (screenAngle + Math.PI / 2) * (180 / Math.PI);
+ if (headingDeg < 0) headingDeg += 360;
+ if (headingDeg >= 360) headingDeg -= 360;
+ ed.heading = Math.round(headingDeg);
+ this.viewer.scene.requestRender();
+ },
+
+ applyDraggingScaleAtCartesian2(screenPos) {
+ if (!screenPos || !this.draggingScaleHandle) return;
+ const { entityData: ed, cornerIndex, edgeIndex } = this.draggingScaleHandle;
+ const cartesian = this.viewer.camera.pickEllipsoid(screenPos, this.viewer.scene.globe.ellipsoid);
+ if (!cartesian) return;
+ const { lat: newLat, lng: newLng } = this.cartesianToLatLng(cartesian);
+ const lng = ed.lng;
+ const lat = ed.lat;
const dpp = this.getDegreesPerPixelAt(lng, lat);
const vis = this.getPlatformTransformBoxVisualScale(dpp);
- const baseHalfDeg = this.DESIRED_BOX_HALF_PX * vis * Math.min(dpp.degPerPxLng, dpp.degPerPxLat);
- const half = Math.max((entityData.iconScale || 1) * baseHalfDeg, baseHalfDeg * 0.5);
- const rotOffsetLat = this.DESIRED_ROTATE_OFFSET_PX * vis * dpp.degPerPxLat;
- const rotOffMin = this.PLATFORM_ROTATE_HANDLE_OFFSET_DEG * vis;
- const rotOffset = Math.max(rotOffsetLat, rotOffMin);
- entityData.transformHandles.rotation.position = Cesium.Cartesian3.fromDegrees(lng, lat + rotOffset);
- const rot = entityData.transformHandles.rotation;
- if (rot && rot.billboard) {
- const rotImg = Math.max(20, Math.round(36 * vis));
- rot.billboard.width = rotImg;
- rot.billboard.height = rotImg;
- }
- const ptSize = Math.max(5, this.TRANSFORM_HANDLE_POINT_SIZE * vis);
- const ptOutline = Math.max(1, Math.round(this.TRANSFORM_HANDLE_POINT_OUTLINE_WIDTH * vis));
- entityData.transformHandles.scale.forEach((ent) => {
- if (ent && ent.point) {
- ent.point.pixelSize = ptSize;
- ent.point.outlineWidth = ptOutline;
+ const baseHalfLng = this.DESIRED_BOX_HALF_PX * vis * dpp.degPerPxLng;
+ const baseHalfLat = this.DESIRED_BOX_HALF_PX * vis * dpp.degPerPxLat;
+ this.ensurePlatformIconScaleAxes(ed);
+ if (edgeIndex != null && edgeIndex >= 0 && edgeIndex <= 3) {
+ if (edgeIndex === 0) ed.iconScaleY = Math.max(0.2, Math.min(3, (newLat - lat) / baseHalfLat));
+ else if (edgeIndex === 2) ed.iconScaleY = Math.max(0.2, Math.min(3, (lat - newLat) / baseHalfLat));
+ else if (edgeIndex === 1) ed.iconScaleX = Math.max(0.2, Math.min(3, (newLng - lng) / baseHalfLng));
+ else ed.iconScaleX = Math.max(0.2, Math.min(3, (lng - newLng) / baseHalfLng));
+ } else if (cornerIndex != null && cornerIndex >= 0 && cornerIndex <= 3) {
+ let newHalfLng;
+ let newHalfLat;
+ if (cornerIndex === 0) {
+ newHalfLng = newLng - lng;
+ newHalfLat = newLat - lat;
+ } else if (cornerIndex === 1) {
+ newHalfLng = lng - newLng;
+ newHalfLat = newLat - lat;
+ } else if (cornerIndex === 2) {
+ newHalfLng = lng - newLng;
+ newHalfLat = lat - newLat;
+ } else {
+ newHalfLng = newLng - lng;
+ newHalfLat = lat - newLat;
}
- });
- const fw = Math.max(1, this.TRANSFORM_HANDLE_FRAME_WIDTH * vis);
- const glowW = Math.max(1, fw + 3 * vis);
- const fr = entityData.transformHandles.frame;
- const fg = entityData.transformHandles.frameGlow;
- if (fr && fr.polyline) fr.polyline.width = fw;
- if (fg && fg.polyline) fg.polyline.width = glowW;
- const corners = [
- Cesium.Cartesian3.fromDegrees(lng + half, lat + half),
- Cesium.Cartesian3.fromDegrees(lng - half, lat + half),
- Cesium.Cartesian3.fromDegrees(lng - half, lat - half),
- Cesium.Cartesian3.fromDegrees(lng + half, lat - half)
- ];
- entityData.transformHandles.scale.forEach((ent, i) => { ent.position = corners[i]; });
- const linePositions = [corners[0], corners[1], corners[2], corners[3], corners[0]];
- if (entityData.transformHandles.frame) {
- entityData.transformHandles.frame.polyline.positions = new Cesium.ConstantProperty(linePositions);
+ const ratioX = newHalfLng / baseHalfLng;
+ const ratioY = newHalfLat / baseHalfLat;
+ const s = Math.max(0.2, Math.min(3, Math.min(ratioX, ratioY)));
+ ed.iconScaleX = s;
+ ed.iconScaleY = s;
}
- if (entityData.transformHandles.frameGlow) {
- entityData.transformHandles.frameGlow.polyline.positions = new Cesium.ConstantProperty(linePositions);
+ this.updatePlatformIconBillboardSize(ed);
+ this.updateTransformHandlePositions(ed);
+ },
+
+ finalizePlatformIconRotateDragEnd() {
+ if (!this.draggingRotateHandle) return;
+ const dr = this.draggingRotateHandle;
+ if (dr.isWhiteboard) {
+ this.$emit('whiteboard-platform-updated', dr);
+ } else {
+ this.$emit('platform-icon-updated', dr);
}
- this.viewer.scene.requestRender();
+ if (this.viewer && this.viewer.scene) {
+ this.viewer.scene.screenSpaceCameraController.enableInputs = this.platformIconDragCameraEnabled;
+ }
+ this.draggingRotateHandle = null;
+ },
+
+ finalizePlatformIconScaleDragEnd() {
+ if (!this.draggingScaleHandle) return;
+ const ed = this.draggingScaleHandle.entityData;
+ if (ed && ed.isWhiteboard) {
+ this.$emit('whiteboard-platform-updated', ed);
+ } else {
+ this.$emit('platform-icon-updated', ed);
+ }
+ if (this.viewer && this.viewer.scene) {
+ this.viewer.scene.screenSpaceCameraController.enableInputs = this.platformIconDragCameraEnabled;
+ }
+ this.draggingScaleHandle = null;
+ },
+
+ onPlatformTransformDomPointerDown(e, kind, index) {
+ if (!this.viewer || !this.selectedPlatformIcon) return;
+ const ed = this.selectedPlatformIcon;
+ if (e.button != null && e.button !== 0) return;
+ this.platformIconDragCameraEnabled = this.viewer.scene.screenSpaceCameraController.enableInputs;
+ this.viewer.scene.screenSpaceCameraController.enableInputs = false;
+ if (kind === 'rotate') {
+ this.draggingRotateHandle = ed;
+ } else if (kind === 'corner') {
+ this.draggingScaleHandle = { entityData: ed, cornerIndex: index, edgeIndex: undefined };
+ } else if (kind === 'edge') {
+ this.draggingScaleHandle = { entityData: ed, cornerIndex: undefined, edgeIndex: index };
+ }
+ this._attachPlatformTransformDomDocumentListeners();
+ },
+
+ _attachPlatformTransformDomDocumentListeners() {
+ if (this._platformTransformDomDocBound) return;
+ this._platformTransformDomDocBound = true;
+ this._domDocMove = (ev) => this._handlePlatformTransformDomPointerMove(ev);
+ this._domDocUp = (ev) => this._handlePlatformTransformDomPointerUp(ev);
+ document.addEventListener('pointermove', this._domDocMove, true);
+ document.addEventListener('pointerup', this._domDocUp, true);
+ document.addEventListener('pointercancel', this._domDocUp, true);
+ },
+
+ _detachPlatformTransformDomDocumentListeners() {
+ if (!this._platformTransformDomDocBound) return;
+ this._platformTransformDomDocBound = false;
+ if (this._domDocMove) document.removeEventListener('pointermove', this._domDocMove, true);
+ if (this._domDocUp) document.removeEventListener('pointerup', this._domDocUp, true);
+ if (this._domDocUp) document.removeEventListener('pointercancel', this._domDocUp, true);
+ this._domDocMove = null;
+ this._domDocUp = null;
+ },
+
+ _handlePlatformTransformDomPointerMove(ev) {
+ if (!this.draggingRotateHandle && !this.draggingScaleHandle) return;
+ const pos = this._clientToCanvasCartesian2(ev.clientX, ev.clientY);
+ if (!pos) return;
+ if (this.draggingRotateHandle) this.applyDraggingRotateAtCartesian2(pos);
+ if (this.draggingScaleHandle) this.applyDraggingScaleAtCartesian2(pos);
+ ev.preventDefault();
+ },
+
+ _handlePlatformTransformDomPointerUp(ev) {
+ this._detachPlatformTransformDomDocumentListeners();
+ if (this.draggingRotateHandle) this.finalizePlatformIconRotateDragEnd();
+ if (this.draggingScaleHandle) this.finalizePlatformIconScaleDragEnd();
+ },
+
+ /** 根据图标当前位置、iconScaleX/Y 与当前视野更新伸缩框（DOM） */
+ updateTransformHandlePositions(entityData) {
+ if (!entityData || !entityData.transformHandles || entityData.transformHandles.mode !== 'dom') return;
+ this.syncPlatformTransformDomOverlay(entityData);
+ if (this.viewer && this.viewer.scene) this.viewer.scene.requestRender();
},
/**
@@ -2402,7 +2701,12 @@ export default {
const rotation = Math.PI / 2 - (headingDeg * Math.PI / 180);
const scaleVal = item.iconScale ?? item.icon_scale ?? 1;
const iconScale = Math.max(0.2, Math.min(3, scaleVal));
- const size = this.PLATFORM_ICON_BASE_SIZE * iconScale;
+ const rawSx = item.iconScaleX ?? item.icon_scale_x;
+ const rawSy = item.iconScaleY ?? item.icon_scale_y;
+ const iconScaleX = rawSx != null ? Math.max(0.2, Math.min(3, Number(rawSx))) : iconScale;
+ const iconScaleY = rawSy != null ? Math.max(0.2, Math.min(3, Number(rawSy))) : iconScale;
+ const sizeW = this.PLATFORM_ICON_BASE_SIZE * iconScaleX;
+ const sizeH = this.PLATFORM_ICON_BASE_SIZE * iconScaleY;
const cartesian = Cesium.Cartesian3.fromDegrees(item.lng, item.lat);
const entity = this.viewer.entities.add({
id,
@@ -2410,8 +2714,8 @@ export default {
position: cartesian,
billboard: {
image: imageSrc,
- width: size,
- height: size,
+ width: sizeW,
+ height: sizeH,
verticalOrigin: Cesium.VerticalOrigin.CENTER,
horizontalOrigin: Cesium.HorizontalOrigin.CENTER,
rotation,
@@ -2431,7 +2735,9 @@ export default {
entity,
imageUrl: iconUrl,
label: platform.name || '平台',
- iconScale,
+ iconScale: (iconScaleX + iconScaleY) / 2,
+ iconScaleX,
+ iconScaleY,
transformHandles: null,
serverId: item.id,
roomId
@@ -2545,6 +2851,8 @@ export default {
lng: ed.lng,
heading: ed.heading != null ? ed.heading : 0,
iconScale: ed.iconScale != null ? ed.iconScale : 1,
+ iconScaleX: ed.iconScaleX != null ? ed.iconScaleX : (ed.iconScale != null ? ed.iconScale : 1),
+ iconScaleY: ed.iconScaleY != null ? ed.iconScaleY : (ed.iconScale != null ? ed.iconScale : 1),
detectionZones,
powerZones
})
@@ -3003,7 +3311,7 @@ export default {
const effectiveTurnAngle = this.getEffectiveTurnAngle(wp, i, waypoints.length);
const prevWpForHold = i > 0 ? waypoints[i - 1] : null;
const turnRadius = this.getHoldRadiusFromPrevSpeed(wp, prevWpForHold, effectiveTurnAngle) || 500;
- // 地图显示半径始终用速度+坡度公式计算，推演反算半径仅用于推演内部，不影响显示
+ // 显示半径：有 holdParams.holdSpeed 时与反算盘旋地速一致；否则用上一航点速度（与 getHoldRadiusFromPrevSpeed 回退一致）
const radius = turnRadius;
const turnRadiusForHold = turnRadius;
const defaultSemiMajor = params && (params.semiMajor != null || params.semiMajorAxis != null) ? (params.semiMajor ?? params.semiMajorAxis) : 500;
@@ -3333,13 +3641,24 @@ export default {
const g = 9.8;
return (v_mps * v_mps) / (g * Math.tan(radians));
},
- /** 转弯/盘旋半径使用上一航点速度计算，因飞机以进入转弯前的速度转弯 */
+ /**
+ * 盘旋轨迹半径 R=v²/(g·tanθ)：优先用 holdParams.holdSpeed（与停留时间反算盘旋地速一致），否则用上一航点速度（进近段无反算速度时的回退）。
+ */
getHoldRadiusFromPrevSpeed(holdWp, prevWp, holdTurnAngle) {
- const prevSpeed = (prevWp && prevWp.segmentMode === 'fixed_speed' && (prevWp.segmentTargetSpeed != null && prevWp.segmentTargetSpeed !== ''))
- ? Number(prevWp.segmentTargetSpeed) : (prevWp?.speed || 800);
+ let speedKmh = null;
+ if (holdWp) {
+ const hp = this.parseHoldParams(holdWp);
+ if (hp && hp.holdSpeed != null && Number.isFinite(Number(hp.holdSpeed)) && Number(hp.holdSpeed) > 0) {
+ speedKmh = Number(hp.holdSpeed);
+ }
+ }
+ if (speedKmh == null) {
+ speedKmh = (prevWp && prevWp.segmentMode === 'fixed_speed' && (prevWp.segmentTargetSpeed != null && prevWp.segmentTargetSpeed !== ''))
+ ? Number(prevWp.segmentTargetSpeed) : (prevWp?.speed || 800);
+ }
const bankAngle = holdTurnAngle ?? holdWp?.turnAngle ?? 45;
if (bankAngle <= 0) return 0;
- const v_mps = prevSpeed / 3.6;
+ const v_mps = speedKmh / 3.6;
const radians = bankAngle * (Math.PI / 180);
const g = 9.8;
return (v_mps * v_mps) / (g * Math.tan(radians));
@@ -3404,7 +3723,9 @@ export default {
semiMinor: p.semiMinor ?? p.semiMinorAxis,
headingDeg: p.headingDeg ?? 0,
clockwise: p.clockwise !== false,
- edgeLength: p.edgeLength != null ? Number(p.edgeLength) : this.DEFAULT_RACE_TRACK_EDGE_LENGTH_M
+ edgeLength: p.edgeLength != null ? Number(p.edgeLength) : this.DEFAULT_RACE_TRACK_EDGE_LENGTH_M,
+ holdDurationMin: p.holdDurationMin != null ? Number(p.holdDurationMin) : null,
+ holdSpeed: p.holdSpeed != null ? Number(p.holdSpeed) : null
};
} catch (e) {
return null;
@@ -5498,6 +5819,8 @@ export default {
label: t.label,
heading: t.heading != null ? t.heading : 0,
iconScale: t.iconScale != null ? t.iconScale : 1.5,
+ iconScaleX: t.iconScaleX != null ? t.iconScaleX : (t.iconScale != null ? t.iconScale : 1.5),
+ iconScaleY: t.iconScaleY != null ? t.iconScaleY : (t.iconScale != null ? t.iconScale : 1.5),
color:
t.color != null && String(t.color).trim() !== ''
? t.color
@@ -5960,15 +6283,18 @@ export default {
}
if (hitInSelection) {
const now = Cesium.JulianDate.now()
- let anchorCartesian = null
- if (hitInSelection.entity && hitInSelection.entity.position) {
+ let anchorCartesian = this.pickMapPlaceCartesian(click.position)
+ if (!anchorCartesian && hitInSelection.entity && hitInSelection.entity.position) {
try {
anchorCartesian = hitInSelection.entity.position.getValue(now)
} catch (e) {}
}
+ let pos = { x: click.position.x, y: click.position.y }
+ const sp0 = this.contextMenuScreenPositionFromCartesian(anchorCartesian)
+ if (sp0) pos = sp0
this.contextMenu = {
visible: true,
- position: { x: click.position.x, y: click.position.y },
+ position: pos,
entityData: { type: 'platformBoxSelection', count: multi.length },
anchorCartesian,
pickList: null,
@@ -6232,9 +6558,12 @@ export default {
if (pickList.length > 0) {
const { entityData, pickedEntity } = pickList[0];
const anchorCartesian = this.getContextMenuAnchorCartesian(entityData, pickedEntity, click.position);
+ let pos = { x: click.position.x, y: click.position.y };
+ const sp0 = this.contextMenuScreenPositionFromCartesian(anchorCartesian);
+ if (sp0) pos = sp0;
this.contextMenu = {
visible: true,
- position: { x: click.position.x, y: click.position.y },
+ position: pos,
entityData,
anchorCartesian,
pickList,
@@ -6246,7 +6575,7 @@ export default {
}
}, Cesium.ScreenSpaceEventType.RIGHT_CLICK)
- // 监听场景渲染，使右键菜单随地图/图形移动（每帧更新，小范围移动也能跟随）
+ // 锚点为「右键处地表/拾取点」，每帧投影到屏幕，随地图平移旋转；打开时用同一锚点投影，避免跳到图形中心
const that = this;
const updateContextMenuPosition = () => {
if (!that.contextMenu.visible || !that.contextMenu.anchorCartesian || !that.viewer || !that.viewer.scene) return;
@@ -6495,7 +6824,7 @@ export default {
this.platformMultiSelected = []
},
- /** 平台图标图形化操作：伸缩框（旋转手柄 + 四角缩放）、拖拽移动、单击选中 */
+ /** 平台图标图形化操作：伸缩框（旋转 + 四角等比缩放 + 四边独立缩放）、拖拽移动、单击选中 */
initPlatformIconInteraction() {
const canvas = this.viewer.scene.canvas;
this.platformIconHandler = new Cesium.ScreenSpaceEventHandler(canvas);
@@ -6509,26 +6838,6 @@ export default {
let entityData = null;
if (picked && picked.id) {
idStr = typeof picked.id === 'string' ? picked.id : (picked.id.id || '');
- if (idStr.endsWith('-scale-frame') || idStr.endsWith('-scale-frame-glow')) {
- this.clickedOnEmpty = false;
- return;
- }
- const handleInfo = this.getPlatformIconDataFromHandleId(idStr);
- if (handleInfo) {
- this.clickedOnEmpty = false;
- if (handleInfo.type === 'rotate') {
- this.draggingRotateHandle = handleInfo.entityData;
- this.platformIconDragCameraEnabled = this.viewer.scene.screenSpaceCameraController.enableInputs;
- this.viewer.scene.screenSpaceCameraController.enableInputs = false;
- return;
- }
- if (handleInfo.type === 'scale') {
- this.draggingScaleHandle = { entityData: handleInfo.entityData, cornerIndex: handleInfo.cornerIndex };
- this.platformIconDragCameraEnabled = this.viewer.scene.screenSpaceCameraController.enableInputs;
- this.viewer.scene.screenSpaceCameraController.enableInputs = false;
- return;
- }
- }
entityData = this.allEntities.find(e => e.type === 'platformIcon' && e.entity === picked.id);
if (!entityData && idStr.startsWith('wb_')) {
entityData = this.whiteboardEntityDataMap && this.whiteboardEntityDataMap[idStr];
@@ -6560,6 +6869,47 @@ export default {
this.platformIconHandler.setInputAction((movement) => {
if (this.platformCopyPlaceState && this.platformCopyPlaceState.items && this.platformCopyPlaceState.items.length) return;
+ const tfCanvas = this.viewer.scene.canvas;
+ const tfDomActive =
+ this.selectedPlatformIcon &&
+ this.selectedPlatformIcon.transformHandles &&
+ this.selectedPlatformIcon.transformHandles.mode === 'dom';
+ const canShowPlatformTfCursor =
+ this.selectedPlatformIcon &&
+ this.selectedPlatformIcon.transformHandles &&
+ !tfDomActive &&
+ !this.draggingScaleHandle &&
+ !this.draggingRotateHandle &&
+ !this.draggingPlatformIcon &&
+ !this.pendingDragIcon &&
+ !this.platformBoxSelectAnchor &&
+ !this.rotatingPlatformIcon;
+ if (canShowPlatformTfCursor) {
+ const pickedTf = this.viewer.scene.pick(movement.endPosition);
+ let tfCur = '';
+ if (pickedTf && pickedTf.id) {
+ const idTf = typeof pickedTf.id === 'string' ? pickedTf.id : (pickedTf.id.id || '');
+ const hiTf = this.getPlatformIconDataFromHandleId(idTf);
+ if (hiTf && hiTf.entityData === this.selectedPlatformIcon) {
+ if (hiTf.type === 'rotate') tfCur = 'alias';
+ else if (hiTf.type === 'scale') {
+ if (hiTf.edgeIndex != null) tfCur = (hiTf.edgeIndex === 0 || hiTf.edgeIndex === 2) ? 'ns-resize' : 'ew-resize';
+ else if (hiTf.cornerIndex != null) tfCur = this._getPlatformCornerResizeCursor(this.selectedPlatformIcon, hiTf.cornerIndex);
+ }
+ }
+ }
+ if (this._platformTfCursor !== tfCur) {
+ tfCanvas.style.cursor = tfCur;
+ this._platformTfCursor = tfCur;
+ }
+ } else if (
+ !this.draggingScaleHandle &&
+ !this.draggingRotateHandle &&
+ this._platformTfCursor
+ ) {
+ tfCanvas.style.cursor = '';
+ this._platformTfCursor = '';
+ }
if (this.platformBoxSelectAnchor && this.platformBoxSelectMode) {
this.platformBoxSelectCurrent = { x: movement.endPosition.x, y: movement.endPosition.y };
const ax = this.platformBoxSelectAnchor.x;
@@ -6620,47 +6970,21 @@ export default {
return;
}
if (this.draggingRotateHandle) {
- const ed = this.draggingRotateHandle;
- if (ed.entity && ed.entity.position) {
- const now = Cesium.JulianDate.now();
- const position = ed.entity.position.getValue(now);
- if (position) {
- const screenPos = Cesium.SceneTransforms.worldToWindowCoordinates(this.viewer.scene, position);
- if (screenPos) {
- const dx = movement.endPosition.x - screenPos.x;
- const dy = movement.endPosition.y - screenPos.y;
- const screenAngle = Math.atan2(dy, dx);
- ed.entity.billboard.rotation = -screenAngle;
- let headingDeg = (screenAngle + Math.PI / 2) * (180 / Math.PI);
- if (headingDeg < 0) headingDeg += 360;
- if (headingDeg >= 360) headingDeg -= 360;
- ed.heading = Math.round(headingDeg);
- }
- }
+ if (!this._platformTransformDomDocBound) {
+ tfCanvas.style.cursor = 'alias';
+ this.applyDraggingRotateAtCartesian2(movement.endPosition);
}
- this.viewer.scene.requestRender();
return;
}
if (this.draggingScaleHandle) {
- const { entityData: ed, cornerIndex } = this.draggingScaleHandle;
- const cartesian = this.viewer.camera.pickEllipsoid(movement.endPosition, this.viewer.scene.globe.ellipsoid);
- if (cartesian) {
- const { lat: newLat, lng: newLng } = this.cartesianToLatLng(cartesian);
- const lng = ed.lng;
- const lat = ed.lat;
- const dpp = this.getDegreesPerPixelAt(lng, lat);
- const vis = this.getPlatformTransformBoxVisualScale(dpp);
- const baseHalf = this.DESIRED_BOX_HALF_PX * vis * Math.min(dpp.degPerPxLng, dpp.degPerPxLat);
- let newHalfDeg;
- if (cornerIndex === 0) newHalfDeg = Math.min(newLng - lng, newLat - lat);
- else if (cornerIndex === 1) newHalfDeg = Math.min(lng - newLng, newLat - lat);
- else if (cornerIndex === 2) newHalfDeg = Math.min(lng - newLng, lat - newLat);
- else newHalfDeg = Math.min(newLng - lng, lat - newLat);
- if (newHalfDeg > 0.0001 && baseHalf > 1e-10) {
- ed.iconScale = Math.max(0.2, Math.min(3, newHalfDeg / baseHalf));
- this.updatePlatformIconBillboardSize(ed);
- this.updateTransformHandlePositions(ed);
+ if (!this._platformTransformDomDocBound) {
+ const { entityData: ed, cornerIndex, edgeIndex } = this.draggingScaleHandle;
+ if (edgeIndex != null) {
+ tfCanvas.style.cursor = (edgeIndex === 0 || edgeIndex === 2) ? 'ns-resize' : 'ew-resize';
+ } else if (cornerIndex != null) {
+ tfCanvas.style.cursor = this._getPlatformCornerResizeCursor(ed, cornerIndex);
}
+ this.applyDraggingScaleAtCartesian2(movement.endPosition);
}
return;
}
@@ -6765,25 +7089,8 @@ export default {
this.selectedPlatformIcon = null;
}
this.clickedOnEmpty = false;
- if (this.draggingRotateHandle) {
- if (this.draggingRotateHandle.isWhiteboard) {
- this.$emit('whiteboard-platform-updated', this.draggingRotateHandle);
- } else {
- this.$emit('platform-icon-updated', this.draggingRotateHandle);
- }
- this.viewer.scene.screenSpaceCameraController.enableInputs = this.platformIconDragCameraEnabled;
- this.draggingRotateHandle = null;
- }
- if (this.draggingScaleHandle) {
- const ed = this.draggingScaleHandle.entityData;
- if (ed && ed.isWhiteboard) {
- this.$emit('whiteboard-platform-updated', ed);
- } else {
- this.$emit('platform-icon-updated', ed);
- }
- this.viewer.scene.screenSpaceCameraController.enableInputs = this.platformIconDragCameraEnabled;
- this.draggingScaleHandle = null;
- }
+ this.finalizePlatformIconRotateDragEnd();
+ this.finalizePlatformIconScaleDragEnd();
if (this.draggingPlatformIcon) {
if (this.draggingPlatformIcon.isWhiteboard) {
this.$emit('whiteboard-platform-updated', this.draggingPlatformIcon);
@@ -9480,6 +9787,8 @@ export default {
iconUrl: ed.imageUrl || plat.imageUrl || plat.iconUrl || '',
heading: ed.heading != null ? ed.heading : 0,
iconScale: ed.iconScale != null ? ed.iconScale : 1.5,
+ iconScaleX: ed.iconScaleX != null ? ed.iconScaleX : (ed.iconScale != null ? ed.iconScale : 1.5),
+ iconScaleY: ed.iconScaleY != null ? ed.iconScaleY : (ed.iconScale != null ? ed.iconScale : 1.5),
color:
ed.color != null && String(ed.color).trim() !== '' ? ed.color : null
}
@@ -9507,6 +9816,8 @@ export default {
iconUrl: ed.imageUrl || plat.imageUrl || plat.iconUrl || '',
heading: ed.heading != null ? ed.heading : 0,
iconScale: ed.iconScale != null ? ed.iconScale : 1,
+ iconScaleX: ed.iconScaleX != null ? ed.iconScaleX : (ed.iconScale != null ? ed.iconScale : 1),
+ iconScaleY: ed.iconScaleY != null ? ed.iconScaleY : (ed.iconScale != null ? ed.iconScale : 1),
detectionZones,
powerZones
}
@@ -9631,7 +9942,16 @@ export default {
0.2,
Math.min(3, tpl.iconScale != null ? tpl.iconScale : (isWb ? 1.5 : 1))
)
- const size = this.PLATFORM_ICON_BASE_SIZE * iconScale
+ const iconScaleX = Math.max(
+ 0.2,
+ Math.min(3, tpl.iconScaleX != null ? tpl.iconScaleX : iconScale)
+ )
+ const iconScaleY = Math.max(
+ 0.2,
+ Math.min(3, tpl.iconScaleY != null ? tpl.iconScaleY : iconScale)
+ )
+ const sizeW = this.PLATFORM_ICON_BASE_SIZE * iconScaleX
+ const sizeH = this.PLATFORM_ICON_BASE_SIZE * iconScaleY
const cartesian = Cesium.Cartesian3.add(refCart, ecefDelta, new Cesium.Cartesian3())
const ll0 = this.cartesianToLatLng(cartesian)
const lat = ll0.lat
@@ -9653,8 +9973,8 @@ export default {
position: cartesian,
billboard: {
image: imageSrc,
- width: size,
- height: size,
+ width: sizeW,
+ height: sizeH,
verticalOrigin: Cesium.VerticalOrigin.CENTER,
horizontalOrigin: Cesium.HorizontalOrigin.CENTER,
rotation,
@@ -9689,7 +10009,9 @@ export default {
entity,
imageUrl: iconUrl,
label: tpl.label || platName,
- iconScale: tpl.iconScale != null ? tpl.iconScale : (isWb ? 1.5 : 1),
+ iconScale: (iconScaleX + iconScaleY) / 2,
+ iconScaleX,
+ iconScaleY,
transformHandles: null,
serverId: null,
roomId: roomId || undefined
@@ -10292,10 +10614,28 @@ export default {
}
},
+ /** 将世界坐标转为菜单用的屏幕像素（失败返回 null） */
+ contextMenuScreenPositionFromCartesian(cartesian) {
+ if (!cartesian || !this.viewer || !this.viewer.scene) return null;
+ try {
+ const sp = Cesium.SceneTransforms.worldToWindowCoordinates(this.viewer.scene, cartesian);
+ return Cesium.defined(sp) ? { x: sp.x, y: sp.y } : null;
+ } catch (e) {
+ return null;
+ }
+ },
+
/** 获取右键菜单的锚点（笛卡尔坐标），用于随地图移动时更新菜单位置 */
getContextMenuAnchorCartesian(entityData, pickedEntity, clickPosition) {
if (!entityData || !this.viewer || !this.viewer.scene) return null;
const now = Cesium.JulianDate.now();
+ // 优先：右键像素对应的地表/场景点，菜单贴在点击处且随相机移动；避免用大图形中心导致「一开菜单就跳」
+ if (clickPosition) {
+ const picked = this.pickMapPlaceCartesian(clickPosition);
+ if (picked) return picked;
+ const ellHit = this.viewer.camera.pickEllipsoid(clickPosition, this.viewer.scene.globe.ellipsoid);
+ if (ellHit) return ellHit;
+ }
// 空域图形：使用中心点
const airspaceCenter = this.getAirspaceCenter(entityData);
if (airspaceCenter) return airspaceCenter;
@@ -10332,11 +10672,6 @@ export default {
return Cesium.Cartesian3.fromDegrees(c.lng, c.lat);
}
}
- // 兜底：使用点击位置对应的地表坐标
- if (clickPosition) {
- const cartesian = this.viewer.camera.pickEllipsoid(clickPosition, this.viewer.scene.globe.ellipsoid);
- if (cartesian) return cartesian;
- }
return null;
},
@@ -12481,11 +12816,10 @@ export default {
const pickList = this.contextMenu.pickList;
if (!pickList || pickList.length <= 1) return;
const nextIndex = ((this.contextMenu.pickIndex || 0) + 1) % pickList.length;
- const { entityData, pickedEntity } = pickList[nextIndex];
- const anchorCartesian = this.getContextMenuAnchorCartesian(entityData, pickedEntity, null);
+ const { entityData } = pickList[nextIndex];
+ // 保留本次右键时的锚点（地表拾取点），不改为新选中图形的中心，避免菜单突然跳到别处
this.contextMenu.entityData = entityData;
this.contextMenu.pickIndex = nextIndex;
- if (anchorCartesian) this.contextMenu.anchorCartesian = anchorCartesian;
if (['polygon', 'rectangle', 'circle', 'sector', 'auxiliaryLine', 'arrow'].includes(entityData.type)) {
this.applyAirspaceHighlight(entityData);
}
@@ -12951,6 +13285,7 @@ export default {
if (entityData.isWhiteboard && this.getDrawingEntityTypes().includes(entityData.type)) {
this.$emit('whiteboard-drawing-updated', this.serializeWhiteboardDrawingEntity(entityData))
} else if (entityData.isWhiteboard && entityData.type === 'platformIcon') {
+ this.ensurePlatformIconScaleAxes(entityData)
this.$emit('whiteboard-platform-updated', {
id: entityData.id,
type: 'platformIcon',
@@ -12961,6 +13296,8 @@ export default {
lng: entityData.lng,
heading: entityData.heading != null ? entityData.heading : 0,
iconScale: entityData.iconScale != null ? entityData.iconScale : 1.5,
+ iconScaleX: entityData.iconScaleX,
+ iconScaleY: entityData.iconScaleY,
label: entityData.label || '',
color:
entityData.color != null && String(entityData.color).trim() !== ''
@@ -13034,10 +13371,14 @@ export default {
const iconScale = Math.max(0.2, Math.min(3, Number.isFinite(rawScale) ? rawScale : 1.5))
ed.color = color
ed.iconScale = iconScale
+ ed.iconScaleX = iconScale
+ ed.iconScaleY = iconScale
this.updateEntityStyle(ed)
if (this.whiteboardEntityDataMap && ed.id && this.whiteboardEntityDataMap[ed.id]) {
this.whiteboardEntityDataMap[ed.id].color = color
this.whiteboardEntityDataMap[ed.id].iconScale = iconScale
+ this.whiteboardEntityDataMap[ed.id].iconScaleX = iconScale
+ this.whiteboardEntityDataMap[ed.id].iconScaleY = iconScale
}
this.$emit('whiteboard-platform-updated', {
id: ed.id,
@@ -13049,6 +13390,8 @@ export default {
lng: ed.lng,
heading: ed.heading != null ? ed.heading : 0,
iconScale,
+ iconScaleX: iconScale,
+ iconScaleY: iconScale,
label: ed.label || '',
color
})
@@ -13056,7 +13399,9 @@ export default {
this.$emit('whiteboard-platform-style-updated', {
id: ed.id,
color,
- iconScale
+ iconScale,
+ iconScaleX: iconScale,
+ iconScaleY: iconScale
})
this.contextMenu.visible = false
if (this.viewer && this.viewer.scene && this.viewer.scene.requestRender) {
@@ -13254,15 +13599,17 @@ export default {
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
- const lockedN = (this.allEntities || []).filter(e => this.isAirspaceDrawingLocked(e)).length
+ const lockedN = this.whiteboardMode
+ ? Object.values(this.whiteboardEntityDataMap || {}).filter(e => e && this.isAirspaceDrawingLocked(e)).length
+ : (this.allEntities || []).filter(e => this.isAirspaceDrawingLocked(e)).length
this.clearDrawingEntities();
- this.notifyDrawingEntitiesChanged();
+ if (!this.whiteboardMode) this.notifyDrawingEntitiesChanged();
const msg = lockedN > 0 ? `已清除未上锁图形（已保留 ${lockedN} 个已上锁空域）` : '已清除空域图形'
this.$message({ type: 'success', message: msg });
}).catch(() => {});
} else {
this.clearDrawingEntities();
- this.notifyDrawingEntitiesChanged();
+ if (!this.whiteboardMode) this.notifyDrawingEntitiesChanged();
}
return;
}
@@ -13619,12 +13966,18 @@ export default {
})
.filter(p => Number.isFinite(p.lng) && Number.isFinite(p.lat))
},
- /** 供冲突定位用：相机飞至指定经纬度与高度 */
+ /** 供冲突定位用：相机飞至指定经纬度；alt 为冲突点/航迹高度(m)，不作为相机距地高度（否则与飞行高度同量级会缩放过近） */
flyToPosition(lng, lat, alt, duration = 1.5) {
if (!this.viewer || !this.viewer.camera) return
- const height = alt != null && Number.isFinite(Number(alt)) ? Number(alt) : 50000
+ let cameraHeightM
+ if (alt != null && Number.isFinite(Number(alt))) {
+ const pt = Number(alt)
+ cameraHeightM = Math.max(145000, pt + 90000)
+ } else {
+ cameraHeightM = 190000
+ }
this.viewer.camera.flyTo({
- destination: Cesium.Cartesian3.fromDegrees(Number(lng), Number(lat), Math.max(1000, height)),
+ destination: Cesium.Cartesian3.fromDegrees(Number(lng), Number(lat), cameraHeightM),
orientation: {
heading: 0,
pitch: Cesium.Math.toRadians(-60),
@@ -13635,8 +13988,23 @@ export default {
},
/** 仅清除空域/威力区图形（不删平台图标、航线） */
clearDrawingEntities() {
- if (!this.allEntities || !this.viewer) return
const types = this.getDrawingEntityTypes()
+ // 白板标绘在 whiteboardEntityDataMap，不在 allEntities；清除时需同步父组件 contentByTime，由 whiteboardEntities 驱动重绘
+ if (this.whiteboardMode) {
+ if (!this.whiteboardEntityDataMap) return
+ const removedIds = []
+ Object.keys(this.whiteboardEntityDataMap).forEach((id) => {
+ const item = this.whiteboardEntityDataMap[id]
+ if (!item || !types.includes(item.type)) return
+ if (this.isAirspaceDrawingLocked(item)) return
+ removedIds.push(id)
+ })
+ if (removedIds.length) {
+ this.$emit('whiteboard-drawings-cleared', { ids: removedIds })
+ }
+ return
+ }
+ if (!this.allEntities || !this.viewer) return
const toRemove = this.allEntities.filter(item => types.includes(item.type) && !this.isAirspaceDrawingLocked(item))
toRemove.forEach(item => {
try {
@@ -13832,6 +14200,10 @@ export default {
existing.lng = ed.lng
existing.heading = ed.heading != null ? ed.heading : 0
existing.iconScale = ed.iconScale != null ? ed.iconScale : 1.5
+ if (ed.iconScaleX != null) existing.iconScaleX = ed.iconScaleX
+ else delete existing.iconScaleX
+ if (ed.iconScaleY != null) existing.iconScaleY = ed.iconScaleY
+ else delete existing.iconScaleY
if (Object.prototype.hasOwnProperty.call(ed, 'color')) {
existing.color =
ed.color != null && String(ed.color).trim() !== '' ? ed.color : null
@@ -13863,7 +14235,11 @@ export default {
const color =
ed.color != null && String(ed.color).trim() !== '' ? ed.color : null
const rotation = Math.PI / 2 - (heading * Math.PI / 180)
- const size = this.PLATFORM_ICON_BASE_SIZE * (ed.iconScale != null ? ed.iconScale : 1.5)
+ const baseS = ed.iconScale != null ? ed.iconScale : 1.5
+ const iconScaleX = ed.iconScaleX != null ? Math.max(0.2, Math.min(3, Number(ed.iconScaleX))) : baseS
+ const iconScaleY = ed.iconScaleY != null ? Math.max(0.2, Math.min(3, Number(ed.iconScaleY))) : baseS
+ const sizeW = this.PLATFORM_ICON_BASE_SIZE * iconScaleX
+ const sizeH = this.PLATFORM_ICON_BASE_SIZE * iconScaleY
const cartesian = Cesium.Cartesian3.fromDegrees(lng, lat)
const native = this.isWhiteboardPlatformNativeColor(color)
const entity = this.viewer.entities.add({
@@ -13872,8 +14248,8 @@ export default {
position: cartesian,
billboard: {
image: imageSrc,
- width: size,
- height: size,
+ width: sizeW,
+ height: sizeH,
color: native
? Cesium.Color.WHITE
: Cesium.Color.fromCssColorString(color || '#008aff'),
@@ -13896,7 +14272,9 @@ export default {
label: ed.label,
type: 'platformIcon',
isWhiteboard: true,
- iconScale: ed.iconScale != null ? ed.iconScale : 1.5
+ iconScale: (iconScaleX + iconScaleY) / 2,
+ iconScaleX,
+ iconScaleY
}
this.whiteboardEntityDataMap = this.whiteboardEntityDataMap || {}
this.whiteboardEntityDataMap[id] = entityData
@@ -15184,6 +15562,21 @@ export default {
}
this.screenDomLabelItems = []
+ this._unbindPlatformTransformDomPostRender()
+ this._detachPlatformTransformDomDocumentListeners()
+ this.platformTransformDom = {
+ visible: false,
+ svgW: 1,
+ svgH: 1,
+ framePoints: '',
+ rotate: { x: 0, y: 0, visible: false },
+ rotateHalfPx: 18,
+ handleDiameterPx: 11,
+ edgeHandleDiameterPx: 10,
+ cornerHandles: [],
+ edgeHandles: []
+ }
+
if (this.viewer) {
this.viewer.destroy()
this.viewer = null
@@ -15747,6 +16140,65 @@ export default {
height: 100%;
}
+/* 平台伸缩框 DOM 层：与地图画布同区域叠放，手柄可点，其余穿透到 Cesium */
+.platform-transform-dom-layer {
+ position: absolute;
+ left: 0;
+ top: 0;
+ right: 0;
+ bottom: 0;
+ z-index: 87;
+ pointer-events: none;
+ overflow: hidden;
+}
+
+.platform-transform-frame-svg {
+ position: absolute;
+ left: 0;
+ top: 0;
+ display: block;
+ pointer-events: none;
+}
+
+.platform-transform-frame-poly {
+ vector-effect: non-scaling-stroke;
+}
+
+.platform-transform-handle {
+ position: absolute;
+ box-sizing: border-box;
+ border-radius: 50%;
+ background: #fff;
+ pointer-events: auto;
+ box-shadow: 0 0 0 1px rgba(15, 23, 42, 0.35);
+}
+
+.platform-transform-handle--corner {
+ border: 2px solid #94a3b8;
+}
+
+.platform-transform-handle--edge {
+ border: 2px solid #e2e8f0;
+}
+
+.platform-transform-rotate-wrap {
+ position: absolute;
+ pointer-events: auto;
+ cursor: alias;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+}
+
+.platform-transform-rotate-img {
+ width: 100%;
+ height: 100%;
+ object-fit: contain;
+ display: block;
+ user-select: none;
+ pointer-events: none;
+}
+
/* 自定义比例尺样式 */
:deep(.scale-bar-container) {
user-select: none;
diff --git a/ruoyi-ui/src/views/childRoom/index.vue b/ruoyi-ui/src/views/childRoom/index.vue
index acf11f8..106f517 100644
--- a/ruoyi-ui/src/views/childRoom/index.vue
+++ b/ruoyi-ui/src/views/childRoom/index.vue
@@ -58,6 +58,7 @@
@room-platform-icon-style-updated="handleRoomPlatformIconStyleUpdated"
@whiteboard-entity-deleted="handleWhiteboardEntityDeleted"
@whiteboard-drawing-updated="handleWhiteboardDrawingUpdated"
+ @whiteboard-drawings-cleared="handleWhiteboardDrawingsCleared"
@open-precise-airspace-adjust="handleOpenPreciseAirspaceAdjust" />