Jump to content

Creating a loop to import same mesh multiple times


Hagop
 Share

Recommended Posts

ok

 

I am trying to create a loop using javascript for function in order to import the same mesh multiple times but with different XYZ coordinates.

The outcome of my code below shows only one instance of the mesh.

What am i doing wrong ?

 

Here is the code: 

 

<body>
    <canvas id="renderCanvas"></canvas>
    <script>
        window.addEventListener('DOMContentLoaded', function(){
            // get the canvas DOM element
            var canvas = document.getElementById('renderCanvas');

            // load the 3D engine
            var engine = new BABYLON.Engine(canvas, true);

            var createScene = function () {
                    var scene = new BABYLON.Scene(engine);
                
                    //Adding a light
                    var light = new BABYLON.PointLight("Omni", new BABYLON.Vector3(20, 20, 100), scene);
                
                    //Adding an Arc Rotate Camera
                    var camera = new BABYLON.ArcRotateCamera("Camera", 0, 0.8, 100, BABYLON.Vector3.Zero(), scene);
                    camera.attachControl(canvas, false);
                
                  for (i=0; i<5; i++)
                    {
                    BABYLON.SceneLoader.ImportMesh("", "", "pantene_low.babylon", scene, function (newMeshes) {
                        // Set the target of the camera to the first imported mesh
                        if(i==4)
                        {
                        camera.target = newMeshes[0];
                        }
                        newMeshes[0].position.x = i+10;
                        });
                    
                    }
                    // Move the light with the camera
                    scene.registerBeforeRender(function () {
                        
                        light.position = camera.position;
                    });
                
                
                
                    return scene;
                }

            // call the createScene function
            var scene = createScene();

            // run the render loop
            engine.runRenderLoop(function(){
                scene.render();
            });

            // the canvas/window resize event handler
            window.addEventListener('resize', function(){
                engine.resize();
            });
        });
    </script>
</body>

Link to comment
Share on other sites

The problem is that the variable i has already incremented to 5 before each of the models has completed loading. Then when the models load they using i=5.. add a counter outside that only gets updated when the mesh is loaded and has used the counter:

             var GlobalCounter = 0;             for (i=0; i<5; i++)                    {                    BABYLON.SceneLoader.ImportMesh("", "", "pantene_low.babylon", scene, function (newMeshes) {                        // Set the target of the camera to the first imported mesh                        if(GlobalCounter ==4)                        {                            camera.target = newMeshes[0];                        }                        newMeshes[0].position.x = GlobalCounter +10;                        });                       GlobalCounter ++;                    }
Link to comment
Share on other sites

Temechon

The reason I am importing the same mesh several times, is that I want to test the memory limit of the "system" on low internet connections and low ram (ie: 2GB RAM). The reason being we want to create a virtual 3D store with thousands of products (www.ardzan.com).

 

Anyhow, how does cloning work? should I assume that cloning a products several times would use less GPU memory than loading the the mesh the same number of times?

Thanks

Link to comment
Share on other sites

Indeed, cloning will use less GPU memory than loading several times the same model, and it won't use the bandwidth (as you don't have to load it another time).

You win in total number of draw call (better performance) and in memory: it's a win-win!

In order to use clone, you can do something like this: http://www.babylonjs-playground.com/#GK7FK#2

 

I challenge you to do faster by loading 10 times the same model :)

Link to comment
Share on other sites

ChrisR

 

Same problem with GlobalCounter ++;  It increases before the meshes are loaded.

This is how I solved the problem

 

 var createScene = function () {
                    var scene = new BABYLON.Scene(engine);
                 
                    //Adding a light
                    var light = new BABYLON.PointLight("Omni", new BABYLON.Vector3(20, 20, 100), scene);
                
                    //Adding an Arc Rotate Camera
                    var camera = new BABYLON.ArcRotateCamera("Camera", 0, 0.8, 100, BABYLON.Vector3.Zero(), scene);
                    camera.attachControl(canvas, false);
                
                    var loadMeshes = function(x) {
                    
                    BABYLON.SceneLoader.ImportMesh("", "scenes/", "pantene_low.babylon", scene, function (newMeshes) {
                            // Set the target of the camera to the first imported mesh
                            //camera.target = newMeshes[0];
                            //alert("i " +i);
                            newMeshes[0].position = new BABYLON.Vector3(x, 0, 0); });
                    }
                
                    for (i=1;i<4;i++)
                    {
                    var x = i*10;
                    var loadedMeshes = loadMeshes(x);
                    }
                                   
                    
                 
                    // Move the light with the camera
                    scene.registerBeforeRender(function () {
                        
                        light.position = camera.position;
                    });
                
                
                
                    return scene;
                }//end createScene

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
 Share

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...