Browse Source

navCube差不多写好了

xzw 2 years ago
parent
commit
99daa0f3dc
3 changed files with 50 additions and 39 deletions
  1. 8 4
      src/custom/viewer/ViewerNew.js
  2. 26 25
      src/viewer/ExtendView.js
  3. 16 10
      src/viewer/NavigationCube.js

+ 8 - 4
src/custom/viewer/ViewerNew.js

@@ -3801,24 +3801,28 @@ export class Viewer extends ViewerBase{
                 callback:()=>{
                     //console.log('focusOnObjectSuccess: '+object.name,  type)
                     deferred.resolve()
-                }, startCamera:o.startCamera, endCamera:o.endCamera, midCamera:this.scene.cameraBasic
+                }, startCamera:o.startCamera, endCamera:o.endCamera, midCamera:this.scene.cameraBasic,
+                endYaw:o.endYaw,  endPitch:o.endPitch
             }, duration)
          
         }else if(camera.type == "OrthographicCamera"){   
             viewer.scene.view.moveOrthoCamera(this.mainViewport,  { endPosition:position, target ,
                 boundSize, 
+                endYaw:o.endYaw,  endPitch:o.endPitch,
                 callback:()=>{
                     //console.log('focusOnObjectSuccess: '+object.name,  type)
                     deferred.resolve()
                 }, 
             }, duration)
         }else{
-            viewer.scene.view.setView({position, target, duration, callback:()=>{
+            viewer.scene.view.setView({position, target, duration,
+                endYaw:o.endYaw,  endPitch:o.endPitch,
+                callback:()=>{
                     //console.log('focusOnObjectSuccess: '+object.name,  type)
                     deferred.resolve()
                 }
-            })
-        }
+            }
+        )}
         
         
          

+ 26 - 25
src/viewer/ExtendView.js

@@ -191,9 +191,11 @@ class ExtendView extends View {
                 this.lookAt(endTarget); //compute radius for orbitcontrol 
             }else if(endQuaternion){
                 this.rotation = new THREE.Euler().setFromQuaternion(endQuaternion)
+            }else if(endYaw != void 0){
+                this.yaw = endYaw,  this.pitch = endPitch
             }
-            if(dir.x == 0 && dir.y == 0)this.yaw = 0 //统一一下 朝上的话是正的。朝下的一般不是0,会保留一个接近0的小数所以不用管
-            //if(info.yaw != void 0) this.yaw = info.yaw //当dir.x=dir.y=0时,计算不到yaw,所以需要补充
+            //if(dir.x == 0 && dir.y == 0)this.yaw = 0 //统一一下 朝上的话是正的。朝下的一般不是0,会保留一个接近0的小数所以不用管
+           
             posWaitDone || done()
             rotWaitDone = false 
         }
@@ -214,31 +216,27 @@ class ExtendView extends View {
         
         let endPosition = new THREE.Vector3().copy(info.position)
         let startPosition = this.position.clone();
-		let startQuaternion, endQuaternion, endTarget = null, needRot;
+		let startQuaternion, endQuaternion, endTarget = null,  
+            endYaw = info.endYaw, startYaw, endPitch = info.endPitch,  startPitch ;
+        
+        
         this.restrictPos(endPosition)
          
-		if(info.target ){
+         
+        if(endYaw != void 0) {
+            startYaw = this.yaw  
+            startPitch = this.pitch  
+		}else if(info.target ){
 			endTarget = new THREE.Vector3().copy(info.target)  
             endQuaternion = math.getQuaFromPosAim(endPosition,endTarget) //若为垂直,会自动偏向x负的方向
             dir = new THREE.Vector3().subVectors(endTarget, endPosition).normalize()
-            //console.log(dir, this.direction)  
-            
-            /* let view = this.clone();
-            view.direction = dir;
-            console.log(view.yaw, view.pitch,  this.yaw,  this.pitch) */
-            
-            
+            //console.log(dir, this.direction)   
 		}else if(info.quaternion){
             endQuaternion = info.quaternion.clone()
         }
          
         if(endQuaternion){ 
-            startQuaternion = this.quaternion//new THREE.Quaternion().setFromEuler(this.rotation)
-            needRot = endQuaternion
-            /*  const startTarget = this.getPivot();
-            let startQuaternion = math.getQuaFromPosAim(startPosition,startTarget) */
-            //console.log('startQuaternion',startQuaternion, this.rotation)
-            //console.log('endQuaternion', endQuaternion, new THREE.Euler().setFromQuaternion(endQuaternion))
+            startQuaternion = this.quaternion 
         }
         
         
@@ -273,16 +271,19 @@ class ExtendView extends View {
                 }, info.ignoreFirstFrame);  
             } 
             
