diff --git a/src/views/index.vue b/src/views/index.vue index bf82532..b5ae752 100644 --- a/src/views/index.vue +++ b/src/views/index.vue @@ -855,7 +855,7 @@ const processData = (data) => { lat: data.Latitude, } // boxPos.value = location - let res = getLocalPositionFromRect_Point1AsCenter({ + let res = getLocalPosition_Point1AsCenter({ lon: data.Longitude, lat: data.Latitude, rotate: data.HeadingAngle @@ -1236,7 +1236,7 @@ function getBoundingBoxAndSize(pointsArr) { }; } -function getLocalPositionFromRect_Point1AsCenter(point, rectPoints, rectInfo) { +function getLocalPosition_Point1AsCenter(point, rectPoints, rectInfo) { const R = 111320; const lat0 = rectPoints.reduce((a, b) => a + b.lat, 0) / rectPoints.length; const cosLat = Math.cos((lat0 * Math.PI) / 180); @@ -1246,30 +1246,29 @@ function getLocalPositionFromRect_Point1AsCenter(point, rectPoints, rectInfo) { y: p.lat * R }); + // 转换所有点为平面坐标 const pts = rectPoints.map(toXY); - const p1 = pts.find(p => p.name === "点位1"); // 右下角 ✅旋转中心 - const p4 = pts.find(p => p.name === "点位4"); // 左下角 ✅原点 + const p1 = pts.find(p => p.name === "点位1"); // 右下角 ✅ 旋转中心 + const p4 = pts.find(p => p.name === "点位4"); // 左下角 ✅ 局部坐标系原点 const p = toXY(point); const angle = Number(rectInfo.angle); const rad = (-angle * Math.PI) / 180; - // 1️⃣ 先求相对于点位1的偏移 - const dx1 = p.x - p1.x; - const dy1 = p.y - p1.y; - const x1_local = dx1 * Math.cos(rad) - dy1 * Math.sin(rad); - const y1_local = dx1 * Math.sin(rad) + dy1 * Math.cos(rad); + // 将矩形“扶正”:对所有点执行同样的逆旋转 + const rotateToLocal = (x, y) => ({ + x: (x - p1.x) * Math.cos(rad) - (y - p1.y) * Math.sin(rad), + y: (x - p1.x) * Math.sin(rad) + (y - p1.y) * Math.cos(rad) + }); - // 2️⃣ 求点位4相对于点位1的局部坐标,用来平移 - const dx14 = p4.x - p1.x; - const dy14 = p4.y - p1.y; - const x14_local = dx14 * Math.cos(rad) - dy14 * Math.sin(rad); - const y14_local = dx14 * Math.sin(rad) + dy14 * Math.cos(rad); + // 旋转后的坐标 + const p_local = rotateToLocal(p.x, p.y); + const p4_local = rotateToLocal(p4.x, p4.y); - // 3️⃣ 相对于左下角(点4) - const x_local = x1_local - x14_local; - const y_local = y1_local - y14_local; + // 相对于左下角的坐标 + const x_local = p_local.x - p4_local.x; + const y_local = p_local.y - p4_local.y; - // 4️⃣ 相对旋转角 + // 相对旋转角 const rotate_local = ((point.rotate ?? 0) - angle + 360) % 360; return {