potree-sdk/src/custom/objects/Sprite.js

import * as THREE from "../../../libs/three.js/build/three.module.js";
import DepthBasicMaterial from "../materials/DepthBasicMaterial.js";
import math from "../utils/math.js";

const geo = new THREE.PlaneBufferGeometry(1,1)
export default class Sprite extends THREE.Mesh{
    
    constructor(options={}){  
        super(geo, options.mat || new DepthBasicMaterial(options))/* ({map:options.map, useDepth:options.useDepth})) */
         
        this.root = options.root || this;
        this.renderOrder = options.renderOrder != void 0 ? options.renderOrder : 4;
        this.pickOrder = options.pickOrder || 0
        this.sizeInfo = options.sizeInfo
        this.dontFixOrient = options.dontFixOrient
        this.options = options
        this.lineDir = options.lineDir
        
        this.root.matrixAutoUpdate = false;
        this.matrixMap = new Map()
        this.name = options.name || 'sprite'
        this.useViewport = null
        this.viewports = options.viewports//指定更新的viewports
        this.visible_ = true
        
        
        let update = (e)=>{
            //this.update(e)
            this.needsUpdate = true
        }
        viewer.mapViewer && viewer.mapViewer.addEventListener("camera_changed",  update) 
        viewer.addEventListener("camera_changed",  update) 
        /* if(viewer.viewports.length == 1){//直接更新。如果有多个不在这更新，在"render.begin"
            this.update(e)
        } */
         
        
        let 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时要禁止吗
            
        this.addEventListener('dispose', ()=>{
            viewer.mapViewer && viewer.mapViewer.removeEventListener("camera_changed",  update) 
            viewer.removeEventListener("camera_changed",  update) 
            viewer.removeEventListener("raycaster", applyMatrix)        //before render
            viewer.removeEventListener("render.begin", applyMatrix)
             
            this.dispose()
        })
         
    }
    
    set visible(v){
        this.visible_ = v  
        if(v){
            this.update()
        }
    }
    get visible(){
        return this.visible_ 
    }
    
    realVisible(){
        let v = true 
        let parent = this 
        let lastParent
        while(parent){
            if(parent.visible === false){
                v = false
                break; 
            }
            lastParent = parent
            parent = parent.parent
        }
         
        if(v && !(lastParent instanceof THREE.Scene)){//已被删除
            v = false
        }            
         
        /* if(!this.latestRealVisi && v){//变为可见后先update 
            this.latestRealVisi = true
            setTimeout(()=>{
                this.update()                           -----删掉是因为更新时返回false导致无法立即更新
            },1)//延迟 防止无限调用
            return false
        } 
        
        this.latestRealVisi = v*/
        return v;
    }
    
    update(e={}){
        if(!e.viewport){
            let viewports = this.viewports || viewer.viewports
            if(!viewports)return
            viewports.forEach(view=>{
                this.update({viewport:view}) 
            })
            return;
        }
        if(!this.root || ! this.realVisible() /* this.visible */ )return
        if(this.viewports && !this.viewports.includes(e.viewport) )return
        if(e.viewport.name == 'magnifier')return
        
        let camera = e.viewport.camera
        //rotation
        
        if(!this.dontFixOrient){        //orthoCamera一般要加dontFixOrient 
            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, 'notTrueSide', 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<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, 'notTrueSide', false), console.log('  !r2.trueSide', )
                }
                //Potree.Utils.updateVisible(this, 'notTrueSide', 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) 
            }
        
        }
        
        //scale
        var info = this.sizeInfo
        if(info){
            this.root.updateMatrix();//先更新，getWorldPosition才能得到正确的
            this.root.updateMatrixWorld(true)
            
            
            var scale
            if(info.nearBound == void 0 && info.farBound != void 0 || info.nearBound != void 0 && info.farBound == void 0){//仅限制最大或最小的话，不判断像素大小，直接限制mesh的scale
                //这个判断也可以写到getScaleForConstantSize里，可以更严谨控制像素宽度，这里只简单计算大小
                var dis = camera.position.distanceTo(this.root.getWorldPosition(new THREE.Vector3()))
                if(info.farBound == void 0 && dis < info.nearBound){
                    scale = info.scale * dis / info.nearBound
                }else if(info.nearBound == void 0  && dis > info.farBound){
                    scale = info.scale * dis / info.farBound
                }else{
                    scale = info.scale
                }
            }else{ 
                scale = math.getScaleForConstantSize($.extend(info,{//规定下最小最大像素 
                    camera , position:this.root.getWorldPosition(new THREE.Vector3()) ,
                    resolution: e.viewport.resolution//2
                })) 
            } 
            
            if(!isNaN(scale)){
                this.root.scale.set(scale, scale, scale); 
            } 
        }
        this.root.updateMatrix();
        this.root.updateMatrixWorld(true)
        this.matrixMap.set(e.viewport, this.root.matrix.clone())
        
        this.useViewport = e.viewport
    }
    
    applyMatrix(e){
         
        if(!e)e = {viewport:viewer.mainViewport}//随便写一个viewport 
        if(e.viewport.name == 'magnifier')return
        /* if(this.name == 'measure_point'){
            console.log(1)
        } */
        
        if(this.viewports && !this.viewports.includes(e.viewport) )return
        if( !this.root || !this.realVisible()  )return
        
        var matrix = this.matrixMap.get(e.viewport);
          
        if(!matrix){
            this.update(e)
            matrix = this.matrixMap.get(e.viewport);
            if(!matrix)return
        }
        
        if(e.viewport == this.useViewport){
            return
        }       
        this.useViewport = e.viewport   
        this.root.matrix.copy(matrix) 
        this.root.updateMatrixWorld(true)
        //console.log(this.root.name + e.viewport.name + " : "+this.root.matrixWorld.elements)
    }
    
    
     
    
    
    setUniforms(name,value){
        this.material.setUniforms(name,value) 
    }
    
     
    dispose(){
        this.removeAllListeners()
        this.parent && this.parent.remove(this)
    }
}