How to dynamics load my terrain model file

My scene model file is large, so I divide it into small areas and store it in different model files. Each area has 1 kilometer and 20,000 trees, which are instantiated.

Now I want to load these region models dynamically from the location of my camera, but when I loaded the region model using the importMesh method, the page got stuck. I suspect that the intensive operation caused by instantiating the tree resulted in the page becoming unresponsive.

What can I do to get rid of stuck, or how can I modify my model to make it load smoothly?

I believe you should use either asset containers or by any means, import or append async (with await or a promise). Now, If it’s really that large and ‘regions’ I guess a multi-scene approach would be the best, but I’m not a specialist of that. May be @labris would know better?

1 Like

If the model is too large and all are loaded, it will crash due to memory. Maybe I need to design my scene to be like a game level to apply multiple scenes, But my scene is in the free world, and I use ArcRotateCamera for map control. I prefer to load and unload scene areas without awareness.

I understand. It’s a case that has been seen before but as I said I’m not a specialist so you should wait a bit for the others to kick-in. In fine, the solution is likely around a combination of methods. Using containers, LOD for meshes (and there’s also one for textures done by a member :smiley:), eventually also for terrain definition and clipping. Also using thin instances for static objects like trees or rocks. I’m pretty sure there must be some examples around…

Edit: May be @Dad72 who is creating an editor also has some hints?


have you tried incremental loading?

I will try it

increment loading system only can use SceneLoader.Appand method? I’m use importMesh method to load .babylon or .incremental.babylon file, but always display two mesh.

Is it because my tree belongs to instances?

@Dad72 Do I need to separate the tree instances from each other

logically, the loading incremental can also be used with ImportMesh. But with instances I’m not sure if the incremental changes anything.

Using instances is a good thing when possible.

There must be some other problem so that all your instantiate trees are not showing.

Do you have an error in the console? have you tried to display in the console the results of your mesh loadings to see what is happening / what is blocking?

Try to display only a few instances of your tree to see what happens and display the result in the console?

I must say that 20,000 trees is a lot. What happens if you instantiate 1000 of them? Does this work? The blockage could be explained by too many instances.

I think this problem is one of the hardest to solve smoothly.

I dont have the full answer for you but i think i have some resources to get you started.

  1. Proper scene setup.
    I would first setup my camera using this strategy. This is how cesium does it also.
    Floating Origin (Huge Scenes Support) | Babylon.js Documentation

  2. Loading
    Here are two examples with sample data, not using floating origin, but has loading and update logic as well as sample data if u need it.
    GitHub - BabylonJSGuide/largemaps: Uses blocks to load a large map a section at a time
    GitHub - BabylonJSGuide/Tiled
    Thanks John, we miss you

  3. Unloading.
    You need a way to manage unloading. Babylon has some leakiness (ie: not letting go of references and eventually running out of memory) as its default settings. It may require resetting texture caches, disabling indexeddb, etc. Possibly preorder a few keyboards in advance to replace the ones you smash while figuring it out.

For micro strategy, there are some other tactics that can be used. Just brainstorming:
-Add fog or curvature to hide far away meshes.
-Use billboard sprites for far away meshes.
-recycle objects (like your trees).

Btw, i dont think incremental loading is what you want for the tile logic. I think thats for increasing level of detail as you approach specific objects. Could be wrong, but i dont think thats really going to help you here.

1 Like

Incremental loading does not process instantiated meshes. If you reduce the number of trees, the blocking time will be reduced. I suspect that the loader dynamically parsed the information of the instance in the file and created an instance of the tree using a method similar to createInstance.

Although blocked, the instantiated tree model is quantitatively normal.

Yes, I should load the terrain and trees separately. I am trying to use this method to load terrain GitHub - jessehhydee/level-of-detail: A comparison on performance and rendering speed between three.js LOD tool and two self written LOD tools. Level of detail is used to improve rendering performance..

I will also refer to your suggestions,and find the best solution.

Yes I agree that incremental loading on instantiate objects won’t change anything.

Do you have a PG with your tree loading code with your instances?
How do you create your instances?

I think we need code to see what happens more concretely? It’s very difficult to help you like that.
There is something blocking which can be a lot of things like a piece of code crashing in your load function or something else.

You say that even with a reduced number of instances, you get a blocking, so the problem is either, code that blocks at one point, the instance creation method…

Sometimes bugs like this are very sneaky, we look for problems where they are not and they are where we least expect them.

1 Like