move meshes imported from obj / mtl

[Topper]

Hi,

I´m new to BJS and trying to get along with a 3D visualization for warehouses.

The 2D visualization already work pretty well, the coordinates are stored in a DB running on a remote server.

Target is to provide a library of rack elements (frames and beams) of different dimensions (height, width, length).

I can provide a JSON from server-side Java-application with all the necessary data (rack id, rack type, coordinates, etc.)

I´m using OBJFileLoader for importing obj and mtl which works fine as well.

This is 2D visualization of a warehouse:

Every blue rectangle is a warehouse rack consisting of two frames an a bunch of beam pairs:

Both elements, frame and beam, come from separate obj-files.

In the end of the day, i want to have something like this:

The displayed meshes are kind of super simple, but perfect for playing around with BJS (i´ve all models in high poly as well).

For some reason I can´t move (or change) meshes imported by this method:

I can specify the mesh position while importing like this (works for the sphere btw.):

        var loader = new BABYLON.AssetsManager(scene);
        
                        var pos = function(t){
                          t.loadedMeshes.forEach(function(m){
                              var meshName = m.name;
                              var meshID = m.id;
                                      
                              m.position.z = 5;
                              m.position.x = 7;
                          });
                        };
        
        var steher1 = loader.addMeshTask("steher_2500_900_120", "", "http://localhost:8080/MagllanMain/Babylon/Cyril/", "steher_2500_900_120.obj");
        
                        steher1.onSuccess = pos;
        
                        var sphere = BABYLON.Mesh.CreateSphere("sphere", 0.5, 0.5, scene);
                        var simpleMaterial = new BABYLON.StandardMaterial("texture2", scene);
                        simpleMaterial.diffuseColor = new BABYLON.Color3(0, 1, 0);//Green
                        sphere.material=simpleMaterial;
                        sphere.position.x = Math.floor((Math.random() * 2) );
                        sphere.position.y = Math.floor((Math.random() * 2) );
                        sphere.position.z=3;
 

        BABYLON.OBJFileLoader.OPTIMIZE_WITH_UV = true;
        
        loader.load();
        
        
        // Begin of User interaction via button event

        $("#move_z").click(function(){ 
             //scene.meshes.forEach(function(k) {alert(k.name);});
             pilot.position.z = pilot.position.z + 1;
             sphere.position.z = sphere.position.z + 0.4;
             scene.getMeshByName('steher_2500_900_120').position.z +=10;
           });

Funny thing is, i can move all other meshed via click-event.

In general, I´ve been asking myself if I´m using the best way of doing this (import-method, file-types: obj and mtl).

The workflow should be like this:

1) get JSON from server with an array of IDs and their coordinates (e.g.: ID="10012", ID_name="rack_012", ID_pos_x="130", ID_pos_y="120", etc.);

2) Importing the rack elements that belong to a specific ID into existing BJS scene;

3) Every rack element uses the same obj-file(s) (meshes) because all racks shall be of the same rack type, but with different IDs in BJS;

I don´t know how to give imported meshes their own unique, custom IDs so that I can access them in the scene.

More in general: I have my server-side array and i need a client-side array as well.

When i change the position of let´s say 10 of 2000 racks in my layout / scene, I need to know which meshes i have to "move" on client-side.

If there are any other weak points my way of trying to achieve this, please tell me.

Any help appreciated !!!

Topper

 

[Wingnut]

Hiya Topper, welcome to the forum.  I will try to offer some suggestions.

#1:  Sounds good.  JSON file is good idea.

#2.  Perhaps import only ONE of each type.  Then use createInstance() or clone() (within scene JS) to make MANY of them, using the JSON info to name and position them.  By doing this, the JSON file is the boss.  IT tells BJS how many clones() are needed, what each name is, and where to position it.

#3.  Yep, good idea... just import ONE of each type.  Then spawn spawn spawn more, based-upon info from JSON file.    When each cloning/instance is created, you have option to name it... example:  masterRack.createInstance('row15_col24_rack'); 

Also, we have the BJS Tags System... which will allow you to set a mesh.tags property.  Using the Tags Tools, you could find all mesh whose names include 'row15' or 'col24'.  The Tags system will return an array of ALL row15 or all col24, or even all 'rack'.  It has very powerful search tools.

Your problem with moving/positioning imported mesh... is something simple.  It is a minor problem.  Do you know how to "wrap in a try/catch"?  I show how... in THIS forum post.

Perhaps, wrap your positioning attempts... in a try/catch, and then more error information might be seen at JS console.

scene.getMeshByName('steher_2500_900_120').position.z +=10;

That line SHOULD work... if the mesh name is correct, AND if mesh has finished loading.  But see below... about loader.onFinish(), which I think you might need.

Perhaps, in FIRST LINE of pos()... add...  console.log(t.loadedMeshes); 

Then go to JS console... you might see object [object, object, object]

In most browsers, you can CLICK-upon any 'object' word, and an 'object inspector' will launch, and you can make sure that you have names set properly.

Try to publish your small .babylon file... or small .obj/.mtl files... somewhere on the web... where we can load-it with a BJS playground scene.  I store my little .babylon/.obj files in my free github account.  Here is my 'misc' folder on github... it is free... and you can see that I store little test files in there... including mesh01.obj.

Here is a BJS playground scene that loads mesh01.obj.   https://www.babylonjs-playground.com/#3FV2X#13

Notice the loader.onFinish()  I notice that you don't have one in your code.  Perhaps add one?  *shrug*  Then put MOST of your scene code... within IT.

Notice in my loader... lines 28-30, which are also inside-of loader.onFinish().  Those code lines are slowly positioning the mesh... further from camera.  Positioning is working.

Go to console, click on the word object. Does object inspector launch?  If so, scroll down down down... until you see property .name.  This is how I discovered... that the imported mesh was named 'TriPatch01'.  I had forgotten its name, so I needed to "look it up" with the object inspector.  Object inspectors are VERY cool, and learning about them... speeds-up BJS learning LOTS.  It's a great tool. 

Okay, sorry for so long talking.  Hope this helps.  Be patient with yourself.  Soon it will feel much easier.

[Topper]

@ Wingnut

Awesome. Thx for your your detailed and exhausting description. I´m gonna check this out today.

BR,

Markus