scene/public/static/js/manage.js

@@ -782,23 +782,100 @@ window.expandMath = function(math){
             matrix.makeTranslation(-points1[0].x, -points1[0].y, -points1[0].z)
             let angle = vec1.angleTo(vec2)
             let qua = this.getQuaBetween2Vector(vec1, vec2, up)
-            let rotMatrix = new THREE.Matrix4().makeRotationFromQuaternion(qua)
+            let rotMatrix = new THREE.Matrix4().makeRotationFromQuaternion(qua) 
+            matrix.multiplyMatrices(rotMatrix, matrix )
             if(ifScale){
                 let len1 = vec1.length()
                 let len2 = vec2.length()
                 let scale = len2 / len1
                 let sclMatrix = new THREE.Matrix4().makeScale(scale,scale,scale)
-                matrix.multiplyMatrices(sclMatrix, matrix )
+                matrix.multiplyMatrices(sclMatrix, matrix )   
+                
             }
-            
-            
-            matrix.multiplyMatrices(rotMatrix, matrix )
             matrix.elements[12]+=points2[0].x 
             matrix.elements[13]+=points2[0].y 
             matrix.elements[14]+=points2[0].z 
             return matrix 
+        },
+        
+        
+        //如果把三个点通过旋转拉伸缩放平移变换到另外三个点，要怎么求出变换矩阵  
+        /**
+         * 使用矩阵求逆直接计算仿射变换矩阵
+         */
+        computeAffineTransformMatrix(srcPoints, dstPoints) {
+            const [p1, p2, p3] = srcPoints;
+            const [q1, q2, q3] = dstPoints;
+            
+            // 构建4x4齐次坐标矩阵（第四个点是原点）
+            // 为了确保矩阵可逆，我们需要4个线性独立的点
+            // 所以用前三个点，第四个点用它们的重心
+            const p4 = new THREE.Vector3()
+                .add(p1).add(p2).add(p3)
+                .multiplyScalar(1/3)
+                .add(new THREE.Vector3(1, 1, 1)); // 稍微偏移确保线性独立
+                
+            const q4 = new THREE.Vector3()
+                .add(q1).add(q2).add(q3)
+                .multiplyScalar(1/3)
+                .add(new THREE.Vector3(1, 1, 1));
+            
+            // 构建源点和目标点的4x4齐次坐标矩阵
+            const P = new THREE.Matrix4();
+            const Q = new THREE.Matrix4();
+            
+            // 设置矩阵列（齐次坐标，第4维为1）
+            P.set(
+                p1.x, p2.x, p3.x, p4.x,
+                p1.y, p2.y, p3.y, p4.y,
+                p1.z, p2.z, p3.z, p4.z,
+                1,    1,    1,    1
+            );
+            
+            Q.set(
+                q1.x, q2.x, q3.x, q4.x,
+                q1.y, q2.y, q3.y, q4.y,
+                q1.z, q2.z, q3.z, q4.z,
+                1,    1,    1,    1
+            );
+            
+            // 计算变换矩阵：T = Q * P^{-1}
+            const P_inv = new THREE.Matrix4().getInverse(P); 
+            const T = new THREE.Matrix4().multiplyMatrices(Q, P_inv);
+            
+            return T;
         }
+        ,
+        threePointsTransform(srcPoints, dstPoints) {//这个结果不对
+            const [A1, A2, A3] = srcPoints;
+            const [B1, B2, B3] = dstPoints;
+            
+            // 为源点构建局部坐标系
+            const srcXAxis = new THREE.Vector3().subVectors(A2, A1).normalize();
+            const srcTemp = new THREE.Vector3().subVectors(A3, A1);
+            const srcZAxis = new THREE.Vector3().crossVectors(srcXAxis, srcTemp).normalize();
+            const srcYAxis = new THREE.Vector3().crossVectors(srcZAxis, srcXAxis);
+            
+            // 为目标点构建局部坐标系
+            const dstXAxis = new THREE.Vector3().subVectors(B2, B1).normalize();
+            const dstTemp = new THREE.Vector3().subVectors(B3, B1);
+            const dstZAxis = new THREE.Vector3().crossVectors(dstXAxis, dstTemp).normalize();
+            const dstYAxis = new THREE.Vector3().crossVectors(dstZAxis, dstXAxis);
+            
+            // 构建从源局部坐标系到世界坐标系的矩阵
+            const srcMatrix = new THREE.Matrix4().makeBasis(srcXAxis, srcYAxis, srcZAxis);
+            srcMatrix.setPosition(A1);
             
+            // 构建从目标局部坐标系到世界坐标系的矩阵
+            const dstMatrix = new THREE.Matrix4().makeBasis(dstXAxis, dstYAxis, dstZAxis);
+            dstMatrix.setPosition(B1);
+            
+            // 计算变换：从源到目标 = dstMatrix * srcMatrix^{-1}
+            const srcMatrixInv = new THREE.Matrix4().getInverse(srcMatrix) 
+            const transformMatrix = new THREE.Matrix4().multiplyMatrices(dstMatrix, srcMatrixInv);
+            
+            return transformMatrix;
+        }
         
     })
 }
