fix: 优化

public/static/lib/potree/potree.js

@@ -71013,7 +71013,8 @@ void main()
 	        
 	        
 	        let update = (e)=>{
-	            this.update(e); 
+	            //this.update(e)
+	            this.needsUpdate = true;
 	        };
 	        viewer.mapViewer && viewer.mapViewer.addEventListener("camera_changed",  update); 
 	        viewer.addEventListener("camera_changed",  update); 
@@ -71023,7 +71024,8 @@ void main()
 	         
 	        
 	        let applyMatrix = (e)=>{
-	            this.applyMatrix(e);
+	            if(this.needsUpdate) this.update(e);
+	            else this.applyMatrix(e);
 	        };
 	        viewer.addEventListener("raycaster", applyMatrix);        //before render
 	        viewer.addEventListener("render.begin", applyMatrix); //before render  //magnifier时要禁止吗
@@ -71066,15 +71068,15 @@ void main()
 	            v = false;
 	        }            
 	         
-	        if(!this.latestRealVisi && v){//变为可见后先update 
-	            this.latestRealVisi = true;
+	        /* if(!this.latestRealVisi && v){//变为可见后先update 
+	            this.latestRealVisi = true
 	            setTimeout(()=>{
-	                this.update();
-	            },1);//延迟 防止无限调用
+	                this.update()
+	            },1)//延迟 防止无限调用
 	            return false
 	        }
 	        
-	        this.latestRealVisi = v;
+	        this.latestRealVisi = v */
 	        return v;
 	    }
 	    
@@ -71146,6 +71148,7 @@ void main()
 	        if(!matrix){
 	            this.update(e);
 	            matrix = this.matrixMap.get(e.viewport);
+	            if(!matrix)return                
 	        }
 	        
 	        if(e.viewport == this.useViewport){
@@ -71168,6 +71171,82 @@ void main()
 	    }
 	}
 
