1

src/Potree.js

@@ -168,6 +168,7 @@ export async function loadFile(path, params , callback, onError){
             callback && callback(data)    
             return data 
         }catch(e){
+            console.error('loadFile出错', path)
             onError && onError(e)
         }
           
@@ -182,7 +183,7 @@ export async function loadPanos( callback){
     if(Potree.fileServer){ 
         path = '/vision.json'
     }else{
-        path = `${Potree.settings.urls.prefix1}/vision.json` 
+        path = '/floor_0_webcloud/floor_0_vision.txt'   //`${Potree.settings.urls.prefix1}/vision.json` 
     }
     return Potree.getRealUrl(path, (path)=>{
         loadFile(path, {  }, callback, )  

src/custom/materials/DepthBasicMaterial.js

@@ -22,8 +22,10 @@ export default class DepthBasicMaterial extends THREE.ShaderMaterial{
             occlusionDistance :     { type: 'f', 	value:  o.occlusionDistance || 1  }, //变为backColor距离
             maxClipFactor :  { type: 'f', 	value: o.maxClipFactor || 1 },  //0-1 
             maxOcclusionFactor :  { type: 'f', 	value: o.maxOcclusionFactor || 1 },  //0-1
-
-		}  
+            //-------add:-----
+            replaceColor : {type:'v3', value: o.replaceColor ?  new THREE.Color(o.replaceColor) : null},
+            beReplacedRed : {type:'f', value: o.beReplacedRed},
+        }  
      
         super({ 
             uniforms,
@@ -34,7 +36,7 @@ export default class DepthBasicMaterial extends THREE.ShaderMaterial{
             transparent: o.transparent == void 0 ?  true : o.transparent,
             side: o.side || 0 /* THREE.DoubleSide */, 
         })
-        
+         
         
         
         this.events = {
@@ -42,7 +44,8 @@ export default class DepthBasicMaterial extends THREE.ShaderMaterial{
                 if(!this.useDepth || !e.viewport.camera.isPerspectiveCamera || !e.viewport)return
                 let viewport = e.viewport
                 let viewportOffset = viewport.offset || new THREE.Vector2() 
-                this.uniforms.resolution.value.copy(viewport.resolution) 
+                
+                this.uniforms.resolution.value.copy(viewport.resolution)  
                 this.uniforms.viewportOffset.value.copy(viewportOffset)
             },
             render:(e)=>{//before render  如果有大于两个viewport的话，不同viewport用不同的depthTex
@@ -56,7 +59,9 @@ export default class DepthBasicMaterial extends THREE.ShaderMaterial{
             }
             
         }
-        
+        if(o.mapColorReplace){
+            this.defines.mapColorReplace = ''
+        }
      
         
         

src/custom/modules/panos/Panorama.js

@@ -103,7 +103,7 @@ class Panorama extends THREE.EventDispatcher{
         this.originPosition = new THREE.Vector3().copy(o.pose.translation) 
         this.originFloorPosition = new THREE.Vector3().copy(o.puck)
         
-        this.originID = parseInt(o.id)// uuid  "file_id":"00022"对应是原本的4dkk的id --来自vision.txt
+        this.originID = parseInt(o.uuid)//id  uuid  "file_id":"00022"对应是原本的4dkk的id --来自vision.txt
          
         this.pointcloud = viewer.scene.pointclouds[0]
         this.pointcloud.panos.push(this)

src/custom/objects/Magnifier.js

@@ -208,7 +208,7 @@ export default class Magnifier extends THREE.Object3D {//放大镜or望远镜
         }else{
             Potree.Utils.updateVisible(this, "measure", false) 
             viewer.addEventListener("measureMovePoint",()=>{//测量开始
-                //Potree.Utils.updateVisible(this, "measure", true) 
+                Potree.Utils.updateVisible(this, "measure", true) 
             })
             viewer.addEventListener("endMeasureMove",()=>{
                 Potree.Utils.updateVisible(this, "measure", false) 
@@ -236,18 +236,28 @@ export default class Magnifier extends THREE.Object3D {//放大镜or望远镜
         
         
         var playerCamera = viewer.scene.getActiveCamera()
+        
+        
+        
         var playerPos = playerCamera.position;//viewer.scene.view.getPivot()
         var dis = playerPos.distanceTo(aimPos);
         var dirToCamera = new THREE.Vector3().subVectors(playerPos, aimPos ).normalize()
         
         const fareast = 300;  
         //相机位置
-        var finalDisToAim =  dis>magDisMin ? dis > fareast ? magDisMax : (dis-magDisMin) / (fareast-magDisMin) * (magDisMax-magDisMin) + magDisMin :  dis / 2;    //dis>magDistance_ ? magDistance_ : dis / 2;
-        
+        if(playerCamera.type == 'OrthographicCamera'){
+            
+            var finalDisToAim = 2
+            
+        }else{ 
+            
+            var finalDisToAim =  dis>magDisMin ? dis > fareast ? magDisMax : (dis-magDisMin) / (fareast-magDisMin) * (magDisMax-magDisMin) + magDisMin :  dis / 2;    //dis>magDistance_ ? magDistance_ : dis / 2;
+         
+        }
         
         this.camera.position.copy(aimPos).add(dirToCamera.multiplyScalar(finalDisToAim))
         this.camera.lookAt(aimPos)
-        this.camera.fov = playerCamera.fov / 2
+        this.camera.fov = playerCamera.type == 'OrthographicCamera' ? 30 : playerCamera.fov / 2
         this.camera.updateProjectionMatrix()
         
         
@@ -260,12 +270,19 @@ export default class Magnifier extends THREE.Object3D {//放大镜or望远镜
         let screenPos = pos2d.clone().setY(pos2d.y + (pos2d.y>maxY ? -margin : margin ))
         
         let newPos = new THREE.Vector3(screenPos.x,screenPos.y,0.8).unproject(playerCamera); //z:-1朝外       
-        let dir = newPos.clone().sub(playerPos).normalize().multiplyScalar(10);//这个数值要大于playerCamera.near
-        let s =  finalDisToAim   // dis>magDisMin ? 1 : dis / magDisMin  ; 
-        
-        //let s = dis>magDisMin ? dis > fareast ? magDisMax : (dis-magDisMin) / (fareast-magDisMin) * (magDisMax-magDisMin) + magDisMin :  dis / magDisMin  
-        
-        this.position.copy(playerPos.clone().add(dir))
+        if(playerCamera.type != 'OrthographicCamera'){
+            let dir = newPos.clone().sub(playerPos).normalize().multiplyScalar(10);//这个数值要大于playerCamera.near
+            
+            this.position.copy(playerPos.clone().add(dir))
+        }else{
+            viewer.navCubeViewer.splitScreen.setShiftTarget(viewer.mainViewport, viewer.bound.center)
+            viewer.mainViewport.targetPlane.setFromNormalAndCoplanarPoint( viewer.mainViewport.view.direction.clone(), viewer.bound.center )  
+            viewer.mainViewport.targetPlane.projectPoint(newPos, viewer.mainViewport.shiftTarget )  
+            this.position.copy(viewer.mainViewport.shiftTarget.clone() ) 
+            
+            //this.position.copy(playerPos.clone().add(dir))
+        }
+        let s = finalDisToAim  
         this.quaternion.copy(playerCamera.quaternion); 
         this.targetPoint.position.copy(aimPos); 
         this.targetPoint.scale.set(s,s,s)
@@ -282,6 +299,7 @@ export default class Magnifier extends THREE.Object3D {//放大镜or望远镜
         if(!dontRender){
             this.waitRender = true
         }  
+         
         viewer.dispatchEvent('content_changed')
     }
     

src/custom/objects/Sprite.js

@@ -118,52 +118,48 @@ export default class Sprite extends THREE.Mesh{
                 
                 
                 let r1 = Potree.Utils.getPos2d(center, camera, viewer.renderArea, e.viewport); 
-                if(!r1.trueSide)return console.error('!r1.trueSide')
+                if(!r1.trueSide)return //Potree.Utils.updateVisible(this, 'notTrueSide', false); 但这句会使realVisible为false从而无法更新//console.error('!r1.trueSide') //中心点如果在背面直接不渲染了
                     
                 let r2, point2
                 
-                let p2State = '', len=1,/*  tryTimes = 0, */ p2StateHistory = []
+                let p2State = '', len=1,  p2StateHistory = []
                 while(p2State != 'got' && p2StateHistory.length<10){ 
-                    point2 = center.clone().add(lineDir).multiplyScalar(len);
+                    point2 = center.clone().add(lineDir.multiplyScalar(len));
+                     
                     r2 = Potree.Utils.getPos2d(point2, camera, viewer.renderArea, e.viewport);  
-                    if(!r2.trueSide){ 
+                    if(!r2.trueSide){ //很少遇到点2在背面的
                         if(!p2StateHistory.includes('tooLong-reverse')){
                             p2State = 'tooLong-reverse'  //先尝试反向
+                            len = -len
                         }else{
                             p2State = 'tooLong'
+                            len = len / 2
                         }
-                    }else if(r2.pos.distanceTo(r1)<5 && !p2StateHistory.includes('tooLong')){//和r1距离太近，要加长
-                     
-                        p2State = 'tooShort'
-                    }else{ 
-                        p2State = 'got'; break;
-                    }
-                     
-                    len =  p2State == 'tooLong-reverse' ? -len : p2State == 'tooLong' ?  len / 2 : p2State == 'tooShort' ? len * 3 : len
-                     
-                    p2StateHistory.push(p2State)
-                    /* tryTimes ++ */
+                    }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)
+                //console.log(p2StateHistory,len)
                 
                 if(!r2.trueSide){
-                     return console.log('  !r2.trueSide', )
+                    return //Potree.Utils.updateVisible(this, 'notTrueSide', false), console.log('  !r2.trueSide', )
                 }
-                
-                
-                /* let r1 = Potree.Utils.getPos2d(this.lineDir[0], camera, viewer.renderArea, e.viewport);
-                let r2 = Potree.Utils.getPos2d(this.lineDir[1], camera, viewer.renderArea, e.viewport);
+                //Potree.Utils.updateVisible(this, 'notTrueSide', true)
                  
-                if(!r1.trueSide || !r2.trueSide){
-                    return console.log('!r1.trueSide || !r2.trueSide', )
-                }*/
                 let p1 = r1.pos,  p2 = r2.pos
                 let vec = new THREE.Vector2().subVectors(p1,p2);
-                let angle = -vec.angle() 
-                if(p1.x < p2.x) angle += Math.PI 
+                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   )
+                //console.log(this.parent.text, THREE.Math.radToDeg(angle), p1.x < p2.x   )
             }
         
             let parentQua = this.root.parent.getWorldQuaternion(new THREE.Quaternion)
@@ -212,8 +208,13 @@ export default class Sprite extends THREE.Mesh{
     }
     
     applyMatrix(e){
-        if(!e)e = {viewport:viewer.mainViewport}//随便写一个viewport
+         
+        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
         
@@ -222,6 +223,7 @@ export default class Sprite extends THREE.Mesh{
         if(!matrix){
             this.update(e)
             matrix = this.matrixMap.get(e.viewport);
+            if(!matrix)return
         }
         
         if(e.viewport == this.useViewport){

src/custom/objects/tool/Measure.js

@@ -18,8 +18,8 @@ let highlightColor = new THREE.Color(config.measure.highlight.color);
 
 let color = new THREE.Color(config.measure.color)
 let textColor = new THREE.Color(config.measure.textColor) 
-var markerMats;  
-var lineMats;  
+var markerMats = {}  
+var lineMats   ;  
 var planeMats 
  
 const lineDepthInfo = {
@@ -71,8 +71,8 @@ export class Measure extends ctrlPolygon{
         
         
         this.name = this.measureType + this.constructor.counter  //'Measure_' + this.constructor.counter;
-           
-	 
+        //this.color = '#FF4399'   
+        this.color = new THREE.Color(this.color)
 		
 		this.markerLabels = [];
 		this.edgeLabels = [];
@@ -110,10 +110,10 @@ export class Measure extends ctrlPolygon{
 
 
         
-        
-        this.addEventListener('marker_dropped',(e)=>{ 
+        //这版应该没多数据集，不需要更新这个：
+        /* this.addEventListener('marker_dropped',(e)=>{ 
             this.updateDatasetBelong(e.index)
-        }) 
+        }) */ 
 
   
         this.addEventListener('isVisible', ()=>{
@@ -672,8 +672,15 @@ export class Measure extends ctrlPolygon{
     
     
     createEdgeLabel(name, hasHoverEvent){
+        
+        mainLabelProp.backgroundColor = {r: this.color.r*255, g: this.color.g*255, b: this.color.b*255, a:config.measure.default.opacity} 
+            
+        
         const edgeLabel = new TextSprite(
-            $.extend(hasHoverEvent ? mainLabelProp : subLabelProp,{sizeInfo: labelSizeInfo,  name:name||'edgeLabel'})
+            $.extend(hasHoverEvent ? mainLabelProp : subLabelProp,{
+                sizeInfo: labelSizeInfo,  name:name||'edgeLabel', 
+                
+            })
         )
         if(hasHoverEvent){
             edgeLabel.addEventListener('mouseover',()=>{
@@ -728,26 +735,30 @@ export class Measure extends ctrlPolygon{
     }
 
     
-    getMarkerMaterial(type) { 
-        if(!markerMats){
-            markerMats = {  
-                default:    new DepthBasicMaterial($.extend({},lineDepthInfo,{ 
-                    transparent: !0,
-                    opacity: 1,
-                    map: texLoader.load(Potree.resourcePath+'/textures/pic_point_s32.png' ), 
-                    useDepth:true 
-                })),
-                select:    new THREE.MeshBasicMaterial({  
-                    transparent: !0,
-                    opacity: 1,
-                    depthTest:false,
-                    map: texLoader.load(Potree.resourcePath+'/textures/pic_point32.png'/* , null, null, { antialias: false } */), 
-                     
-                }),   
-            }
-            Measure.markerMats = markerMats
-        }
-        return markerMats[type]
+    getMarkerMaterial(type){ 
+        let color = this.color.getHexString() 
+        if(!markerMats[type + color]){
+           
+            markerMats['default' + color] = new DepthBasicMaterial($.extend({},lineDepthInfo,{ 
+                transparent: !0,
+                opacity: 1,
+                map: texLoader.load(Potree.resourcePath+'/textures/pic_point_s32.png' ), 
+                useDepth:true,
+                replaceColor:this.color,
+                beReplacedRed: 0.184,  //0.18431372
+                mapColorReplace:true,
+            })),
+            markerMats['select' + color] = new DepthBasicMaterial($.extend({},lineDepthInfo,{ 
+                transparent: !0,
+                opacity: 1,
+                map: texLoader.load(Potree.resourcePath+'/textures/pic_point32.png' ), 
+                useDepth:true ,
+                replaceColor:this.color,
+                beReplacedRed: 0.184,   //0.18431372
+                mapColorReplace:true
+            }))  
+        }  
+        return markerMats[type + color] 
         
     }
     
@@ -755,39 +766,51 @@ export class Measure extends ctrlPolygon{
     
     
     getLineMat(type) { 
-        if(!Measure.lineMats){
-            Measure.lineMats = { 
-                edgeDefault:  LineDraw.createFatLineMat({
-                    color: config.measure.default.color, 
-                    lineWidth: config.measure.lineWidth,
-                    useDepth :true,
-                    dashWithDepth :true,  // 只在被遮住的部分显示虚线，因为实线容易挡住label 
-                    dashed :true,   
-                    dashSize : 0.04,
-                    gapSize: 0.04,    
-                    transparent: true,
-                    opacity: config.measure.default.opacity,
-                    depthTestWhenPick:true,
-                }),
-                edgeSelect:  LineDraw.createFatLineMat({
-                    color: config.measure.highlight.color,//'#f0ff00',
-                    dashSize: 0.5, 
-                    gapSize: 0.2, 
-                    lineWidth: config.measure.lineWidth  ,
-                    transparent: true,
-                    opacity: config.measure.highlight.opacity
-                }),
-                guide:   LineDraw.createFatLineMat({
-                    color:config.measure.guide.color, 
-                    dashSize: 0.1, 
-                    gapSize: 0.02,
-                    dashed: true,
-                    lineWidth: config.measure.lineWidth  
-                }) 
-                    
-            }
+    
+        if(!lineMats) Measure.lineMats = lineMats = {
+            guide:   LineDraw.createFatLineMat({
+                color:config.measure.guide.color, 
+                dashSize: 0.1, 
+                gapSize: 0.02,
+                dashed: true,
+                lineWidth: config.measure.lineWidth  
+            })      
+        }
+    
+    
+    
+    
+        let color = this.color.getHexString()
+        if(!lineMats['edgeDefault'+color]){
+            lineMats['edgeDefault'+color] =  LineDraw.createFatLineMat({
+                color: this.color, 
+                lineWidth: config.measure.lineWidth,
+                useDepth :true,
+                dashWithDepth :true,  // 只在被遮住的部分显示虚线，因为实线容易挡住label 
+                dashed :true,   
+                dashSize : 0.04,
+                gapSize: 0.04,    
+                transparent: true,
+                opacity: config.measure.default.opacity,
+                depthTestWhenPick:true,
+            }) 
+            lineMats['edgeSelect'+color] = LineDraw.createFatLineMat({
+                color: this.color,//'#f0ff00',
+                dashSize: 0.5, 
+                gapSize: 0.2, 
+                lineWidth: config.measure.lineWidth  ,
+                transparent: true,
+                opacity: config.measure.highlight.opacity
+            }) 
         }
-        return Measure.lineMats[type]
+    
+    
+        if(type != 'guide'){
+            return Measure.lineMats[type+color] 
+        }else return Measure.lineMats[type]
+        
+         
+         
         
     }
     
@@ -1059,7 +1082,7 @@ export class Measure extends ctrlPolygon{
 
 
 function setLabelHightState(label, state){
-    if(state){ 
+    /* if(state){ 
         label.backgroundColor =  {r: highlightColor.r*255, g: highlightColor.g*255, b: highlightColor.b*255, a:config.measure.highlight.opacity},
         label.backgroundColor.a = config.measure.highlight.opacity
         label.sprite.material.useDepth = false;
@@ -1069,7 +1092,21 @@ function setLabelHightState(label, state){
         label.backgroundColor.a = config.measure.default.opacity
         label.sprite.material.useDepth = true
         
+    }  */
+    
+    if(state){  
+        //label.backgroundColor =  {r: this.color[0]*255, g:  this.color[1]*255, b:  this.color[2]*255, a:config.measure.highlight.opacity},
+        label.backgroundColor.a = config.measure.highlight.opacity
+        label.sprite.material.useDepth = false;
+        
+    }else{
+        //label.backgroundColor = {r: this.color[0]*255, g:  this.color[1]*255, b:  this.color[2]*255
+        label.backgroundColor.a = config.measure.default.opacity
+        label.sprite.material.useDepth = true
+        
     } 
+    
+    
     label.updateTexture() 
     //label.sprite.material.needsUpdate = true 
 }
@@ -1235,7 +1272,7 @@ function createCircle(){
 	return line;
 
 }
-
+Measure.markerMats = markerMats;
 /* function createAzimuth(){
 
 	const azimuth = {

src/custom/objects/tool/ctrlPolygon.js

@@ -69,7 +69,7 @@ export class ctrlPolygon extends THREE.Object3D {
             }
             
             
-            if(Potree.settings.editType != 'merge'){ 
+            /* if(Potree.settings.editType != 'merge'){ 
                 if(this.datasetId != void 0){//初始化位置
                     if(this.dataset_points){
                         this.dataset_points = this.dataset_points.map(e=>{
@@ -83,7 +83,7 @@ export class ctrlPolygon extends THREE.Object3D {
                         console.log(this)
                     }
                 } 
-            }  
+            } */  
             
             this.getFacePlane()
             this.getPoint2dInfo(this.points)
@@ -106,7 +106,7 @@ export class ctrlPolygon extends THREE.Object3D {
         this.points = [...this.points.slice(0,index), o.point, ...this.points.slice(index,this.points.length)]
 		//this.points.push(o.point);
          
-        if(o.marker){
+        if(o.marker){ 
             this.add(o.marker)
             this.markers = [...this.markers.slice(0,index), o.marker, ...this.markers.slice(index,this.markers.length)]
             this.updateMarker(o.marker, o.point)

src/custom/start.js

@@ -38,9 +38,8 @@ export function start(dom, navDom, number ){ //t-Zvd3w0m
 
     {
             
-        var cloudPath = //`${Potree.settings.urls.prefix1}/${dataset.webBin}`  //webBin添加原因：每次裁剪之类的操作会换路径，因为oss文件缓存太严重，更新慢
-                        `${Potree.settings.urls.prefix1}/webcloud/cloud.js` 
-        
+        var cloudPath =  //`${Potree.settings.urls.prefix1}/webcloud/cloud.js` 
+                    `${Potree.settings.urls.prefix1}/floor_0_webcloud/cloud.js` 
          
         var timeStamp = 0   //var timeStamp = dataset.updateTime ? dataset.updateTime.replace(/[^0-9]/ig,'') : '';  //每重算一次后缀随updateTime更新一次 
  

src/custom/three.shim.js

@@ -180,22 +180,26 @@ THREE.EventDispatcher.prototype.dispatchEvent = function(event){
 	if(typeof event == 'string'){//add
         event = {type:event}
     }
+    
     if ( this._listeners === undefined ) return;
-
+    let type = event.type
+    
+    
     const listeners = this._listeners;
-    const listenerArray = listeners[ event.type ];
-
+    const listenerArray = listeners[type ];
+    
     if ( listenerArray !== undefined ) {
 
         event.target = this;
 
         // Make a copy, in case listeners are removed while iterating. 
         for(let {listener, once} of listenerArray.slice(0)){
+             
             if(once){
-                this.removeEventListener(event.type,listener)
-            }
+                this.removeEventListener(type,listener)
+            } 
             let result = listener.call(this, event);   //add stopContinue
-            
+             
             if(result && result.stopContinue){
                 break
             }

src/materials/shaders/depthBasic.fs

@@ -4,7 +4,12 @@ uniform float opacity;
 uniform vec3 baseColor;
 
 #if defined use_map
-    uniform sampler2D map; 
+    uniform sampler2D map;
+    #if defined mapColorReplace
+        uniform vec3 replaceColor;
+        uniform float beReplacedRed; 
+        
+    #endif 
 #endif
  
 #if defined(GL_EXT_frag_depth) && defined(useDepth)  
@@ -28,6 +33,36 @@ uniform vec3 baseColor;
     }
 #endif
   
+  
+vec4 getMapColor(vec4 color){
+    #if defined use_map
+        
+        vec4 mapColor = texture2D(map, vUv); 
+        
+        #if defined mapColorReplace
+            //主要为了测量线marker。 假设此图中仅有两种颜色，另一种是白色
+           
+            const vec3 mapAnotherColor = vec3(1.0,1.0,1.0);
+            //uniform vec4 replaceColor;//新的颜色 
+            
+               
+            if(mapColor.r < beReplacedRed){//要被取代的颜色
+                mapColor = vec4(replaceColor, mapColor.a);
+            }/*else if(mapColor.r>mapTextColotR){
+                mapColor = vec4(textColor, mapColor.a);
+            }*/else{//抗锯齿 过渡
+                float replaceRatio = (mapColor.r - mapAnotherColor.r) / (beReplacedRed - mapAnotherColor.r);
+                mapColor = vec4( mix(mapAnotherColor, replaceColor, replaceRatio),  mapColor.a); 
+            }
+            
+        #endif
+        
+        color *= mapColor;
+    #endif
+    return color;
+}
+  
+  
 void main() {
   
     
@@ -74,20 +109,14 @@ void main() {
         {
             discard;
         }else{
-            
-            #if defined use_map
-                color = texture2D(map, vUv) * color; 
-            #endif
-           
-            
+             
+            color = getMapColor(color);
              
             color = vec4(mix(color.rgb, backColor, mixFactor), color.a * (1.0 - clipFactor));
         }
          
     #else
-        #if defined use_map
-            color = texture2D(map, vUv) * color;
-        #endif 
+        color = getMapColor(color);
     #endif
   
     gl_FragColor = color;

src/viewer/NavigationCube.js

@@ -18,7 +18,7 @@ import {OrbitControls} from "../navigation/OrbitControlsNew.js";
  
  
  
-let splitScreen = new SplitScreen()
+
 
 
 
@@ -669,7 +669,7 @@ class NavCubeViewer extends ViewerBase{
         }) ]
         
         this.cube = new NavigationCube(this.scene,  w/2 )
-        
+        this.splitScreen = new SplitScreen()
          
         
         viewer.addEventListener('camera_changed', e => {
@@ -705,7 +705,7 @@ class NavCubeViewer extends ViewerBase{
                 viewContainsPoints:[new THREE.Vector3(0,0,0)],
                 margin:{x:300, y:250} ,
             } ]
-            splitScreen.splitStart(viewportProps)
+            this.splitScreen.splitStart(viewportProps)
         })
         
         //this.addEventListener('resize',(e)=>{console.log('resize',e)})
@@ -813,7 +813,7 @@ class NavCubeViewer extends ViewerBase{
                 navCubeViewer.controls.setEnable(false)
                  
                 //假设保持到目前中心的视角范围不变
-                splitScreen.setShiftTarget(viewer.mainViewport, viewer.bound.center)
+                this.splitScreen.setShiftTarget(viewer.mainViewport, viewer.bound.center)
                 let dis = new THREE.Vector3().subVectors(viewer.mainViewport.shiftTarget,  viewer.scene.cameraO.position).length() ;   //-nearestPano[0].score
 	                    
                 //根据2d->3d的式子逆求zoom
@@ -840,7 +840,7 @@ class NavCubeViewer extends ViewerBase{
                 
                 //假设保持到目前中心的视角范围不变
                 
-                splitScreen.setShiftTarget(viewer.mainViewport, viewer.bound.center)
+                this.splitScreen.setShiftTarget(viewer.mainViewport, viewer.bound.center)
                 viewer.mainViewport.targetPlane.setFromNormalAndCoplanarPoint( view.direction.clone(), viewer.bound.center )  
                 viewer.mainViewport.targetPlane.projectPoint(view.position, viewer.mainViewport.shiftTarget )  
                  
@@ -862,7 +862,7 @@ class NavCubeViewer extends ViewerBase{
         }
     } 
     rotateSideCamera(angle){
-        splitScreen.rotateSideCamera(viewer.mainViewport,angle)
+        this.splitScreen.rotateSideCamera(viewer.mainViewport,angle)
     }
     
 }