bill
/
potree-sdk


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300
							<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="utf-8">
	<meta name="description" content="">
	<meta name="author" content="">
	<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
	<title>splatter</title>

	<link rel="stylesheet" type="text/css" href="../../build/potree/potree.css">
	<link rel="stylesheet" type="text/css" href="../../libs/jquery-ui/jquery-ui.min.css">
	<link rel="stylesheet" type="text/css" href="../../libs/openlayers3/ol.css">
	<link rel="stylesheet" type="text/css" href="../../libs/spectrum/spectrum.css">
	<link rel="stylesheet" type="text/css" href="../../libs/jstree/themes/mixed/style.css">
</head>
<style>
    #consoleLog{ 
      width: 30%;
      height: 130px;
      position: absolute;
      right: 0px;
      bottom: 45px;
      z-index: 999999;
      color: "321";
      opacity: 0.9;
        font-size: 10px;
        
    }
    #move_Btns{
        position: fixed;
        bottom: 10px;
        width: 60px;
        left: 3px;
        height: 200px;
        z-index: 90;
        display: grid;
    }
    #move_Btns>button{
        transform: rotate(90deg);
        position: relative; 
        font-size: 29px;
        user-select: none;
    }
    #move_Btns span{
        pointer-events:none;
    }
</style>
<body>
	<script src="../../libs/jquery/jquery-3.1.1.min.js"></script>
	<script src="../../libs/spectrum/spectrum.js"></script>
	<script src="../../libs/jquery-ui/jquery-ui.min.js"></script>
	<script src="../../libs/other/BinaryHeap.js"></script>
	<script src="../../libs/tween/tween.min.js"></script>
	<script src="../../libs/d3/d3.js"></script>
	<script src="../../libs/proj4/proj4.js"></script> 
	
    
	<script src="../../libs/openlayers3/ol.js"></script>
	<script src="../../libs/i18next/i18next.js"></script>
	<script src="../../libs/jstree/jstree.js"></script>
	<script src="../../build/potree/potree.js"></script>
	<script src="../../libs/plasio/js/laslaz.js"></script>
	
	<!-- <script src="../../libs/stats.js/stats.js"></script> -->
	<div class="potree_container" style="position: absolute; width: 100%; height: 100%; left: 0px; top: 0px; ">
		<div id="potree_render_area" style="background-image: url('../../build/potree/resources/images/background.jpg');">
            
		</div>
		<div id="potree_sidebar_container"> </div>
	</div>
    <!-- <div id='move_Btns'  >
        <button name='forward2' > <span><<</span></button>
        <button name='forward' > <span><</span></button>
        <button name='backward' ><span>></span></button>
        <button name='backward2' ><span>>></span></button>
    </div> -->
    <!-- <script src="https://webapi.amap.com/maps?v=2.0&key=4578048f6e03386759d5609401e738d3"></script> -->
	<script type="module">

	//import * as THREE from "../libs/three.js/build/three.module.js";
    import browser from '../src/custom/utils/browser.js' //这里必须加.js
    //window.THREE = THREE 
    
    Potree.settings.showStats  = true
    Potree.config.view.near = 0.001,  Potree.config.view.far = 1e3  //same as splatter 
    let log = 0// browser.isMobile() 
    if(log){//
        //window.addEventListener("load", ()=>{
            var textarea = document.createElement('textarea');
            textarea.id = "consoleLog";

            document.getElementsByTagName("body")[0].appendChild(textarea);
            var list = ["log", "error", "warn", "debug", "info", "time", "timeEnd"]
            var exchange = function (o) {
                console["old" + o] = console[o];
                console[o] = function () {
                    console["old" + o].apply(this, arguments)
                    let str = ''
                    for(let i=0;i<arguments.length;i++){
                        str += arguments[i] + ' '
                    }
                    textarea.innerHTML = str + "\n\n" + textarea.innerHTML;
                }
            }

            for (var i = 0; i < list.length; i++) {
                exchange(list[i])
            }  
             
        //}) 
        
        /*{
            
            let btns = document.querySelector('#move_Btns')    
            Array.from(btns.children).forEach((e,i)=>{
                let name = i<2 ? 'FORWARD' : 'BACKWARD'  
                let f = (ev)=>{
                    ev.preventDefault()
                     ev.stopPropagation()
                    viewer.inputHandler.pressedKeys[viewer.controls.keys['FORWARD'][0]] = 0
                    viewer.inputHandler.pressedKeys[viewer.controls.keys['BACKWARD'][0]] = 0
                }
                let pointerdown = (ev)=>{
                    f(ev)
                    viewer.inputHandler.pressedKeys[viewer.controls.keys[name][0]] = 1;
                     (i==1||i==2) && (viewer.inputHandler.pressedKeys[viewer.controls.keys['ALT'][0]] = 1)
                    //viewer.inputHandler.pressedKeys[viewer.controls.keys['SPACE'][0]] = 1
                    
                }
                let pointerup = (ev)=>{
                    f(ev) 
                    viewer.inputHandler.pressedKeys[viewer.controls.keys['ALT'][0]] = 0
                    //viewer.inputHandler.pressedKeys[viewer.controls.keys['SPACE'][0]] = 0
                }
                e.addEventListener('pointerdown',pointerdown)
                e.addEventListener('pointerup', pointerup)
                e.addEventListener('pointerout', pointerup)
            })  
            
            
        }*/
        
    }
    
    var splatId = browser.urlHasValue('m',true)  
    var urlAtSplatter = !browser.urlHasValue('urlAtCurrent') ; 
    
    //Potree.settings.ctrlRotInvSmooth = true
    Potree.settings.firstCtrlRotSmooth = true 
    Potree.settings.rotAroundPoint = false  
    Potree.settings.noAA = true 
    
    //Potree.start(document.getElementById("potree_render_area"),null, null,{noMap:true}); 
    new Potree.Viewer(document.getElementById("potree_render_area") , null, {noMap:true, enableJoy:true});
    viewer.background.set('#000')
    Potree.settings.orbitCtlMoveFree = true
    let dom = document.querySelector('#mapGaode')
    if(dom){
        //viewer.splatter.logArea = dom 
        dom.style.height = '134px',         dom.style.width = '200px'
        dom.style['font-size'] = '14px'
        
        window.logAreaTool = {
            area: dom,
            list:{},
            change(name, text, level=0){
                this.list[name] = {text, level}
                this.update()
            },
            remove(name){
                delete this.list[name]
                this.update()
            },
            update(){
                let text = ''
                let objects = Object.values(this.list)
                objects.sort((a,b)=>{return b.level - a.level})
                for(let i=0, len=objects.length; i<len; i++){
                    text += objects[i].text + '<br>'
                }
                this.area.innerHTML = text
            }
        }
    } 
 
    if(splatId === ''){
        splatId = 'SG-t-jp-zSUztbgFpmt', urlAtSplatter = true
    }
   
    let localProfile = {
        'SG-t-WSs5eaQJLoc' :{
            //view : {"yaw":-1.6062499999999997,"pitch":0.13850996852046182,"position":{"x":-42.06086329177142,"y":3.3968851133538633,"z":-1.9854159672413823}}
             view : {"yaw":-1.6034087578950877,"pitch":0.1454619081473329,"position":{"x":-41.71435321819845,"y":3.2051723875245823,"z":-1.808349204344115}}
        
        }
    }[splatId]
    
    Potree.settings.number = splatId == 'rly-jb1' ? 'SG-t-WSs5eaQJLoc' : splatId
    
    
    let applyConfig = (config)=>{
        let splatter = new Potree.Splatter(viewer,config);
        splatter.visible = true        
        config.view && viewer.mainViewport.view.applyJson(config.view) 
         
    }
    
    if(splatId!=''){
        let path = browser.urlHasValue('gsPath', true) 
        if(path){
            path = Potree.Common.replaceAll(path,'{splatId}',splatId)
        }else{ 
            if(urlAtSplatter){
                path = Potree.resourcePath + '../../../../examples/tomcat/splatter.app/data/' + splatId  
            }else{
                path = Potree.resourcePath + '/../data/splatter/' + splatId 
            }
        }
        
        let dataVersion = path.includes('http') ? Date.now() : 10
        let jsonUrl = Potree.Common.joinUrl(path, 'data.json?m='+dataVersion)
        Potree.loadFile(jsonUrl,{},(e)=>{ 
            let config = Object.assign(  e, localProfile, {
                "block": 65536, 
                "root": {
                    "radius": browser.urlHasValue('radius', true) || e.radius || (browser.isMobile() ? 0.25 : 0.6),    
                    "size": e.level_0   //8326 //8534
                },
                "size": e.size || e.files*65536,   
                path,  
                dataVersion: 6,
                
            })  
        
            applyConfig(config)
            
            let btn1 = document.querySelector('#potree_render_area [value=">>全景"]')
            btn1.style.right = '27%'
            /*btn1.value = '停lod'
            btn1.onclick = ()=>{ 
                btn1.value = btn1.value == '停lod' ? '开lod' : '停lod' 
                viewer.splatter.renderer.lodder.pauseLod = btn1.value == '停lod' ? 0 : 1
            }*/
            btn1.value = '停碰撞'
            btn1.onclick = ()=>{ 
                btn1.value = btn1.value == '停碰撞' ? '开碰撞' : '停碰撞' 
                window.stopColl = btn1.value == '停碰撞' ? 0 : 1 
            }
             
            
            let btn2 = document.querySelector('#potree_render_area [value="隐藏点云"]')
            /*btn2.value = '停sort' 
            btn2.onclick = ()=>{
                btn2.value = btn2.value == '停sort' ? '开sort' : '停sort' 
                viewer.splatter.renderer.lodder.pauseSort = btn2.value == '停sort' ? 0 : 1
            }*/
            btn2.value = 'toggleMesh' 
            btn2.onclick = ()=>{ 
                viewer.collider.toggleMesh()
            }
            
            browser.urlHasValue('character') && viewer.setControls(viewer.characterCtrl)
         
         
            let modeBtn = document.createElement('input')
            btn2.parentElement.appendChild(modeBtn) 
            modeBtn.style.width = '60px'
            modeBtn.style.right = '5px' 
            modeBtn.style.top = '5px' 
            modeBtn.style['z-index'] = 10000;
            modeBtn.style['position'] = 'absolute';
            modeBtn.value = '枢轴模式'
            let firstControl = viewer.controls
            viewer.orbitControls.constantlyForward = true
            viewer.orbitControls.progression = true
            modeBtn.onclick = ()=>{ 
                modeBtn.value = modeBtn.value == '枢轴模式' ? '第一人称' : '枢轴模式' 
                viewer.setControls(modeBtn.value == '枢轴模式' ? firstControl : viewer.orbitControls)
                viewer.mainViewport.view.radius = 10 //for orbit
            }
            
            
            
        })
        
    
    } 
    Potree.settings.dblToFocusPoint = 1
    viewer.scene.axisArrow.visible = true  
    viewer.scene.axisArrow.position.z = 20
    //example: https://192.168.0.59:1234/examples/splatter.html?m=rly-jb1  
    Potree.config.view.fov = 50  
    Potree.settings.keepMinFov = true 
    viewer.setFOV(50)//原本70，在手机端比splatter的点多，增大fov会减少点
    Potree.settings.intersectWhenHover = false   //降cpu 
	</script>
	
	
  </body>
</html>