+
+
+	/* 
+
+	    let orient2d
+	        
+	    if(this.lineDir){
+	        this.root.updateMatrix();//先更新，getWorldPosition才能得到正确的
+	        this.root.updateMatrixWorld(true)
+	        let center = this.root.getWorldPosition(new THREE.Vector3())
+	        //由于两个端点容易在屏幕外，所以使用center和center加dir
+	        let lineDir = this.lineDir.clone();
+	        
+	        
+	        let r1 = Potree.Utils.getPos2d(center, camera, viewer.renderArea, e.viewport); 
+	        if(!r1.trueSide)return  Potree.Utils.updateVisible(this, 'unableCompute', false);// 但这句会使realVisible为false从而无法更新//console.error('!r1.trueSide') //中心点如果在背面直接不渲染了
+	            
+	        let r2, point2
+	        
+	        let p2State = '', len=1,  p2StateHistory = []
+	        while(p2State != 'got' && p2StateHistory.length<10){ 
+	            point2 = center.clone().add(lineDir.multiplyScalar(len));
+	             
+	            r2 = Potree.Utils.getPos2d(point2, camera, viewer.renderArea, e.viewport);  
+	            if(!r2.trueSide){ //很少遇到点2在背面的
+	                if(!p2StateHistory.includes('tooLong-reverse')){
+	                    p2State = 'tooLong-reverse'  //先尝试反向
+	                    len = -len
+	                }else{
+	                    p2State = 'tooLong'
+	                    len = len / 2
+	                }
+	            }else{
+	                let dis = r2.pos.distanceTo(r1.pos)
+	                if(dis == 0){
+	                    //console.log('dis == 0') 
+	                    Potree.Utils.updateVisible(this, 'unableCompute', false)
+	                    return
+	                    break
+	                } 
+	                if(dis<10 && !p2StateHistory.includes('tooLong')){//和r1的屏幕距离太近，要加长,否则精度过低
+	                    p2State = 'tooShort'
+	                    len = 100/dis * len  
+	                }else{ 
+	                    p2State = 'got'; break;
+	                }
+	            } 
+	            p2StateHistory.push(p2State) 
+	        }
+	        //console.log(p2StateHistory,len)
+	        
+	        if(!r2.trueSide){
+	            return  Potree.Utils.updateVisible(this, 'unableCompute', false)//, console.log('  !r2.trueSide', )
+	        }
+	         
+	        Potree.Utils.updateVisible(this, 'unableCompute', true)
+	        let p1 = r1.pos,  p2 = r2.pos
+	        let vec = new THREE.Vector2().subVectors(p1,p2);
+	        let angle = -vec.angle() //根据测量线在屏幕上的角度在旋转label，使之和屏幕上的二维线平行。
+	        if(p1.x < p2.x) angle += Math.PI  //避免字是倒着的情况
+	         
+	        orient2d = new THREE.Quaternion().setFromAxisAngle(new THREE.Vector3(0,0,1),  angle)
+	        //console.log(this.parent.text, THREE.Math.radToDeg(angle), p1.x < p2.x   )
+	    }
+
+	    let parentQua = this.root.parent.getWorldQuaternion(new THREE.Quaternion)
+	    this.root.quaternion.multiplyQuaternions(parentQua.invert(),camera.quaternion)    //乘上parentQua.invert()是为了中和掉父结点的qua，使只剩下camera.quaternion
+
+	    if(this.lineDir){ 
+	        this.root.quaternion.multiply(orient2d) 
+	    }
+
+
+
+	 */
+
 	//可能还是要用html写，因为要加按钮和图片
 
 	class TextSprite$2 extends Object3D{ 
@@ -71198,6 +71277,7 @@ void main()
 			this.textColor = options.textColor || {r: 0, g: 0, b: 0, a: 1.0};
 	        this.borderColor = options.borderColor || { r: 0, g: 0, b: 0, a: 0.0 };
 			this.borderRadius = options.borderRadius || 6;
+	        this.margin = options.margin;
 	        if(options.text != void 0)this.setText(options.text);
 	        this.name = options.name; 
 	         
@@ -71257,7 +71337,7 @@ void main()
 	        
 			let metrics = context.measureText(this.text );
 			let textWidth = metrics.width;
-			let margin = new Vector2(this.fontsize, Math.max(  this.fontsize*0.4, 10)  );
+			let margin = this.margin || new Vector2(this.fontsize, Math.max(  this.fontsize*0.4, 10)  );
 			let spriteWidth = 2 * margin.x + textWidth + 2 * this.rectBorderThick;
 			let spriteHeight = 2 * margin.y + this.fontsize + 2 * this.rectBorderThick; 
 			context.canvas.width = spriteWidth;
@@ -71265,10 +71345,22 @@ void main()
 			context.font = this.fontWeight + ' ' + this.fontsize + 'px ' + this.fontface; 
 
 	         
-	        let diff = 2;//针对英文大部分在baseLine之上所以降低一点(metrics.fontBoundingBoxAscent - metrics.fontBoundingBoxDescent) / 2
+	        /* let diff = 2//针对英文大部分在baseLine之上所以降低一点(metrics.fontBoundingBoxAscent - metrics.fontBoundingBoxDescent) / 2
 
-	        context.textBaseline = "middle";
+	        context.textBaseline = "middle"
+	         */
+	        let expand = Math.max(1, Math.pow(this.fontsize / 16, 1.3)); // 针对英文大部分在baseLine之上所以降低一点,或者可以识别当不包含jgqp时才加这个值  
+	         
+	        //canvas原点在左上角
+	        context.textBaseline = 'alphabetic'; //  "middle"  //设置文字基线。当起点y设置为0时，只有该线以下的部分被绘制出来。middle时文字显示一半(但是对该字体所有字的一半，有的字是不一定显示一半的，尤其汉字)，alphabetic时是英文字母的那条基线。
+	        
+	        let actualHeight = metrics.actualBoundingBoxAscent + metrics.actualBoundingBoxDescent; // 当前文本字符串在这个字体下用的实际高度
 	        
+	        //文字y向距离从textBaseline向上算
+	        let y = metrics.actualBoundingBoxAscent + margin.y + expand; 
+	        //console.log(this.text, 'y' , y, 'actualBoundingBoxAscent', metrics.actualBoundingBoxAscent,'expand',expand )
+	        
+	                                                  
 	        // border color
 	        context.strokeStyle = 'rgba(' + this.borderColor.r + ',' + this.borderColor.g + ',' +
 	            this.borderColor.b + ',' + this.borderColor.a + ')';
@@ -71285,12 +71377,12 @@ void main()
 	            context.strokeStyle = 'rgba(' + this.textBorderColor.r + ',' + this.textBorderColor.g + ',' +
 	                this.textBorderColor.b + ',' + this.textBorderColor.a + ')';
 	            context.lineWidth = this.textBorderThick;
-	            context.strokeText(this.text , this.rectBorderThick + margin.x,spriteHeight/2  + diff );
+	            context.strokeText(this.text , this.rectBorderThick + margin.x,  y /* spriteHeight/2  + diff */ );
 	        }
 	        
 			context.fillStyle = 'rgba(' + this.textColor.r + ',' + this.textColor.g + ',' +
 				this.textColor.b + ',' + this.textColor.a + ')';
