测量的pick时 点云密度提高到最高

note笔记笔记笔记.txt

@@ -30,6 +30,8 @@ SS-t-P6zBR73Gke 燃气站
 t-QaHxu5Nmn3 一楼门口
 	--多楼层漫游点：
 
+
+
  
 
 
@@ -184,28 +186,12 @@ sitemodel
 cursor总感觉应该打开。 但是会比较乱，而且用reticule也可以试探出。target比较重要，而非当前位置
 
 --------------------
-
-
-
-
-
  
-
-
 出现过mainViewer中的reticule位置改变特别慢
 
 
-
-
-
-
-
-时间久了烟会成一团？
-
-
-
-
-
-
+ 
+ 
+测试测量的截图有没问题
 
   

src/PointCloudOctree.js

@@ -6,7 +6,7 @@ import {PointCloudOctreeGeometryNode} from "./PointCloudOctreeGeometry.js";
 import {Utils} from "./utils.js";
 import {PointCloudMaterial} from "./materials/PointCloudMaterial.js";
 import math from "./utils/math.js";
-
+import Common from './utils/Common'
 import {MeshDraw} from "./utils/DrawUtil.js";
 import searchRings from "./utils/searchRings.js";
 import {TextSprite} from './objects/TextSprite'
@@ -1400,6 +1400,14 @@ export class PointCloudOctree extends PointCloudTree {
 		let width = Math.ceil(getVal(params.width, size.width)); //renderTarget大小。影响识别精度  
 		let height = Math.ceil(getVal(params.height, size.height));
         
+        let screenshot = ()=>{
+            if(window.testScreen){            
+                let dataUrl = Potree.Utils.renderTargetToDataUrl(pickState.renderTarget, width, height, renderer)
+             
+                Common.downloadFile(dataUrl, 'screenshot.jpg')  //为什么图片上不是只有pickWindowSize区域有颜色？？
+                window.testScreen = 0
+            } 
+        }
         
       
 
@@ -1475,7 +1483,7 @@ export class PointCloudOctree extends PointCloudTree {
 
 		let gl = renderer.getContext();
 		gl.enable(gl.SCISSOR_TEST);
-		gl.scissor(
+		gl.scissor(  //规定渲染范围，只渲染一小块
 			parseInt(pixelPos.x - (pickWindowSize - 1) / 2),
 			parseInt(pixelPos.y - (pickWindowSize - 1) / 2),
 			parseInt(pickWindowSize), parseInt(pickWindowSize));
@@ -1494,6 +1502,8 @@ export class PointCloudOctree extends PointCloudTree {
 			this.material = pickMaterial;
             
 			pRenderer.renderOctree(this, nodes, camera, pickState.renderTarget);
+            screenshot();
+
 
 			this.material = tmp;
 		}

src/navigation/InputHandler.js

@@ -82,6 +82,16 @@ export class InputHandler extends EventDispatcher {
 		this.domElement.addEventListener('touchstart', this.onTouchStart.bind(this));
 		this.domElement.addEventListener('touchend', this.onTouchEnd.bind(this));
 		this.domElement.addEventListener('touchmove', this.onTouchMove.bind(this));
+        
+        
+        {
+            this.on('isMeasuring',(v, cause)=>{
+                console.log('isMeasuring',v,cause)
+                this.isMeasuring = v 
+            }) 
+        }
+        
+        
 	}
 
 	/* addInputListener (listener) {
@@ -368,8 +378,8 @@ export class InputHandler extends EventDispatcher {
         }
         
         
-		this.hoverViewport = viewport
-        
+		this.dragViewport = this.hoverViewport = viewport
+      
         
         if(isTouch){ 
             this.hoveredElements = this.getHoveredElements(); 
@@ -405,11 +415,10 @@ export class InputHandler extends EventDispatcher {
                 if(consumed){
                     break;
                 }
-            }
-          
-
-            
+            } 
         }
+        
+        
         if (!this.drag) {
             let target = (isTouch||e.button == THREE.MOUSE.LEFT) && this.hoveredElements.find(el => (//只有左键能拖拽
                     el.object._listeners &&
@@ -426,7 +435,7 @@ export class InputHandler extends EventDispatcher {
        
         this.drag.intersectStart = this.intersectPoint;
         this.mouseDownMouse = this.mouse.clone()
-        this.dragViewport = this.hoverViewport;
+        
         this.pointerDownTime = Date.now()
     }
 
@@ -690,7 +699,8 @@ export class InputHandler extends EventDispatcher {
             camera, 
             this.viewer, 
             this.viewer.scene.pointclouds,
-            {pickClipped: true});
+            {pickClipped: true, isMeasuring: this.isMeasuring}
+        );
             
         
         
@@ -965,13 +975,14 @@ export class InputHandler extends EventDispatcher {
 			}
 		}
         
-        this.viewer.dispatchEvent($.extend(  
-            this.getEventDesc(/*e ,true */),
-            {
-                type: 'startDragging' 
-            }
-        )); 
-        
+        if(object){
+            object.dispatchEvent($.extend(  
+                this.getEventDesc(),
+                {
+                    type: 'startDragging' 
+                }
+            )); 
+        }
          
 
 		

