@eturnity/eturnity_3d 6.29.0-qa.1 → 6.29.1

package/package.json

@@ -1,14 +1,14 @@
 {
   "name": "@eturnity/eturnity_3d",
   "private": false,
-  "version": "6.29.0-qa.1",
+  "version": "6.29.1",
   "main": "dist/main.js",
   "scripts": {
     "dev": "vue-cli-service serve --skip-plugins @vue/cli-plugin-eslint",
     "build": "vue-cli-service build --skip-plugins @vue/cli-plugin-eslint"
   },
   "dependencies": {
-    "@eturnity/eturnity_maths": "6.28.0-EPDM-7663.0",
+    "@eturnity/eturnity_maths": "6.29.0",
     "axios": "^1.3.2",
     "core-js": "^2.6.12",
     "cors": "^2.8.5",

package/src/components/ThreeCanvasViewer.vue

@@ -238,14 +238,6 @@ export default {
     },
     render() {
       this.renderer.clear()
-      if (this.orbitControl) {
-        this.orbitControl.target.set(
-          this.orbitControl.target.x,
-          this.orbitControl.target.y,
-          2
-        )
-        this.orbitControl.update()
-      }
       if (['top', 'global'].includes(this.view_mode)) {
         this.renderer.render(this.scene, this.orthographicCamera)
       } else {

package/src/helper/renderMixin.js

@@ -262,7 +262,161 @@ export default {
       this.applyTextureOnRoofs()
       this.renderBackground()
     },
+<<<<<<< HEAD
+    async loadProjectionMaterial() {
+      const _this=this
+      if(!this.layoutSettings.base64_image_url) 
+      {
+        this.loader.load(require("../assets/images/white_tile.png"),(texture)=>{
+          let projectionMaterial = new ProjectedMaterial({
+            camera: _this.cameraprojection,
+            texture: texture
+          })
+        this.material.roof = projectionMaterial
+        })
+        return
+      }
+      let projectedMaterialLoaded= await new Promise((resolve,reject) => {
+        this.loader.load(this.layoutSettings.base64_image_url,(texture)=>{
+          let backgroundImageZoomLvl=_this.layoutSettings.map_zoom
+          let backgroundImageCenter={
+            lat:_this.layoutSettings.layout_latitude,
+            lng:_this.layoutSettings.layout_longitude
+          }
+          if(_this.layoutSettings.background_map_settings){
+            backgroundImageZoomLvl=_this.layoutSettings.background_map_settings.zoom_lvl
+            backgroundImageCenter={
+              lat:_this.layoutSettings.background_map_settings.lat,
+              lng:_this.layoutSettings.background_map_settings.lng
+            }
+          }
+          _this.backgroundImagesizeInMm=_this.layoutSettings.background_map_settings.sizeInMm
+          if (_this.backgroundImagesizeInMm) {
+            _this.cameraprojection.aspect =
+              _this.backgroundImagesizeInMm.width / _this.backgroundImagesizeInMm.height
+            let projectionAltitude =
+            _this.backgroundImagesizeInMm.height /
+              (2 * Math.tan((_this.cameraprojection.fov * Math.PI) / 360))
+
+
+              //set projection camera over background_map_center
+              let cameraProjectionPosition={x:0,y:0,z:projectionAltitude / 1000}
+              if(_this.layoutSettings.background_map_settings && _this.layoutSettings.background_map_settings.positionInMm){
+                // let averageLat=(_this.layoutSettings.layout_latitude+_this.layoutSettings.background_map_settings.lat)/2
+                // let deltaLat=_this.layoutSettings.background_map_settings.lat-_this.layoutSettings.layout_latitude
+                // let deltaLng=_this.layoutSettings.background_map_settings.lng-_this.layoutSettings.layout_longitude
+                // let {x:x_mm,y:y_mm}=deltaLatLngToDistance(deltaLat,deltaLng,averageLat)
+                let positionInMm=this.layoutSettings.background_map_settings.positionInMm
+                cameraProjectionPosition.x=positionInMm.x/1000
+                cameraProjectionPosition.y=positionInMm.y/1000
+              }
+            
+            _this.cameraprojection.position.set(cameraProjectionPosition.x, cameraProjectionPosition.y, projectionAltitude / 1000)
+            _this.cameraprojection.far = projectionAltitude * 16
+            _this.cameraprojection.updateProjectionMatrix()
+          }
+          
+          let projectionMaterial = new ProjectedMaterial({
+            camera: _this.cameraprojection,
+            texture: texture
+          })
+          resolve(projectionMaterial)
+        })
+      })
+      this.material.roof =projectedMaterialLoaded
+    },
+    setCameraGlobalPosition() {
+      if(this.roofs.length==0)return
+      let bounds=this.roofsBounds
+      let targetVector={x:(bounds.xMax+bounds.xMin)/2000,y:(bounds.yMax+bounds.yMin)/2000,z:0}
+      let objectRadius_m=Math.max((bounds.xMax-bounds.xMin)/2000,(bounds.yMax-bounds.yMin)/2000)
+      let distance =
+          5 + objectRadius_m / Math.sin(((this.camera.fov / 2) * Math.PI) / 180)
+      let cameraMoveVector = { x: 0, y: 0, z: distance }
+      const positionVector = addVector(targetVector, cameraMoveVector)
+      const position = [
+        positionVector.x,
+        positionVector.y - distance,
+        positionVector.z
+      ]
+      let target=[
+        targetVector.x,
+        targetVector.y,
+        targetVector.z
+      ]
+     
+      this.setTweenTo(position,target)
+    },
+    setCameraOrthogonalTo(polygon) {
+      if (polygon) {
+        let polygonRef = polygon
+        const targetVector = polygonRef.meanPoint
+        const target = [
+          targetVector.x / 1000,
+          targetVector.y / 1000,
+          targetVector.z / 1000
+        ]
+        const positionVector = addVector(
+          polygonRef.meanPoint,
+          multiplyVector(45000, polygonRef.normalVector)
+        )
+        const position = [
+          positionVector.x / 1000,
+          positionVector.y / 1000 - 1,
+          positionVector.z / 1000
+        ]
+        this.setTweenTo(position,target)
+      }
+    },
+    setCameraSideTo(polygon) {
+      if (polygon) {
+        let polygonRef = polygon
+        const targetVector = polygonRef.meanPoint
+        const target = [
+          targetVector.x / 1000,
+          targetVector.y / 1000,
+          targetVector.z / 1000
+        ]
+        let sideVector={x:-Math.cos((polygonRef.direction+45)*Math.PI/180),y:Math.sin((polygonRef.direction+45)*Math.PI/180),z: 0}
+        const positionVector = addVector(
+          polygonRef.meanPoint,
+          multiplyVector(45000, sideVector)
+        )
+        const position = [
+          positionVector.x / 1000,
+          positionVector.y / 1000,
+          positionVector.z / 1000 +5
+        ]
+        this.setTweenTo(position,target)
+      }
+    },
+    setTweenTo(position,target){
+      if (this.orbitControl) {
+        this.tweenOrbit = new TWEEN.Tween(this.orbitControl.target)
+          .to({ x: target[0], y: target[1], z: target[2] }, 2000)
+          .easing(TWEEN.Easing.Sinusoidal.Out)
+          .onUpdate(() => {
+            if(this.orbitControl){
+              this.orbitControl.update()
+            } 
+          })
+          .start()
+      }
+      if (this.camera) {
+        this.tweenCamera = new TWEEN.Tween(this.camera.position)
+          .to({ x: position[0], y: position[1], z: position[2] }, 2000)
+          .easing(TWEEN.Easing.Sinusoidal.Out)
+          .onUpdate(() => {
+            if(this.orbitControl){
+              this.orbitControl.update()
+            } 
+          })
+          .start()
+      }
+    },
+=======
   
+>>>>>>> origin/EPDM-7663
     getCanvasOffset() {
       if (!this.$refs.canvas3DContainer) return { top: 0, left: 0 }
       var box = this.$refs.canvas3DContainer.getBoundingClientRect()

package/src/store/hydrateData.js

@@ -31,6 +31,7 @@ export async function hydrateData({ state, commit }, data) {
 
   if (!!layoutSettingResponse) {
     const layoutSetting = layoutSettingResponse
+    console.log(layoutSetting)
     const moduleTextureVersionId=layoutSetting.module_texture_version_id || 0
     commit('mutate_layoutSettings', layoutSetting)
     commit('mutate_moduleTextureVersionId',moduleTextureVersionId)

package/dist/assets/theme.js

@@ -1,43 +0,0 @@
-const theme = {
-  colors: {
-    primary: '#282387',
-    secondary: '#818181',
-    tertiary: '#d5d5d5',
-    black: '#263238',
-    yellow: '#fdb813',
-    darkGray: '#818181',
-    mediumGray: '#d5d5d5',
-    lightGray: '#f2f2f2',
-    white: '#fff',
-    blue: '#48a2d0',
-    red: '#FF5656',
-    blue1: '#e4efff',
-    blue2: '#F6FAFF',
-    grey1: '#666',
-    grey2: '#c4c4c4',
-    grey3: '#b2b9c5',
-    grey4: '#dee2eb',
-    grey5: '#fafafa',
-    grey6: '#555d61',    
-    turquoise:'#20A4CA',
-    green: '#99db0c',
-    purple: '#505ca6',
-    disabled: '#dfe1e1',
-    transparentWhite1: '#ffffff32',
-    transparentBlack1: '#263238e6',
-    transparentBlue1:'#20a4cae6',
-    blueElectric:'#66dffa',
-    eturnityGrey: '#263238'
-  },
-
-  screen: {
-    mobileSmall: '345px',
-    mobile: '425px',
-    mobileLarge: '530px',
-    tablet: '768px',
-    tabletLarge: '950px'
-  },
-  borderRadius: '4px'
-}
-
-export default theme

package/dist/assets/vue.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="37.07" height="36" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 198"><path fill="#41B883" d="M204.8 0H256L128 220.8L0 0h97.92L128 51.2L157.44 0h47.36Z"></path><path fill="#41B883" d="m0 0l128 220.8L256 0h-51.2L128 132.48L50.56 0H0Z"></path><path fill="#35495E" d="M50.56 0L128 133.12L204.8 0h-47.36L128 51.2L97.92 0H50.56Z"></path></svg>

package/dist/css/main.d97599b7.css

@@ -1 +0,0 @@
-#canvas3DContainer,#canvas3DContainer>canvas,.frame[data-v-49199ef8]{width:100%;height:100%}

package/dist/index.html

@@ -1,26 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-  <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  <link href="/css/main.d97599b7.css" rel="stylesheet"><script type="text/javascript" src="/main.js"></script></head>
-  <body>
-    <div id="app"></div>
-    <div id="app2"></div>
-    <div id="app3"></div>
-    
-    <script>
-        console.log(ThreeDLayoutView)
-        const base_url='http://localhost:8080'
-        const geometry={roofs:[],obstacles:[],moduleFields:[],layoutSettings:{}}
-        const specificData={uuid:"d5774a28-d71c-4b1d-81bd-5bb4b57d82b6",view_mode:"top",base_url}
-        new ThreeDLayoutView().mount("#app",geometry,specificData)
-        
-        const specificData2={uuid:"9cc4d524-a5d3-45f5-9247-8995363cecee",view_mode:"street",base_url}
-        new ThreeDLayoutView().mount("#app2",geometry,specificData2)
-
-        const specificData3={uuid:"5b043153-3b34-4fd2-a247-d2816f3d5e6e",view_mode:"ortho",base_url}
-        new ThreeDLayoutView().mount("#app3",geometry,specificData3)
-      </script>
-  </body>
-</html>