-			context.fillText(this.text , this.rectBorderThick + margin.x, spriteHeight/2  + diff );//x,y
+			context.fillText(this.text , this.rectBorderThick + margin.x,  y/* spriteHeight/2  + diff */ );//x,y
 
 			let texture = new Texture(canvas);
 			texture.minFilter = LinearFilter;
@@ -81816,6 +81908,14 @@ void main()
 	                }; 
 	                o.marker.addEventListener('mouseover', mouseover);
 	                o.marker.addEventListener('mouseleave', mouseleave);
+	                
+	                o.marker.addEventListener('startDragging', (e)=>{//for mobile
+	                    this.setMarkerSelected(o.marker, 'hover', 'single'); 
+	                });
+	                o.marker.addEventListener('drop', (e)=>{//for mobile
+	                    this.setMarkerSelected(o.marker, 'unhover', 'single'); 
+	                });
+	                
 	                o.marker.removeEventListener('addHoverEvent',addHoverEvent); 
 	            };
 	            o.marker.addEventListener('addHoverEvent',addHoverEvent);//当非isNew时才添加事件
@@ -88925,7 +89025,7 @@ void main()
 	        
 	        let target = params.target || null;
 	        
-			const resolution = rtEDL ? new Vector2(rtEDL.width,rtEDL.height) : params.viewport ? params.viewport.resolution2 : this.viewer.renderer.getSize(new Vector2()); 
+	        const resolution = (rtEDL && Potree.settings.useRTPoint) ? new Vector2(rtEDL.width,rtEDL.height) : params.viewport ? params.viewport.resolution2 : this.viewer.renderer.getSize(new Vector2());//突然发现mobile用resolution2点云会放大
 	        
 	        
 	        
@@ -90110,7 +90210,7 @@ void main()
 	                if(e.touches.length == 1){
 	                    mode = (!e.dragViewport || e.dragViewport.name == 'MainView') ? 'rotate' : 'pan'; 
 	                }else if(e.touches.length == 2){
-	                    mode = Potree.settings.displayMode == 'showPanos' ? 'scale' : 'pan-scale';
+	                    mode = Potree.settings.displayMode == 'showPanos' ? 'scale' :  'pan-scale';
 	                }else {
 	                    mode = (!e.dragViewport || e.dragViewport.name == 'MainView') ? 'pan' : 'scale'; 
 	                } 
@@ -90338,7 +90438,8 @@ void main()
 	            
 	            
 	            if(mode.includes('scale')){//触屏缩放
-	                
+	               
+	                 
 	                this.dollyEnd.subVectors(e.touches[0].pointer, e.touches[1].pointer);
 	                //if(!this.dollyStart)return
 	                var scale = this.dollyEnd.length() / this.dollyStart.length();
@@ -90348,9 +90449,9 @@ void main()
 	                dolly({
 	                    pointer,
 	                    scale, camera, drag:e.drag
-	                });
+	                }); 
 	                this.dollyStart.copy(this.dollyEnd);
-	                
+	             
 	            }
 	            //最好按ctrl可以变为dollhouse的那种旋转
 			};