src/objects/fireParticle/explode/ExplodeParticle.js

@@ -71,13 +71,30 @@ class ExplodeParticle extends THREE.Points{
     super()
     this.particles = []
      
-   
-
     this.age = 0
     this.alive = true
     this.deathAge = 60
     this.loop = true
        
+     
+    this.blendMode = THREE.NormalBlending
+
+    this.setParameters(params)
+    this.createParticles()
+    
+    
+    
+    //------------------------------------
+    
+    this.setSize({viewport:viewer.mainViewport})
+    this.setFov(viewer.fov)
+    viewer.addEventListener('resize',(e)=>{ 
+        if(e.viewport.name != "MainView")return
+        this.setSize(e) 
+    })  
+    viewer.addEventListener('fov_changed',(e)=>{ 
+        this.setFov(e.fov) 
+    })
     
     viewer.on('pageVisible', (state)=>{   
         if(state){//重新一个个放出粒子，否则会一股脑儿全部出来，因为同时大于粒子周期了一起重新生成出现。
@@ -93,13 +110,7 @@ class ExplodeParticle extends THREE.Points{
         }  
     }) 
     
-
     
-
-    this.blendMode = THREE.NormalBlending
-
-    this.setParameters(params)
-    this.createParticles()
   }
 
 
@@ -122,7 +133,8 @@ class ExplodeParticle extends THREE.Points{
     this.geometry = new THREE.BufferGeometry()
     this.material = new THREE.ShaderMaterial({
       uniforms: {
-        u_sampler: { value: this.texture ||  getTexture() }
+        u_sampler: { value: this.texture ||  getTexture() },
+        heightOfNearPlane: { type: "f", value:0}  //相对far ，以确保画面缩放时点的大小也会缩放
       },
       vertexShader,
       fragmentShader,
@@ -303,6 +315,26 @@ class ExplodeParticle extends THREE.Points{
     }
 
   }
+  
+  
+  
+    setSize(e){
+        let viewport = e.viewport
+        this.screenHeight = viewport.resolution.y
+        this.setPerspective(this.fov, this.screenHeight)  
+    }
+
+    setFov(fov){
+        this.fov = fov
+        this.setPerspective(this.fov, this.screenHeight) 
+    }
+
+
+    setPerspective(fov, height){
+        //this.uniforms.heightOfNearPlane.value = Math.abs(height / (2 * Math.tan(THREE.Math.degToRad(fov * 0.5))));
+        let far = Math.abs(height / (2 * Math.tan(THREE.Math.degToRad(fov * 0.5))));
+        this.material.uniforms.heightOfNearPlane.value = far 
+    }
 
 
 }

src/objects/fireParticle/explode/shader.js

@@ -6,6 +6,7 @@ export const vertexShader = `
   attribute float visible;
   varying vec4 vColor;
   varying float vAngle;
+  uniform float heightOfNearPlane;
   
   void main() {
     if(visible > 0.5) {
@@ -15,8 +16,10 @@ export const vertexShader = `
     }
     vAngle = angle;
     vec4 mvPosition = modelViewMatrix * vec4(position, 1.0);
-    gl_PointSize = size * (300.0 / length(mvPosition.xyz));
+    //gl_PointSize = size * (300.0 / length(mvPosition.xyz));
     gl_Position = projectionMatrix * mvPosition;
+    
+    gl_PointSize = ( heightOfNearPlane * size ) / gl_Position.w;
   }
 ` 
 

src/objects/fireParticle/smoke/SmokeParticle.js

@@ -106,6 +106,19 @@ export default class SmokeParticle extends THREE.Points{
         
         
         
+        
+        //---------------------------------------
+        this.setSize({viewport:viewer.mainViewport})
+        this.setFov(viewer.fov)
+        viewer.addEventListener('resize',(e)=>{ 
+            if(e.viewport.name != "MainView")return
+            this.setSize(e) 
+        })  
+        viewer.addEventListener('fov_changed',(e)=>{ 
+            this.setFov(e.fov) 
+        })
+        
+        
         viewer.on('pageVisible', (state)=>{   
             if(state){//重新一个个放出粒子，否则会一股脑儿全部出来，因为同时大于粒子周期了一起重新生成出现。
                 setTimeout(()=>{//会先update一次delta为pageUnvisile的时间才触发
@@ -140,6 +153,7 @@ export default class SmokeParticle extends THREE.Points{
             uniforms: 
             {
                 u_sampler:   { type: "t", value: getTexture() },
+                heightOfNearPlane: { type: "f", value:0}  //相对far ，以确保画面缩放时点的大小也会缩放
             },
             vertexShader:   vertexShader,vertexShader,
             fragmentShader: fragmentShader,
@@ -345,4 +359,26 @@ export default class SmokeParticle extends THREE.Points{
         var rand3 = new THREE.Vector3( Math.random() - 0.5, Math.random() - 0.5, Math.random() - 0.5 );
         return new THREE.Vector3().addVectors( base, new THREE.Vector3().multiplyVectors( spread, rand3 ) );
     }
+    
+    
+    
+    
+    setSize(e){
+        let viewport = e.viewport
+        this.screenHeight = viewport.resolution.y
+        this.setPerspective(this.fov, this.screenHeight)  
+    }
+    
+    setFov(fov){
+        this.fov = fov
+        this.setPerspective(this.fov, this.screenHeight) 
+    }
+    
+    
+    setPerspective(fov, height){
+        //this.uniforms.heightOfNearPlane.value = Math.abs(height / (2 * Math.tan(THREE.Math.degToRad(fov * 0.5))));
+        let far = Math.abs(height / (2 * Math.tan(THREE.Math.degToRad(fov * 0.5))));
+        this.material.uniforms.heightOfNearPlane.value = far 
+    }
+    
 }

src/objects/fireParticle/smoke/shader.js

@@ -4,6 +4,9 @@ export const vertexShader = `
     attribute float customSize;
     attribute float customAngle;
     attribute float customVisible;  
