@eturnity/eturnity_3d 9.13.0-google3dTile.2 → 9.16.0

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@eturnity/eturnity_3d",
   "private": false,
-  "version": "9.13.0-google3dTile.2",
+  "version": "9.16.0",
   "files": [
     "dist",
     "src"
@@ -18,7 +18,6 @@
   "dependencies": {
     "@eturnity/eturnity_maths": "9.13.0",
     "@originjs/vite-plugin-commonjs": "1.0.3",
-    "3d-tiles-renderer": "^0.4.22",
     "core-js": "3.30.2",
     "cors": "2.8.5",
     "earcut": "2.2.4",

package/src/Overlay/OverlayFactory.js

@@ -2,7 +2,6 @@ import Overlay from './Overlay'
 import GLBOverlay from './GLBOverlay'
 import ImageOverlay from './ImageOverlay'
 import YearlySunShadingOverlay from './YearlySunShadingOverlay'
-import Google3DTilesOverlay from './Google3DTilesOverlay'
 
 const OverlayFactory = {
   createOverlay(serializedOverlay, emit, origin = { lat: null, lng: null }) {
@@ -13,8 +12,6 @@ const OverlayFactory = {
       overlayInstance = new ImageOverlay(serializedOverlay, emit)
     } else if (serializedOverlay.type == 'yearly_sun_shading') {
       overlayInstance = new YearlySunShadingOverlay(serializedOverlay, emit)
-    } else if (serializedOverlay.type == 'google_3d_tiles') {
-      overlayInstance = new Google3DTilesOverlay(serializedOverlay, emit, origin)
     } else {
       overlayInstance = new Overlay(serializedOverlay, emit)
     }

package/src/Overlay/ThreeDModelOverlay.js

@@ -350,24 +350,8 @@ export default class ThreeDModelOverlay extends Overlay {
       resolve(imageUrl)
     })
   }
-  /** Override in subclasses to use a different mesh (e.g. tiles wrapper) or null when not yet ready */
-  getOverlayMeshForRaycast() {
-    return this.overlayMesh
-  }
-
-  /** Override in subclasses to raycast into child meshes (e.g. for Group-based overlays like 3D Tiles) */
-  getRaycastRecursive() {
-    return false
-  }
-
   getProjectedPlanesOnOverlay(polygons) {
-    const mesh = this.getOverlayMeshForRaycast()
-    if (!mesh) {
-      return polygons.map(() => null)
-    }
-    mesh.updateMatrixWorld(true)
     const RayCaster = new THREE.Raycaster()
-    const recursive = this.getRaycastRecursive()
     const cloudsPoints = polygons.map((polygon) => {
       const outline = polygon.outline
       const holeOutlines = polygon.holes.map((h) => h.outline)
@@ -384,8 +368,8 @@ export default class ThreeDModelOverlay extends Overlay {
       let { xMin, xMax, yMin, yMax } = outlineBounds
       const cloudPoints = []
       let stepNum = 8
-      for (let i = 1; i < stepNum - 1; i++) {
-        for (let j = 1; j < stepNum - 1; j++) {
+      for (let i = 1; i < stepNum; i++) {
+        for (let j = 1; j < stepNum; j++) {
           const testPoint = {
             x: xMin + (i * (xMax - xMin)) / stepNum,
             y: yMin + (j * (yMax - yMin)) / stepNum,
@@ -400,7 +384,7 @@ export default class ThreeDModelOverlay extends Overlay {
               new THREE.Vector3(testPoint.x / 1000, testPoint.y / 1000, 100),
               new THREE.Vector3(0, 0, -1)
             )
-            let intersects = RayCaster.intersectObject(mesh, recursive)
+            let intersects = RayCaster.intersectObject(this.overlayMesh)
             if (intersects.length > 0) {
               cloudPoints.push(intersects[0].point)
             }

package/src/helper/cameraMixin.js

@@ -744,23 +744,6 @@ export default {
         waitingBall.scale.set(scale, scale, scale)
         this.render()
       }
-      // Per-frame updates for overlays (e.g. Google 3D Tiles)
-      const overlayMeshes = this.meshes?.overlayMeshes
-      let overlayUpdated = false
-      if (overlayMeshes) {
-        Object.values(overlayMeshes).forEach((mesh) => {
-          if (
-            mesh?.userData?.update &&
-            typeof mesh.userData.update === 'function'
-          ) {
-            mesh.userData.update()
-            overlayUpdated = true
-          }
-        })
-      }
-      if (overlayUpdated) {
-        this.render()
-      }
       this.animationFrameId = requestAnimationFrame(this.animate)
     },
   },

package/src/helper/render/edge.js

@@ -88,8 +88,6 @@ export default {
           cylinder.userData.edgeId = edge.id
           cylinder.userData.type = 'edgeMeshes'
           cylinder.userData.layer = edge.layer
-          cylinder.frustumCulled = false
-
           cylinder.frustumCulled = false
           cylinder.renderOrder = 15
           this.meshes.edgeMeshes[edge.id] = cylinder

package/src/helper/render/obstacle.js

@@ -9,10 +9,22 @@ export default {
     this.mergedObstacleSideMesh = null
   },
   methods: {
-    applyTextureOnObstacles(material = this.material.roof) {
+    applyTextureOnObstacles() {
       this.reorderRoofMaterials()
       if (this.mergedObstacleMesh) {
-        this.applyTextureOnMesh(material, this.mergedObstacleMesh)
+        const geometry = this.mergedObstacleMesh.geometry
+        geometry.computeBoundingBox()
+        const bounds = {
+          xMin: geometry.boundingBox.min.x,
+          xMax: geometry.boundingBox.max.x,
+          yMin: geometry.boundingBox.min.y,
+          yMax: geometry.boundingBox.max.y,
+        }
+        const materials = this.getMaterialsFromBounds(
+          bounds,
+          this.material.roof
+        )
+        this.applyTextureOnMesh(materials, this.mergedObstacleMesh)
       }
     },
     renderObstacles() {
@@ -75,7 +87,7 @@ export default {
         this.mergedObstacleMesh,
         obstacleGeometries
       )
-      this.applyTextureOnObstacles(this.material.roof)
+      this.applyTextureOnObstacles()
 
       this.mergedObstacleSideMesh = this.updateOrCreateMergedMesh(
         this.mergedObstacleSideMesh,

package/src/helper/render/projectionMaterial.js

@@ -1,11 +1,3 @@
-import * as THREE from 'three'
-function cloneMaterialArrayAndAddEmission(material, color) {
-  let newMaterial = material.clone()
-  newMaterial.camera = material.camera
-  newMaterial.emissiveEnabled = true
-  newMaterial.emissive.set(color)
-  return newMaterial
-}
 export default {
   methods: {
     reorderRoofMaterials() {
@@ -16,14 +8,9 @@ export default {
       })
     },
     async updateProjectionMaterials() {
-      //this.setImageOverlayCameraPosition()
       this.overlayMaterials = (await this.getOverlaysMaterials()).filter(
         (m) => !!m
       )
-      // this.material.selectedWarningRoof = this.material.roof.map((material) =>
-      //   cloneMaterialArrayAndAddEmission(material, 0x808080)
-      // )
-      //add or remove imageOverlayMaterial
       this.material.roof = this.material.roof.filter(
         (material) => material.userData.type != 'overlayMaterial'
       )
@@ -32,5 +19,53 @@ export default {
       this.applyTextureOnRoofs()
       this.applyTextureOnObstacles()
     },
+    /**
+     *
+     * @param {Object} bounds in meters { xMin, xMax, yMin, yMax }
+     * @param {Array} materials array of materials
+     * @returns {Array} array of all non-tile and relevant tile materials
+     */
+    getMaterialsFromBounds(bounds, materials = []) {
+      if (!materials?.length) return materials
+      const nonTile = []
+      const tileMats = []
+      for (const m of materials) {
+        if (m?.userData?.type === 'tileProjectionMaterial') {
+          tileMats.push(m)
+        } else {
+          nonTile.push(m)
+        }
+      }
+      if (tileMats.length === 0) return materials
+      const relevantTiles = bounds
+        ? tileMats.filter((m) => this.materialOverlapsBounds(m, bounds))
+        : tileMats
+      const combined = [...nonTile, ...relevantTiles]
+      combined.sort((a, b) => (a.priority || 0) - (b.priority || 0))
+      return combined
+    },
+    /**
+     *
+     * @param {Object} material
+     * @param {Object} bounds in meters { xMin, xMax, yMin, yMax }
+     * @returns {boolean} true if material overlaps bounds
+     */
+    materialOverlapsBounds(material, bounds) {
+      if (!bounds || !material?.camera) return true
+      const cam = material.camera
+      if (!cam.isOrthographicCamera) return true
+      const left = cam.left
+      const right = cam.right
+      const bottom = cam.bottom
+      const top = cam.top
+      const tileMinX = Math.min(left, right)
+      const tileMaxX = Math.max(left, right)
+      const tileMinY = Math.min(bottom, top)
+      const tileMaxY = Math.max(bottom, top)
+      const { xMin, xMax, yMin, yMax } = bounds
+      const separated =
+        xMax < tileMinX || xMin > tileMaxX || yMax < tileMinY || yMin > tileMaxY
+      return !separated
+    },
   },
 }

package/src/helper/render/roof.js

@@ -68,14 +68,27 @@ export default {
 
       return geometry
     },
-
+    getMaterialsForRoof(roofPolygon) {
+      const bounds = roofPolygon.getBounds()
+      // convert bounds to meters
+      const boundsMeters = {
+        xMin: bounds.xMin / 1000,
+        xMax: bounds.xMax / 1000,
+        yMin: bounds.yMin / 1000,
+        yMax: bounds.yMax / 1000,
+      }
+      const materials = this.getMaterialsFromBounds(
+        boundsMeters,
+        this.material.roof
+      )
+      return materials
+    },
     applyTextureOnRoofs() {
       this.reorderRoofMaterials()
-      const material = this.material.roof
       this.roofs.forEach((roof) => {
         const roofMesh = this.meshes.roofMeshes[roof.id]
         if (roofMesh) {
-          this.applyTextureOnMesh(material, roofMesh)
+          this.applyTextureOnMesh(this.getMaterialsForRoof(roof), roofMesh)
         }
       })
       this.render()
@@ -84,7 +97,7 @@ export default {
       this.clearRemovedOnes('roofMeshes')
       this.roofs.forEach((roofPolygon) => {
         const material = roofPolygon.isFlat
-          ? this.material.roof
+          ? this.getMaterialsForRoof(roofPolygon)
           : this.material.warningRoof
         let mesh
         let geometry

package/src/helper/render/tile.js

@@ -289,6 +289,7 @@ export default {
               material = mesh.material
               geometry = updateBufferRoofGeometry(corners, [], geometry)
               mesh.geometry = geometry
+              if (geometry) geometry.computeBoundingSphere()
               material.map = texture
               material.needsUpdate = true
               mesh.userData.mapLayer = this.provider.mapLayer
@@ -310,6 +311,7 @@ export default {
               material.needsUpdate = true
               geometry = getBufferRoofGeometry(corners)
               if (geometry) {
+                geometry.computeBoundingSphere()
                 mesh = new THREE.Mesh(geometry, material)
                 mesh.userData.type = 'tileMeshes'
                 mesh.userData.meshId = meshId

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>