@@ -90366,7 +90467,7 @@ void main()
 	                  
 	            if(Potree.settings.displayMode == 'showPanos' && this.currentViewport == viewer.mainViewport/* this.currentViewport.unableChangePos */){//全景时 
 	                this.dispatchEvent({type:'dollyStopCauseUnable',delta:e.delta, scale:e.scale});
-	                return 
+	                return
 	            }
 	            
 	            let camera = e.camera;
@@ -90427,28 +90528,43 @@ void main()
 	                    this.useAttenuation = true;
 	                }else {//触屏缩放
 	                    direction = this.viewer.inputHandler.getMouseDirection(e.pointer).direction;  //定点缩放
-	               
+	                
 	                    if(e.drag.intersectStart){//和intersect的墙越接近，速度越慢，便于focus细节
 	                        let dis = camera.position.distanceTo(e.drag.intersectStart.location);
 	                        
+	                        
 	                        let r = 1-1/e.scale; 
 	                        let closeMin = 0.1, standardMin = 0.001, disBound1 = 2, disBound2 = 5;   
+	                        
+	                        if(math.closeTo(e.scale,1,0.03)){//如果偏差小于0.01，就不限制最小值，因为平移容易正负抖动，近距离有最小值的话抖动明显
+	                            closeMin = 0;                //所以若缩放不明显（双指滑动慢），就不设置最低值。（这时候穿越障碍物会比较困难。）
+	                        }
+	                        //console.log('closeMin',closeMin)
 	                        let min = math.linearClamp(dis, disBound1, disBound2,  closeMin, standardMin); //触屏和滚轮不一样，触发较为连续，所以最小值设低一点。若要保持双指相对点云位置不变，理想最小值是0，但那样就无法穿越点云（最小值太小的话穿越密集点云如树丛很困难；太大会打滑）所以当离点云近时增大最小值 
 	                        speed = Math.sign(r) * MathUtils.clamp(dis * Math.abs(r),   min, speed); 
 	                        
 	                        //console.log(speed, dis, e.scale)
 	                        
 	                    }else {  
-	                        const constantDis =  this.currentViewport.getMoveSpeed() * 200; //constantDis = 10;//常量系数，当放大一倍时前进的距离。可以调整
+	                        
+	                        this.useAttenuation = true;
+	                        let accelerate = 80;
+	                        if(math.closeTo(e.scale,1,0.02)){//缩放小的时候很可能是双指平移时，容易抖动，所以降低移动速度
+	                            accelerate *= Math.min(40*Math.abs(e.scale-1), 0.8);             
+	                        }
+	                        // console.log('accelerate',accelerate)
+	                        const constantDis = this.currentViewport.getMoveSpeed() * accelerate; //constantDis = 10;//常量系数，当放大一倍时前进的距离。可以调整
 	                        speed = (e.scale-1)*constantDis; 
 	                    } 
+	                    
 	                }
 	                  
 	                var vec = direction.multiplyScalar(speed );
 	                //this.translationWorldDelta.copy(vec)
 	                this.translationWorldDelta.add(vec);
-	                //console.log(vec, speed)
+	                //console.log(direction.toArray(), speed, e.scale)
 	            }
+	            return true
 	        };
 
 			let scroll = (e) => {
@@ -98207,7 +98323,7 @@ void main()
 	            }else { 
 	            }
 	           
-	            this.dispatchEvent({type:'flyToPanoDone', makeIt});
+	            this.dispatchEvent({type:'flyToPanoDone', makeIt, disturb});
 	             
 	            toPano.deferred && toPano.deferred.resolve(makeIt);  //测量线截图时发现，resolve需要写在flying=false 后才行。
 	        };
@@ -151268,7 +151384,7 @@ ENDSEC
 	                        
 	                        this.setPointLevels();
 	                        
-	                        
+	                        this.dispatchEvent('pointDensityChanged');
 	                    }
 	                }
 	            });
@@ -151284,6 +151400,7 @@ ENDSEC
 	                            Potree.settings.pointDensity = density; 
 	                        }
 	                        UserPointDensity = density;