@@ -2973,8 +3050,8 @@ Manage.prototype.switchBgmState = function(state){//按钮的状态完全代表
     
 var manage = new Manage();
 
-manage.initMapPanoPos = function( twoPano = [{id:2, px:{x:157,y:240}}, {id:33, px:{x:518,y:921}}] ){
-    twoPano = [{id:2, px:{x:157,y:240}}, {id:33, px:{x:518,y:921}}] 
+manage.initMapPanoPos1 = function( twoPano = [{id:7, px:{x:518,y:434}}/* {id:2, px:{x:157,y:240}} */, {id:33, px:{x:518,y:921}}] ){
+    twoPano = [ {id:2, px:{x:157,y:240}}, {id:33, px:{x:518,y:921}}] 
     let pano1 = player.model.panos.index[twoPano[0].id]
     let pano2 = player.model.panos.index[twoPano[1].id]
     if(!pano1 || !pano2){
@@ -2991,7 +3068,45 @@ manage.initMapPanoPos = function( twoPano = [{id:2, px:{x:157,y:240}}, {id:33, p
     player.model.panos.forEach(pano=>{
         let px = pano.position.clone().setY(0).applyMatrix4(matrix)
          
-        data[pano.id] = {x:157,y:240} //{x:px.x, y:px.z} 
+        data[pano.id] = {x:px.x, y:px.z} 
+    })
+     
+    //总是歪 - -
+    return data  
+}
+
+
+
+
+
+
+
+
+
+manage.initMapPanoPos = function( twoPano = [{id:7, px:{x:518,y:434}}/* {id:2, px:{x:157,y:240}} */, {id:33, px:{x:518,y:921}}] ){
+    //twoPano = [ {id:2, px:{x:157,y:240}}, {id:48, px:{x:584,y:471}}, {id:33, px:{x:518,y:921}}] 
+    twoPano = [ {id:2, px:{x:156,y:240}}, {id:48, px:{x:584,y:471}}, {id:33, px:{x:519,y:921}}] 
+    
+    let pano1 = player.model.panos.index[twoPano[0].id]
+    let pano2 = player.model.panos.index[twoPano[1].id]
+    let pano3 = player.model.panos.index[twoPano[2].id]
+    if(!pano1 || !pano2 || !pano3){
+        return console.error('找不到这两个漫游点', twoPano)
+    }
+    let pos1 = new THREE.Vector3().copy(pano1.position).setY(0) 
+    let pos2 = new THREE.Vector3().copy(pano2.position).setY(0)
+    let pos3 = new THREE.Vector3().copy(pano3.position).setY(0) 
+    let pos1PX = new THREE.Vector3(twoPano[0].px.x, 0, twoPano[0].px.y)
+    let pos2PX = new THREE.Vector3(twoPano[1].px.x, 0, twoPano[1].px.y)
+    let pos3PX = new THREE.Vector3(twoPano[2].px.x, 0, twoPano[2].px.y)
+    let matrix = math.computeAffineTransformMatrix([pos1, pos2, pos3], [pos1PX, pos2PX, pos3PX]  )
+    //let matrix = math.threePointsTransform([pos1, pos2, pos3], [pos1PX, pos2PX, pos3PX]  )
+    
+    let data = {}
+    player.model.panos.forEach(pano=>{
+        let px = pano.position.clone().setY(0).applyMatrix4(matrix)
+         
+        data[pano.id] = /* {x:157,y:240} // */{x:px.x, y:px.z} 
     })
      
     
@@ -3001,6 +3116,17 @@ manage.initMapPanoPos = function( twoPano = [{id:2, px:{x:157,y:240}}, {id:33, p
     
 }
 
+
+
+
+
+
+
+
+
+
+
+
 //处理cursor优先级