+    uniform float heightOfNearPlane;
+    
+    
     varying vec4  vColor;
     varying float vAngle;
     void main()
@@ -16,8 +19,11 @@ export const vertexShader = `
         vAngle = customAngle;
 
         vec4 mvPosition = modelViewMatrix * vec4( position, 1.0 );
-        gl_PointSize = customSize * ( 300.0 / length( mvPosition.xyz ) );     
+        //gl_PointSize = customSize * ( 300.0 / length( mvPosition.xyz ) );     
         gl_Position = projectionMatrix * mvPosition;
+        gl_PointSize = ( heightOfNearPlane * customSize ) / gl_Position.w;
+        
+        
     }
 ` 
 

src/objects/tool/Measure.js

@@ -290,7 +290,12 @@ export class Measure extends ctrlPolygon{
         viewer.setObjectLayers(marker, 'measure' )
         marker.renderOrder = 3 
         marker.markerSelectStates = {} 
-        
+        marker.addEventListener('startDragging',(e)=>{
+            if(e.drag.dragViewport.name == 'MainView')viewer.inputHandler.emit('isMeasuring', true, 'startDragging')
+        })
+        marker.addEventListener('drop',(e)=>{
+            viewer.inputHandler.emit('isMeasuring', false, 'stopDragging')
+        })
         
         let edge
 		{ // edges 
@@ -298,18 +303,13 @@ export class Measure extends ctrlPolygon{
 					0, 0, 0,
 					0, 0, 0,
 			],{material:this.getLineMat('edgeDefault')} ) 
-            viewer.setObjectLayers(edge, 'measure' ) 
-            
-            
-             
-            
+            viewer.setObjectLayers(edge, 'measure' )   
             
 		}
         
         super.addMarker({point:o.point, marker:marker,  edge})
         
         
-        
 		if(this.showEdges){ // edge labels  
             const edgeLabel = this.createEdgeLabel('edgeLabel', !this.closed) 
 			this.edgeLabels.push(edgeLabel); 
@@ -870,6 +870,8 @@ export class Measure extends ctrlPolygon{
             this.area = {value:0};
             this.areaLabel && this.areaLabel.setVisible(false)
         }
+         viewer.inputHandler.emit('isMeasuring', true, 'reDraw')
+	            
     }
     
 

src/objects/tool/MeasuringTool.js

@@ -417,7 +417,7 @@ export class MeasuringTool extends EventDispatcher{
                     //重新开始画
                     measure.markers[0].removeEventListener('mousedown',end)
                     measure.reDraw()
-                    
+                     
                     
                     this.viewer.addEventListener('global_click', click, 10)
                    
@@ -455,7 +455,8 @@ export class MeasuringTool extends EventDispatcher{
                 type : "CursorChange", action : "remove",  name:"polygon_AtWrongPlace"
             });
             
