import * as THREE from "../../libs/three.js/build/three.module.js"; import {MOUSE} from '../defines.js' import {transitions, easing, lerp} from '../utils/transitions.js' import math from '../utils/math.js' let texLoader = new THREE.TextureLoader() let defaultOpacity = 0.7 //鼠标指示小圆片 export default class Reticule extends THREE.Mesh{ constructor(viewer){ var defaultTex = texLoader.load(Potree.resourcePath+'/textures/whiteCircle.png'/* reticule-256x256.png' */) var crosshairTex = texLoader.load(Potree.resourcePath+'/textures/reticule_cross_hair.png') super(new THREE.PlaneBufferGeometry(0.15,0.15,1,1),new THREE.MeshBasicMaterial({ side: THREE.DoubleSide , map: defaultTex, transparent:true, depthTest: !1, opacity: defaultOpacity, //depthWrite: !1, })) //this.layers.set(0/* RenderLayers.RETICULE */); this.renderOrder = 0 this.layers.set(Potree.config.renderLayers.marker); this.direction = new THREE.Vector3; this.hidden = !0; this.mouseLastMoveTime = Date.now(); //viewer.inputHandler.addInputListener(this); viewer.addEventListener('global_mousemove',this.move.bind(this)) viewer.addEventListener('measureMovePoint',()=>{ this.material.map = crosshairTex this.state = 'crosshair' }) viewer.addEventListener('endMeasureMove',()=>{ this.material.map = defaultTex this.state = 'default' }) this.state = 'default' viewer.setObjectLayers(this, 'reticule' ) } move(e){ if(e.buttons == MOUSE.NONE || this.state == 'crosshair' ){//按下时不更新,除非拖拽测量 this.hidden = false, this.mouseLastMoveTime = Date.now() this.updatePosition(e.intersectPoint, e.hoverViewport) } } hide(){ //console.log("hide Reticule") this.hidden || (this.hidden = !0, transitions.start(lerp.property(this.material , "opacity", 0), 500)) } show(){ if(!this.visible)return //console.log("show Reticule") this.hidden = !1, this.material.opacity <= 0 && transitions.start(lerp.property(this.material, "opacity", defaultOpacity), 300) } //鼠标静止一段时间它就会消失 updateVisible(){ Date.now() - this.mouseLastMoveTime > 1500 && !this.hidden && this.hide() } updatePosition(intersectPoint, viewport ){ //在地图(当地图融合到viewer时)和场景里都显示且完全相同(大小可能不同) if (!this.hidden && this.visible) { if (!intersectPoint /* || !intersectPoint.point.normal */) return //this.hide(); var atMap = !intersectPoint.location let normal = intersectPoint.point ? new THREE.Vector3().fromArray(intersectPoint.point.normal ) : new THREE.Vector3(0,0,1)//地图无normal let s, camera let location = intersectPoint.location || intersectPoint.orthoIntersect.clone() if(!atMap){ camera = viewport.camera let n = camera.position.distanceTo(location) s = 1 + .01 * n; n < 1 && (s -= 1 - n) }else{ camera = viewer.mapViewer.camera s = math.getScaleForConstantSize({width2d:300, position:location, camera, resolution:viewport.resolution2} ) location.setZ(0);//低于相机高度即可 } this.show(); this.scale.set(s, s, s); this.direction = this.direction.multiplyScalar(.8); this.direction.add(normal.clone().multiplyScalar(.2)); this.position.copy(location).add(normal.clone().multiplyScalar(.01)); this.lookAt(this.position.clone().add(this.direction)); } } }