Hey, there!
I’m stuck on one issue with my loaded model. That model is large enough so I cannot add the external playground link here. But, let me try to explain what I’m trying to achieve. I’ve added my old playground link below, which is quite similar to the new model so I hope you guys can understand.
https://playground.babylonjs.com/#G95938
My new model looks like below with low-level polygons and buildings over the continents. What I’ve done is I’m checking if my continents are in camera frustum or not using the camera.isInFrustum method on camera.onViewMatrixChangedObservable event. That is working fine and If I move/drag my camera so it hides/shows the continents which is inside camera frustum.
const loadGLTF = () => {
SceneLoader.Append('../../../src/assets/verge3d/', 'Map_Figma_Text_export2_new.glb', scene, (scene) => {
console.log('scene loaded', scene);
// lod
scene.meshes.forEach((mesh) => {
const meshName = mesh.name;
// console.log(mesh.getPositionExpressedInLocalSpace())
// if(mesh && meshName.includes('mountain')){
// mesh.addLODLevel(15, null);
// // mesh.useLODScreenCoverage = true
// }
if(mesh && meshName.includes('Bossnet')){
// mesh.isVisible = false
mesh.addLODLevel(7, null)
}
if(mesh && meshName.includes('Bossverse')){
// mesh.isVisible = false
mesh.addLODLevel(6, null)
}
if(mesh && meshName.includes('primitive0')){
mesh.addLODLevel(10, null)
}
if(mesh && meshName.includes('primitive1')){
mesh.addLODLevel(8, null)
}
})
}, () => {
console.log('loading...')
}, (error, message) => {
console.log(message)
},
'.glb')
}
camera.onViewMatrixChangedObservable.add(() => {
if(scene.meshes.length > 0){
scene.meshes.forEach((mesh) => {
const meshName = mesh.name;
if(meshName.includes('mountain')){
if(mesh){
// console.log(mesh)
const isInFrustum = camera.isInFrustum(mesh);
if(!isInFrustum){
mesh.isVisible = false;
}else{
setTimeout(() => {
mesh.isVisible = true;
}, 100)
}
}
}
else {
// const _isInFrustum = camera.isInFrustum(mesh);
if(mesh.name !== 'water'){
// const lodLevel = mesh.getLODLevels();
// console.log(mesh.name, lodLevel);
// var boundingSphere = mesh.getBoundingInfo().boundingSphere;
// console.log('boundingSphere', )
if (camera.isInFrustum(mesh)) {
console.log('in')
setTimeout(() => {
mesh.isVisible = true;
if(mesh && mesh.name.includes('Bossnet')){
// mesh.isVisible = false
mesh.addLODLevel(7, null)
}
if(mesh && mesh.name.includes('Bossverse')){
// mesh.isVisible = false
mesh.addLODLevel(6, null)
}
if(mesh && mesh.name.includes('primitive0')){
mesh.addLODLevel(10, null)
}
if(mesh && mesh.name.includes('primitive1')){
mesh.addLODLevel(8, null)
}
}, 100)
// LOD level is inside camera frustum
} else {
mesh.removeLODLevel(null);
mesh.isVisible = false;
console.log('out')
// LOD level is outside camera frustum
}
}
}
})
}
})
Apart from that, I’ve added LOD levels to these low-level polygons, and buildings, which is also working fine, but the issue is my low-level polygons and buildings (as marked in the red rectangle below) are kept visible and my continent is showing after a slight delay when the camera moves/drag.
Instead, it should work like below, when I move/drag the camera the continents first show when it comes inside the camera frustum then low-level polygons and building even if they are at their LOD level.
This is the video regarding the issue.
Can someone help me with this? How can I sync the LODs and camera frustum? So, continents should be visible first when they are inside the camera frustum and then low-level polygons/buildings and hidden when it’s not.