-           
+            viewer.inputHandler.emit('isMeasuring', false, 'stopInsertion')
+            
             e.remove || callback && callback()  
             /* this.viewer.dispatchEvent({
                 type: 'finish_inserting_measurement',
@@ -481,7 +482,7 @@ export class MeasuringTool extends EventDispatcher{
                     pressDistance:0,
                     button : THREE.MOUSE.RIGHT  
                 });
-                
+                 
             }else{
                 end({finish:true, remove:e.remove})  //未结束时添加新的measure时会触发
             }
@@ -559,6 +560,7 @@ export class MeasuringTool extends EventDispatcher{
         
         //点击第n下拥有n+1个marker, n>0
         
+        viewer.inputHandler.emit('isMeasuring', true, 'startInsertion')
         
         this.viewer.addEventListener('global_click', click, 10)//add importance:10
             

src/start.js

@@ -127,15 +127,15 @@ var start = function(dom, mapDom, number, fileServer, webSite){ //t-Zvd3w0m
                              position: new THREE.Vector3().addVectors(position,new THREE.Vector3(0,0,0.3)),
                              positionStyle : 2 ,  /* velocityStyle:2,  */
                              positionRadius : 0.3,                        
-                             sizeTween: [[0, 0.3, 0.9, 1], [0.1, 0.2,  2,   1]],
+                             sizeTween: [[0, 0.3, 0.9, 1], [0.05, 0.1,  1,   0.8]],
                              opacityBase : 0.2,
                              opacityTween :[ [0, 0.3,  0.7, 0.95], [0, 0.2, 1 , 0.1, 0] ], 
                              velocityBase     : new THREE.Vector3( 0,  0,  1),
                              velocitySpread   : new THREE.Vector3( 0.2, 0.2, -0.3), 
-                             accelerationBase : 0.1,
-                             accelerationSpread : 0.5,	
+                             accelerationBase : 0.2,
+                             accelerationSpread : 0.7,	
                              
-                             particlesPerSecond : 40,
+                             particlesPerSecond : 30,
                              particleDeathAge   : 3.0,                         
                         })
                         
