@eturnity/eturnity_3d 0.0.6 → 0.0.7

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@eturnity/eturnity_3d",
   "private": false,
-  "version": "0.0.6",
+  "version": "0.0.7",
   "main": "dist/main.js",
   "scripts": {
     "dev": "vue-cli-service serve --skip-plugins @vue/cli-plugin-eslint",

package/src/components/ThreeCanvasViewer.vue

@@ -62,7 +62,7 @@ export default {
     this.renderer.domElement.style.width = '100%'
     this.renderer.domElement.style.height = '100%'
 
-    this.initialiseThree()
+    this.initialiseThree(false)
     this.loadProjectionMaterial()
     this.initialiseThreeMap()
     await this.loadTextureFromModuleFields()

package/src/helper/threeMixin.js

@@ -20,50 +20,49 @@ export default {
       }
       
       //add background_map
-        this.background_map=new THREE.Group();
-        //plane
-        let sizeInMm={width:2000000,height:2000000}
-        
-        if(this.layoutSettings.background_map_settings && this.layoutSettings.background_map_settings.sizeInMm){
-          sizeInMm=this.layoutSettings.background_map_settings.sizeInMm
-        }
-        let planeGeometry = new THREE.PlaneGeometry(sizeInMm.height/1000, sizeInMm.width/1000)
-        let planeMaterial = new THREE.MeshBasicMaterial( {
-          color: 0xf0f0f0,
-          opacity: 1
-        })
-        this.meshes.backgroundMesh = new THREE.Mesh(planeGeometry, planeMaterial)
-        
-        this.meshes.backgroundMesh.position.z=0.1
-        
-        //helper grid
-        let helper = new THREE.GridHelper(2000, 100)
-        helper.material.opacity = 0.25
-        helper.material.transparent = true
-        helper.rotateX(-Math.PI / 2)
-        helper.position.z=-0.1
-        this.scene.add(helper)
-        this.background_map.add( this.meshes.backgroundMesh )
-        this.background_map.add( helper )
-        clearThreeObjects(helper)
-        helper=null
-    
-        //Extention of the map with geo-map
-        if(this.selectedMapLayer && !['googleLayerRoadmap','googleLayer','googleLayerTerrain'].includes(this.selectedMapLayer.key)){
-          this.provider = new CustomProvider('',this.selectedMapLayer.key);
-
+      this.background_map=new THREE.Group();
+      //plane
+      let sizeInMm={width:2000000,height:2000000}
+      
+      if(this.layoutSettings.background_map_settings && this.layoutSettings.background_map_settings.sizeInMm){
+        sizeInMm=this.layoutSettings.background_map_settings.sizeInMm
+      }
+      let planeGeometry = new THREE.PlaneGeometry(sizeInMm.height/1000, sizeInMm.width/1000)
+      let planeMaterial = new THREE.MeshBasicMaterial( {
+        color: 0xf0f0f0,
+        opacity: 1
+      })
+      this.meshes.backgroundMesh = new THREE.Mesh(planeGeometry, planeMaterial)
+      
+      this.meshes.backgroundMesh.position.z=0.1
+      
+      //helper grid
+      let helper = new THREE.GridHelper(2000, 100)
+      helper.material.opacity = 0.25
+      helper.material.transparent = true
+      helper.rotateX(-Math.PI / 2)
+      helper.position.z=-0.1
+      this.scene.add(helper)
+      this.background_map.add( this.meshes.backgroundMesh )
+      this.background_map.add( helper )
+      clearThreeObjects(helper)
+      helper=null
+  
+      //Extention of the map with geo-map
+      if(this.selectedMapLayer && !['googleLayerRoadmap','googleLayer','googleLayerTerrain'].includes(this.selectedMapLayer.key)){
+        this.provider = new CustomProvider('',this.selectedMapLayer.key);
         // Create the map view and add it to your THREE scene
         this.three_map = new MapView(MapView.PLANAR, this.provider);
         this.three_map.rotateX(Math.PI / 2)
         const coef=Math.cos(this.layoutSettings.layout_latitude*Math.PI/180)
         this.three_map.scale.set(2*20015111.9287618*coef, 1, 2*20015111.9287618*coef);
         var coords = UnitsUtils.datumsToSpherical(this.layoutSettings.layout_latitude, this.layoutSettings.layout_longitude)
-        
         this.three_map.position.set(-coords.x*coef,-coords.y*coef,-0.1)
         this.scene.add(this.three_map)
+      }else{
+
       }
       this.scene.add(this.background_map)
-    
     },
     initSky() {
       // Add Sky
@@ -90,7 +89,7 @@ export default {
       uniforms['sunPosition'].value.copy(sun)
       sun=null
     },
-    initialiseThree() {
+    initialiseThree(isInteractive = true) {
 
       //this.loader.crossOrigin = null 
       
@@ -126,8 +125,10 @@ export default {
       
       //sky
       this.initSky()
-      this.orbitControl=new OrbitControls(this.camera, this.renderer.domElement)
-      this.orbitControl.maxPolarAngle=Math.PI/2
+      if(isInteractive){
+        this.orbitControl=new OrbitControls(this.camera, this.renderer.domElement)
+        this.orbitControl.maxPolarAngle=Math.PI/2
+      }
       window.addEventListener('resize', this.onWindowResize, false)
     
       ambientLight.dispose()