+	                        this.dispatchEvent('UserPointDensityChanged');
 	                    }
 	                }
 	            });
@@ -154289,11 +154406,16 @@ ENDSEC
 	            if(o.dontChangeCamDir){
 	                var inv = camera.matrixWorldInverse;
 	            }else {
-	                var cameraTemp = camera.clone();
-	                cameraTemp.position.copy(cameraPos);  
-	                cameraTemp.lookAt(target);
-	                cameraTemp.updateMatrix();
-	                cameraTemp.updateMatrixWorld();
+	                var cameraTemp = camera.clone(); 
+	                let view = viewer.mainViewport.view.clone();
+	                view.position.copy(cameraPos);
+	                view.lookAt(target);
+	                if(o.endPitch != void 0){
+	                    view.pitch = o.endPitch;
+	                    view.yaw = o.endYaw;
+	                }
+	                view.applyToCamera(cameraTemp);
+	                 
 	                //对镜头的bound
 	                var inv = cameraTemp.matrixWorldInverse;
 	            } 

src/pages/Viewer.vue

@@ -317,10 +317,12 @@ const onModeChange = targetMode => {
 }
 
 const onDensityChange = density => {
-    if (sync.sourceInst) {
+    if (sync.sourceInst) { 
         sync.sourceInst.loaded.then(sdk => {
+            //console.log('onDensityChange',sync.sourceInst.sceneName, density.type)
             let data = sdk.scene.changePointDensity(density.type)
             sdk.scene.changeDensityPercent(data.percent)
+            sync.sourceInst.viewer.dispatchEvent('densityChange')
         })
         densityType.value = density
     }

src/utils/ConvertViews.js

@@ -102,8 +102,15 @@ export default class ConvertViews extends THREE.EventDispatcher{
                 }
                 master.viewer.images360.addEventListener('flyToPano',flyToPano)
               
+              
+                var cancelFlyToPano = (e)=>{//防止点云模式下飞到pano途中停止后另一边还在飞
+                    e.disturb && this.laserCancelFly(customer) 
+                }
+                master.viewer.images360.addEventListener('flyToPanoDone',cancelFlyToPano)
+                
+              
                 var cameraMove = (e)=>{ 
-                    if(master != this.masterApp || !customer.viewer )return
+                    if(master != this.masterApp || !customer.viewer  )return
                     
                     this.fakeAppUpdateInfo(master)
                     
@@ -120,6 +127,18 @@ export default class ConvertViews extends THREE.EventDispatcher{
                 }
                 master.addEventListener('mouseup',dragEnd)
                     
+                    
+                var pointDensityChanged = ()=>{
+                    if(customer.Potree.settings.UserDensityPercent != master.Potree.settings.UserDensityPercent){
+                        customer.Potree.settings.UserDensityPercent = master.Potree.settings.UserDensityPercent  //在sdk里初始化了UserDensityPercent所以不能只用UserPointDensity了
+                        customer.viewer.setPointLevels()
+                        console.log('UserPointDensity', master.sceneName,  master.Potree.settings.UserDensityPercent)
+                    }
+                     
+                }
+                master.viewer.addEventListener('densityChange',pointDensityChanged)
+                   
+                    
             }else if(sourceApp.sceneType == 'kankan'){
                 
                 
@@ -136,8 +155,10 @@ export default class ConvertViews extends THREE.EventDispatcher{
                 
                 
                 var cameraMove = (e)=>{//暂时只有漫游模式
-                    if(!e.hasChanged.cameraChanged || !customer.app || !customer.app.core)return
-                    
+                    if(!e.hasChanged.cameraChanged || !customer.app || !customer.app.core|| 
+                        master != this_.masterApp 
+                    )return
+                    //console.log('cameraMove', master.sceneName)
                     this.fakeAppUpdateInfo(master)
                     this.syncView(master, customer) 
                 }
@@ -159,14 +180,17 @@ export default class ConvertViews extends THREE.EventDispatcher{
                 if(master.sceneType == 'laser'){
                     if(!master.viewer )return //master已替换，不用处理
                     master.viewer.images360.removeEventListener('flyToPano',flyToPano)
+                    master.viewer.images360.removeEventListener('flyToPanoDone',cancelFlyToPano)
                     master.viewer.removeEventListener('camera_changed',cameraMove)
+                    master.viewer.removeEventListener('densityChange',pointDensityChanged)
+                    
                 }else if(master.sceneType == 'kankan'){
                     player1.off("flying.started",flyToPano)
                     player1.off("update",cameraMove)
                 }
                 
-                master.removeEventListener('mousedown',changeMaster)
-                master.removeEventListener('mousewheel',changeMaster)
+                dom.removeEventListener('pointerdown',changeMaster)
+                dom.removeEventListener('mousewheel',changeMaster)
                 master.removeEventListener('mouseup',dragEnd)
                 this.removeEventListener('clearBind-sameType',dispose)
             } 
@@ -177,7 +201,7 @@ export default class ConvertViews extends THREE.EventDispatcher{
         
         bind(sourceApp, targetApp) 
         bind(targetApp, sourceApp) 
-        
+        master.viewer.dispatchEvent('densityChange')//同步点云质量
          
         
         this.loaded = true 
@@ -626,7 +650,7 @@ export default class ConvertViews extends THREE.EventDispatcher{
         let {position,target} = this.getTranPosData(data, convertInfo, customer && customer.fakeApp == convertInfo.sourceFakeApp  ) 
  
 
-        if(customer && customer.sceneType == 'laser'){
+        if(customer && customer.sceneType == 'laser'){ 
             this.laserSyncView(customer, {position,target})
         }else if(customer && customer.sceneType == 'kankan'){
             this.syncView(sourceApp, targetApp, convertInfo)
@@ -795,6 +819,7 @@ export default class ConvertViews extends THREE.EventDispatcher{
                 currentPano :  images360.currentPano && images360.currentPano.id,
                 isAtPano : images360.isAtPano(),
                 quaternionChanged : true,
+                bumping: images360.bumping,
                 
             } 
         }else if(app.sceneType == 'kankan'){
@@ -829,7 +854,7 @@ export default class ConvertViews extends THREE.EventDispatcher{
         convertInfo = convertInfo || this.convertInfo
         if(fakeApp.sceneType == 'laser'){
             //customer.Potree.settings.displayMode = fakeApp.viewInfo.displayMode
-            if(fakeApp.viewInfo.isAtPano || fakeApp.viewInfo.displayMode == 'showPanos'){ //不改变漫游点，仅转换朝向 
+            if(fakeApp.viewInfo.isAtPano || fakeApp.viewInfo.bumping || fakeApp.viewInfo.displayMode == 'showPanos'){ //不改变漫游点，仅转换朝向 
                 if( fakeApp.viewInfo.quaternionChanged){
                     let diffQua = customer.fakeApp == convertInfo.targetFakeApp ? convertInfo.diffQua : convertInfo.diffQuaInvert
                     //let diffQua = customer == this.targetApp ? convertInfo.diffQua : convertInfo.diffQuaInvert
@@ -894,7 +919,7 @@ export default class ConvertViews extends THREE.EventDispatcher{
             pano.dispatchEvent({type:'changeMarkerTex',name:'ring'})
         })  */
         //app.Potree.settings.pointDensity = 'high'
-        app.Potree.settings.UserDensityPercent = this.isMobile ? 0.8 : 1 ; //因为nodeMaxLevel不同，感觉只有最高质量能看起来一样
+        app.Potree.settings.UserDensityPercent = 1;  //在sdk里初始化了UserDensityPercent所以不能只用UserPointDensity了
         app.viewer.setPointLevels()
         app.Potree.settings.rotAroundPoint = false   //去除原因：比较好同步，尤其当左边在当前点位，右边同步后却离开当前点位的话拖拽就会绕点旋转了
         setTimeout(()=>{//laser的代码中莫名会请求showPointCloud，所以尽量晚一点覆盖它，再确保一次
@@ -1070,7 +1095,7 @@ function getId(){
 /* 
 
 note:
-
+还不支持laser和4dkk同屏
 
 访问：
 window[0]   window[1]