Stuck - get multiple glb meshes to attach to "pickInfo.pickedPoint"

Hi there, I am getting a lot of help here in the forum…thanks to everyone for that. I got some help on my project here, but after a day of trying to work things out for myself I am well and truly stuck. I have some ideas but don’t know how to implement them. So, here is where I am.

The goal is to have only the ‘room_top.obj’ visible (at present other objects are showing). Then when you click on ‘room_top.obj’ the Dev2 mesh attaches to it at the mouse position. At present only one of my ‘Dev2’ meshes appears, I’m hoping to have around 12 (so the sphere, box etc are just placeholders).

I said I had ideas: I came across a couple of playgrounds (see below). I feel that instancing may be the solution or somehow pushing the asset container, containing the glb, into an array. But I have no idea how to do this…or if this is the right approach.

Help with this would be greatly appreciated.

Here are the playgrounds I mentioned Instancing playground and the array playground.

Cheers.

Maybe @PirateJC can help?

Hey @Bov happy to help!

I think I’m a little lost on exactly what you’re trying to achieve. If you want to attach a mesh to another mesh at the point that was picked, you’ve actually got most everything you need already.

I’ve stripped everything back to the most simple example. Here:
https://playground.babylonjs.com/#035R4B#7

In this playground, I’m loading in your room_top.obj, looping through each child mesh to give it a meta data tag of “roomTop.” I also load your dev objects and set their visibility to 0. Then on pick, I check to make sure a mesh was picked, and also check to make sure that the picked mesh had metadata of “roomTop.” Then if that’s the case. it will set the visibility of your child meshes to 1 and position them onto the point that was picked.

This is a very stripped back place to build off of.

Perhaps I’m not fully understanding what you’re trying to achieve?

1 Like

Hi PirateJC, thank you for your response.
You have solved part of my query: Dev2 mesh now only appears when the mouse is clicked…great.
The main thing I am after is having more than one of my devices (Dev2 mesh) to be attached to the roof space. These Dev2 meshes are meant to be wi-fi transmitters. I want to place several over the area of the roof. This is to simulate total coverage of a room. I would also like my position gizmo to remain, if possible, so that adjustments to the position can be made (but only on the Dev2 meshes, not the roof top). I hope this makes sense.
Thanks.

Ah yes! Ok thanks that’s definitely helpful and gives me a better picture of what you’re after.

So if you take the playground I made and add that to your previous playground, you should have the best of both worlds as far as gizmo and visibility management.

Then the next thing it sounds like you want to do is to clone the two Dev2 meshes so you can place several of them.

There are a number of different ways to do this, but your original inclination to use Asset Containers is pot on with how I would approach this.

Check out this video on the subject:

You can also reference the playground that this video series creates for reference code and examples:
https://playground.babylonjs.com/#XEP0ZD#6

Hope this is helpful!

1 Like

Thanks PirateJC, this has given me some food for thought. I’ll see how I get on.
Cheers.

Hi PirateJC, I think the learning curve of Babylon.js is fairly steep…but I have to say it’s fun!

I worked on my project today and made some progress, as seen here.

However, I still don’t know how to get the pickedPoint info into the position of my asset (Dev2). At present if I keep clicking on the rooftop mesh I can see that I am building up a collection of Dev2 objects. I know this as I can separate the cluster of Dev2 objects using the gizmo.

Any clues how I can get the pickedPoint info into the position of my asset (Dev2) so that I can click around the roofTop mesh leaving Dev2 objects as I go? I thought line 54 (duplicate(container, 0.3)) could be used, but this just seems to be an offset parameter.

Thank you.

Hey @Bov

You were REALLY close to the answer:

There are just a couple of things that I did to make this work, so kudos to you for getting this far!

https://playground.babylonjs.com/#035R4B#11

The first thing that I did was pass the pickResult.pickedPoint into the hopeItWorks function.

Next I changed the line where you add all of the container objects into the scene. Instead of using the addAllToScene() method, I used the instantiateModelsToScene(). This method actually returns an object with critical information in it, in this case the fact that you have a root node that sits above the Dev2 meshes.

Because we now have access to the root node of each set of cloned Dev objects, we can now simply update the root node’s position to be the same of the pickedPoint.

Again nice work on getting this far!

Babylon is a HUGE engine with a TON of features and you’re definitely in the right place to learn all about it!

I hope you find this community as welcoming and friendly as I have!

1 Like

Hi PirateJC, wow… thank you so much for this. I am excited to see it now working the way I want it to.
Now I can move on and attempt the next set of features in my project.
Babylon.js has a great set of resources that make it possible, with the investment of a bit of time, to get close to (or solve) the answers we all look for. Thanks again.

2 Likes