-            if(endQuaternion){
+            if(endQuaternion || endYaw != void 0){
                 rotWaitDone = true 
                 transitions.start( (progress, delta )=>{
-                   
-                    let quaternion = (new THREE.Quaternion()).copy(startQuaternion) 
-                    lerp.quaternion(quaternion, endQuaternion)(progress)  //在垂直的视角下的角度突变的厉害,这时候可能渐变yaw比较好
-                    //console.log(quaternion)
-                    //this.rotation = new THREE.Euler().setFromQuaternion(quaternion)
-                    this.quaternion = quaternion
-                     
+                    if(endYaw != void 0){
+                        this.yaw = startYaw * (1-progress) + endYaw * progress
+                        this.pitch = startPitch * (1-progress) + endPitch * progress
+                    }else{ 
+                        let quaternion = (new THREE.Quaternion()).copy(startQuaternion) 
+                        lerp.quaternion(quaternion, endQuaternion)(progress)  //在垂直的视角下的角度突变的厉害,这时候可能渐变yaw比较好
+                        //console.log(quaternion)
+                        //this.rotation = new THREE.Euler().setFromQuaternion(quaternion)
+                        this.quaternion = quaternion
+                    }
                     posChange || info.onUpdate && info.onUpdate(progress, delta)  
                     
                 }, info.duration, rotDone , 0, info.Easing ? easing[info.Easing] : easing.easeInOutSine ,null, this.LookTransition, ()=>{

+ 16 - 10
src/viewer/NavigationCube.js

@@ -551,13 +551,19 @@ class NavigationCube{
      
     buildFaces() {
         const directions = {
-            Top : new THREE.Vector3(0,0,-1),
-            Bottom : new THREE.Vector3(0,0,1),
-            Left : new THREE.Vector3(1,0,0),
-            Right : new THREE.Vector3(-1,0,0),
-            Front : new THREE.Vector3(0,1,0),
-            Back : new THREE.Vector3(0,-1,0),
-        }
+            Top : {dir: new THREE.Vector3(0,0,-1)},
+            Bottom : {dir: new THREE.Vector3(0,0,1)},
+            Left : {dir: new THREE.Vector3(1,0,0)},
+            Right : {dir: new THREE.Vector3(-1,0,0)},
+            Front : {dir: new THREE.Vector3(0,1,0)},
+            Back : {dir: new THREE.Vector3(0,-1,0)},
+        } 
+        let view = new ExtendView()
+        for(let i in directions){
+            view.direction = directions[i].dir
+            directions[i].yaw = view.yaw,   directions[i].pitch = view.pitch
+        } 
+        
         
         let texturesLoaded = 0
         let create = (n)=>{
@@ -591,7 +597,7 @@ class NavigationCube{
                 faceMesh.addEventListener('click', (e)=>{
                     this.changingView = true 
                     faceMesh.material.uniforms.faceColor.value.set(Colors.blue) 
-                    navCubeViewer.switchView('ortho', directions[name].clone(),()=>{
+                    navCubeViewer.switchView('ortho', directions[name] ,   ()=>{
                         this.changingView = false
                         faceMesh.material.uniforms.faceColor.value.set(Colors.black)
                     })
@@ -823,7 +829,7 @@ class NavCubeViewer extends ViewerBase{
             } 
         }
     } */
-    switchView(type, dir, done){
+    switchView(type, {yaw, pitch, dir}={}, done){
         let view = viewer.mainViewport.view
         if(type == 'ortho'){
             let startCamera, endCamera
@@ -849,7 +855,7 @@ class NavCubeViewer extends ViewerBase{
             }
             
             viewer.focusOnObject(viewer.bound, 'boundingBox', 1000, {
-                dir , startCamera, endCamera
+                endPitch: pitch, endYaw: yaw , dir,  startCamera, endCamera
             }).promise.done(()=>{  
                 
                 done && done()