From c3b5e954a03df5a2672e05ce0ff9d1d0cb912323 Mon Sep 17 00:00:00 2001 From: Thomas Fuhrmann Date: Wed, 30 Apr 2025 12:48:19 +0200 Subject: [PATCH 1/5] Remove dependency on Topography layer --- app/three/SceneView.ts | 14 +++++--------- 1 file changed, 5 insertions(+), 9 deletions(-) diff --git a/app/three/SceneView.ts b/app/three/SceneView.ts index 67457b1..8eb0509 100644 --- a/app/three/SceneView.ts +++ b/app/three/SceneView.ts @@ -490,13 +490,9 @@ async function init(container: HTMLElement, modelId = MODEL_ID) { scene.add(map); const topography = scene.getObjectByName("Topography") as Mesh; - if (topography) { - renderer.setAnimationLoop( - animate( - rendererCallback(camera, renderer, scene, map, extent, topography) - ) - ); - } + renderer.setAnimationLoop( + animate(rendererCallback(camera, renderer, scene, map, extent, topography)) + ); return { scene, @@ -514,10 +510,10 @@ function rendererCallback( scene: Scene, map: MapView, extent: Extent, - topography: Mesh + topography: Mesh | undefined ) { return () => { - if (topography.visible) { + if (topography && topography.visible) { map.lod.updateLOD(map, camera, renderer, scene); const tiles: TileData[] = []; traverse(map.root, extent, tiles); From b8468a8afbaf3c2b569307fa5541a675210f1a11 Mon Sep 17 00:00:00 2001 From: Thomas Fuhrmann Date: Wed, 30 Apr 2025 13:15:13 +0200 Subject: [PATCH 2/5] Render meshes before completion of download --- app/three/SceneView.ts | 7 +++++-- app/three/utils/build-meshes.ts | 11 ++++++----- 2 files changed, 11 insertions(+), 7 deletions(-) diff --git a/app/three/SceneView.ts b/app/three/SceneView.ts index 8eb0509..66d5415 100644 --- a/app/three/SceneView.ts +++ b/app/three/SceneView.ts @@ -452,12 +452,14 @@ async function init(container: HTMLElement, modelId = MODEL_ID) { const { renderer, scene, camera, controls } = buildScene(container, extent); + // Start render loop + renderer.setAnimationLoop(animate(() => {})); + // Build the 3D model - const meshes = await buildMeshes(mappedFeatures); const model = new Group(); - model.add(...meshes); model.name = "geologic-model"; scene.add(model); + await buildMeshes(mappedFeatures, model); // Add a coordinate grid to the scene const { gridHelper, annotations } = buildCoordinateGrid(extent); @@ -489,6 +491,7 @@ async function init(container: HTMLElement, modelId = MODEL_ID) { map.visible = false; scene.add(map); + // Update render loop to include topography const topography = scene.getObjectByName("Topography") as Mesh; renderer.setAnimationLoop( animate(rendererCallback(camera, renderer, scene, map, extent, topography)) diff --git a/app/three/utils/build-meshes.ts b/app/three/utils/build-meshes.ts index 07679e3..fb959ae 100644 --- a/app/three/utils/build-meshes.ts +++ b/app/three/utils/build-meshes.ts @@ -2,6 +2,7 @@ import { BufferAttribute, BufferGeometry, DoubleSide, + Group, Mesh, MeshStandardMaterial, } from "three"; @@ -17,18 +18,18 @@ interface MappedFeature { preview: { legend_color: string; legend_text: string }; } -export async function buildMeshes(mappedFeatures: MappedFeature[]) { - const meshes = []; +export async function buildMeshes( + mappedFeatures: MappedFeature[], + model: Group +) { for (let i = 0; i < mappedFeatures.length; i++) { const layerData = mappedFeatures[i]; const mesh = await buildMesh(layerData); if (layerData.name === "Topography") { mesh.visible = false; } - meshes.push(mesh); + model.add(mesh); } - - return meshes; } async function buildMesh(layerData: MappedFeature) { From 5a5656109e4ec901af55d23ac54096a85e87d104 Mon Sep 17 00:00:00 2001 From: Thomas Fuhrmann Date: Wed, 30 Apr 2025 13:23:24 +0200 Subject: [PATCH 3/5] Explode all layers --- app/three/SceneView.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/three/SceneView.ts b/app/three/SceneView.ts index 66d5415..9f8ab8f 100644 --- a/app/three/SceneView.ts +++ b/app/three/SceneView.ts @@ -400,7 +400,7 @@ export class SceneView extends EventTarget { this._resetClippingBox(); } - for (let i = 1; i < this._model.children.length; i++) { + for (let i = 0; i < this._model.children.length; i++) { const mesh = this._model.children[i]; if (explode) { From ec68fccaa3725187a64b8a1515516ee05f0a8243 Mon Sep 17 00:00:00 2001 From: Thomas Fuhrmann Date: Mon, 5 May 2025 09:58:58 +0200 Subject: [PATCH 4/5] Parallelize model loading --- app/three/utils/build-meshes.ts | 8 +++++--- 1 file changed, 5 insertions(+), 3 deletions(-) diff --git a/app/three/utils/build-meshes.ts b/app/three/utils/build-meshes.ts index fb959ae..1b06dd3 100644 --- a/app/three/utils/build-meshes.ts +++ b/app/three/utils/build-meshes.ts @@ -22,14 +22,16 @@ export async function buildMeshes( mappedFeatures: MappedFeature[], model: Group ) { - for (let i = 0; i < mappedFeatures.length; i++) { - const layerData = mappedFeatures[i]; + const meshPromises = mappedFeatures.map(async (layerData) => { const mesh = await buildMesh(layerData); if (layerData.name === "Topography") { mesh.visible = false; } + model.add(mesh); - } + }); + + await Promise.all(meshPromises); } async function buildMesh(layerData: MappedFeature) { From 676a4e6cc144d48b97d582374b7001eec0dafb27 Mon Sep 17 00:00:00 2001 From: Thomas Fuhrmann Date: Mon, 5 May 2025 10:12:13 +0200 Subject: [PATCH 5/5] Remove parallelization to retain layer order --- app/three/utils/build-meshes.ts | 10 ++++------ 1 file changed, 4 insertions(+), 6 deletions(-) diff --git a/app/three/utils/build-meshes.ts b/app/three/utils/build-meshes.ts index 1b06dd3..a5bbe37 100644 --- a/app/three/utils/build-meshes.ts +++ b/app/three/utils/build-meshes.ts @@ -22,16 +22,14 @@ export async function buildMeshes( mappedFeatures: MappedFeature[], model: Group ) { - const meshPromises = mappedFeatures.map(async (layerData) => { - const mesh = await buildMesh(layerData); - if (layerData.name === "Topography") { + for (const mappedFeature of mappedFeatures) { + const mesh = await buildMesh(mappedFeature); + if (mappedFeature.name === "Topography") { mesh.visible = false; } model.add(mesh); - }); - - await Promise.all(meshPromises); + } } async function buildMesh(layerData: MappedFeature) {