bill
/
potree-sdk


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189
							<!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>Potree Viewer</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>

<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>
    <!-- <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 
    var changeLog = ()=>{  
             
        var textarea = document.createElement('textarea');
        textarea.id = "consoleLog";

        textarea.style.width = '160px';
        textarea.style.height =  '200px'
        textarea.style.position = 'fixed'
        textarea.style.left = 0
        textarea.style.bottom = '50px'
        textarea.style['z-index'] = 9999;
        textarea.style.color = 'black';
        textarea.style.opacity = 0.9;
        textarea.style['font-size'] = '12px';
        textarea.style['backgroundColor'] = '#ffffff'


        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 () {
          var args =   Array.from(arguments)
          console["old" + o].apply(this, arguments)
          var t = document.getElementById("consoleLog").innerHTML;
          
          var str = ''
          args.forEach(a=>{
              str += a + ' '
          })
          document.getElementById("consoleLog").innerHTML = str + "\n\n" + t;
        }
        }

        for (var i = 0; i < list.length; i++) {
            exchange(list[i])
        }  
    }
    Potree.browser.isMobile()  && changeLog() 
        
    var number = browser.urlHasValue('m',true);
    if(number == '') number = '1'
    let viewer = new Potree.Viewer(document.getElementById("potree_render_area"), null,{noMap:true}  ); 
    //Potree.config.splatEnableSwapOut = 1
    let cloudPath = Potree.resourcePath + '/../data/webcloud/'+number+'/cloud.js'
    Potree.loadPointCloud(cloudPath, '1' ,'', 0, e => {
        let scene = viewer.scene;
        let pointcloud = e.pointcloud; 
        let config = Potree.config.material
        let material = pointcloud.material; 
        
        
        pointcloud.dataset_id = 0;//供漫游点找到属于的dataset点云
        material.minSize =  config.minSize
        material.maxSize =  config.maxSize   
        material.pointSizeType = /*   Potree.settings.isOfficial ?   */ config.pointSizeType    /* : 'ADAPTIVE'    */   //Potree.PointSizeType[config.pointSizeType]//Potree.PointSizeType.ADAPTIVE;//FIXED
        pointcloud.changePointSize(config.realPointSize)  //material.size =  config.pointSize;
        pointcloud.changePointOpacity(1)
        material.shape = Potree.PointShape.SQUARE; 
        scene.addPointCloud(pointcloud);
      
        viewer.scene.axisArrow.visible = true
        //viewer.background.g = 0.8
        viewer.updateModelBound()
        Potree.settings.pointDensity = 'high'
    
        
        Potree.pointBudget = Potree.config.maxSplatCount = Potree.browser.isMobile() ? 1200000: 2600000//2560000  //为什么我的手机chrome最多870000，否则显示不出, 去掉swapBuffer后该值上升到1250000. 通过减少WebAssembly的page数量，该值又上升到2560000
        Potree.settings.maxLRUPoints = Potree.browser.isMobile() ? 5000000 : 10000000
        
        viewer.setFOV(90)
         
        
        viewer.dispatchEvent('allLoaded')
        Potree.settings.editType = 'pano'
        
        pointcloud.matrixAutoUpdate = true 
        pointcloud.rotation.x = -Math.PI/2 
        pointcloud.position.z += 5
        pointcloud.updateMatrixWorld()
        
        
        viewer.splatMesh = new Potree.Splat({/*splatAdaptiveSize:true*/})
        //viewer.splatMesh.splatAttrSameMemory = 1
        
        
        //setTimeout(()=>{  
            
            viewer.splatMesh.addPointcloud(pointcloud)
            //viewer.splatMesh.material.uniforms.splatScale.value = 2
            viewer.splatMesh.rotation.x = -Math.PI/2 
            viewer.splatMesh.position.copy(viewer.scene.pointclouds[0].position)
            viewer.splatMesh.updateMatrixWorld()
            //viewer.scene.pointclouds[0].visible = false //这样的话visibleNode会空的
            //pointcloud.material.opacity = 0
            //viewer.setControls(viewer.orbitControls)
            viewer.mainViewport.view.radius = 50
            //viewer.splatMesh.updateSort()
            viewer.objs.add(viewer.splatMesh)
            viewer.splatMesh.transformCallBack()
        //},3000)
        
        //viewer.splatMesh.switchAttrUpdateType(0)
    })
    
    
    $('#mapGaode').hide()
    
    
    if(number == 2){
    
        viewer.mainViewport.view.position.copy({
            "x": -36.62326905272484,
            "y": 26.80552611959561,
            "z": -50.20190987018996
        })
        viewer.mainViewport.view.quaternion = new THREE.Quaternion().fromArray([
            0.4046133492786237,
            -0.3738127361560443,
            -0.5663550849489183,
            0.6130203859787777
        ]) 
    }
    
    
    //放到线上了 https://www.4dmodel.com/test/potree_bak/examples/3dgsUseCloud.html?m=0
    
    
	</script>
	
	
  </body>
</html>