@@ -145,7 +145,7 @@ var start = function(dom, mapDom, number, fileServer, webSite){ //t-Zvd3w0m
                              position: new THREE.Vector3().addVectors(position,new THREE.Vector3(0,0,0.3)), 
                              size: 0.1,
                             sizeRange: 0.3,
-                            sizeTween:[[0, 0.05, 0.3, 0.45], [0, 0.05, 0.2, 0.1] ],
+                            sizeTween:[[0, 0.05, 0.3, 0.45], [0, 0.02, 0.1, 0.05] ],
                             speed : 1,            //sphere
                             speedRange : 4,
                             positionRadius: 0.1,

src/utils.js

@@ -428,9 +428,26 @@ export class Utils {
 		let closestIntersection = null;
 		let closestPoint = null;
 		
-		for(let pointcloud of pointclouds){
+        
+        let density
+        let sizeType
+        if(params.isMeasuring){ 
+            density = Potree.settings.pointDensity 
+            Potree.settings.pointDensity = 'magnifier' 
+             
+            pointclouds.forEach(e=>{//因为全景模式的pointSizeType是fixed所以要还原下
+                sizeType = e.material.pointSizeType  
+                e.material.pointSizeType = Potree.config.material.pointSizeType  
+            }) 
+            Potree.updatePointClouds(pointclouds,  camera, viewport.resolution );
+        }
+        
+		for(let pointcloud of pointclouds){ 
+            
 			let point = pointcloud.pick(viewer, camera, ray, pickParams);
 			
+            viewport.afterRender
+            
 			if(!point){
 				continue;
 			}
@@ -445,6 +462,16 @@ export class Utils {
 			}
 		}
 
+
+        if(params.isMeasuring){
+            Potree.settings.pointDensity = density
+            
+            pointclouds.forEach(e=>{
+                e.material.pointSizeType = sizeType
+            })
+        }
+
+
 		if (selectedPointcloud) {
 			return {
 				location: closestIntersection,
@@ -455,31 +482,18 @@ export class Utils {
 		} else {
 			return null;
 		}
+        
 	}
 
-	/* static pixelsArrayToImage (pixels, width, height) {
-		let canvas = document.createElement('canvas');
-		canvas.width = width;
-		canvas.height = height;
-
-		let context = canvas.getContext('2d');
+	static renderTargetToDataUrl(renderTarget, width, height, renderer, compressRatio = 0.7){
+        let pixelCount = width * height;
+        let buffer = new Uint8Array(4 * pixelCount);
 
-		pixels = new pixels.constructor(pixels);
-
-		for (let i = 0; i < pixels.length; i++) {
-			pixels[i * 4 + 3] = 255;
-		}
-
-		let imageData = context.createImageData(width, height);
-		imageData.data.set(pixels);
-		context.putImageData(imageData, 0, 0);
-
-		let img = new Image();
-		img.src = canvas.toDataURL();
-		// img.style.transform = "scaleY(-1)";
-
-		return img;
-	} */
+        renderer.readRenderTargetPixels(renderTarget, 0, 0, width, height, buffer);
+        var dataUrl = Potree.Utils.pixelsArrayToDataUrl(buffer, width, height, compressRatio)
+        return dataUrl
+        
+    } 
 
 	static pixelsArrayToDataUrl(pixels, width, height, compressRatio = 0.7) {
 		let canvas = document.createElement('canvas');
@@ -515,36 +529,7 @@ export class Utils {
 		return dataURL;
 	}
 
-	/* static pixelsArrayToCanvas(pixels, width, height){
-		let canvas = document.createElement('canvas');
-		canvas.width = width;
-		canvas.height = height;
-
-		let context = canvas.getContext('2d');
-
-		pixels = new pixels.constructor(pixels);
-
-		//for (let i = 0; i < pixels.length; i++) {
-		//	pixels[i * 4 + 3] = 255;
-		//}
-
-		// flip vertically
-		let bytesPerLine = width * 4;
-		for(let i = 0; i < parseInt(height / 2); i++){
-			let j = height - i - 1;
-
-			let lineI = pixels.slice(i * bytesPerLine, i * bytesPerLine + bytesPerLine);
-			let lineJ = pixels.slice(j * bytesPerLine, j * bytesPerLine + bytesPerLine);
-			pixels.set(lineJ, i * bytesPerLine);
-			pixels.set(lineI, j * bytesPerLine);
-		}
-
-		let imageData = context.createImageData(width, height);
-		imageData.data.set(pixels);
-		context.putImageData(imageData, 0, 0);
-
-		return canvas;
-	} */
+ 
 
 	static removeListeners(dispatcher, type){
 		if (dispatcher._listeners === undefined) {

src/viewer/viewer.js

@@ -555,12 +555,13 @@ export class Viewer extends ViewerBase{
                         cameraFar = far
                     }
                 }
-            })
-            
-            
+            }) 
             
         }
         
+        
+        
+        
          
 	}
 
@@ -2747,9 +2748,9 @@ export class Viewer extends ViewerBase{
             viewer.mapViewer.needRender = true 
             
             
-            var { buffer  } = this.makeScreenshot( new THREE.Vector2(width,height)  );
+            var { dataUrl  } = this.makeScreenshot( new THREE.Vector2(width,height), null, compressRatio    );
         
-            var dataUrl = Potree.Utils.pixelsArrayToDataUrl(buffer, width, height, compressRatio)
+             
             
             if(!Potree.settings.isOfficial){
                 Common.downloadFile(dataUrl, 'screenshot.jpg') 

src/viewer/viewerBase.js

@@ -224,7 +224,7 @@ export class ViewerBase extends EventDispatcher{
     
     
     
-    makeScreenshot( size,  viewports, callback){//暂时不要指定viewports渲染，但也可以
+    makeScreenshot( size,  viewports, compressRatio){//暂时不要指定viewports渲染，但也可以
         
        
         let {width, height} = size;
@@ -258,22 +258,26 @@ export class ViewerBase extends EventDispatcher{
             height, 
             resize :true //需要resize
         });
-
-		let pixelCount = width * height;
+        let dataUrl = Potree.Utils.renderTargetToDataUrl(target, width, height, this.renderer, compressRatio)
+        
+        
+		/* let pixelCount = width * height;
 		let buffer = new Uint8Array(4 * pixelCount);
 
 		this.renderer.readRenderTargetPixels(target, 0, 0, width, height, buffer);
 
-        callback && callback(buffer) 
+        let dataUrl = Potree.Utils.pixelsArrayToDataUrl(buffer, width, height, compressRatio) */
+
+ 
 		target.dispose();
         
         //resize back 
         //this.updateScreenSize({forceUpdateSize:true})   
         
 		return {
-			width: width,
-			height: height,
-			buffer: buffer
+			width, 
+			height,
+			dataUrl 
 		};
 	}