Hi there, I am trying to attach a glf model to a mesh on a mouse click. I have a playground setup here.
This simply eases towards a single square mesh inside a .obj file. On click I would like a simple glf model to attach to it. I am hoping to add a post process godrays glow to it…but that’s for later. For now, I would just like the glf model to attach when clicking on the square.
I am new to Babylon.js…this is my first playground.
Thanks for your help.
Pinging @piratejc
Hey @Bov - Welcome to the Babylon family!
Here’s how I’d approach this.
First load all of your assets in the scene using asset containers. You can find info on that here:
Then it’s pretty straight forward, once the mesh you want to be selected is actually selected, you’ll simply instantiate a version of the asset container of the gltf model into the scene.
Here’s a simple example:
This is just a simple playground with a sphere, hemispheric light and an arc-rotate camera. Note that I’ve moved the sphere up 1 unity in Y.
On line 26 I load an asset container of the hex tile from the video above.
Lines 29-36 handle the interaction…testing if there’s a mesh in the scene that’s been picked. If the mesh picked is the sphere then the I instantiate the hex tile models into the scene. The important line there is line 31.
Line 32 gets the root node of the gltf object that’s been instantiated into the scene.
Line 33 sets the position of the gltf root to the sphere’s position.
Line 34 is something you can ignore. Because I’m loading an asset with animation on it. This line simply makes sure that the animation is all reset when the model is loaded…so the model is in its first animation frame position.
Hope this helps!!!
Hi there, looks like I have been caught by a pirate…but a very helpful one.
I think this will help me…thanks for your detailed explanation (your video is good too).
I am working on another part of my project but will return to this later today.
I am hoping to develop my programming skills as I have official projects to tackle. So, I watch Blender and Babylon JS videos on a regular basis…will I ever get fluent in both…I hope so.
I work in education and hope to use Babylon.js to create interesting material, especially as more teaching is done online.
I spent four weeks on a project last year, working totally alone on it…I struggled a bit…never thought to use the forum. But I think I will need to as things get more complex.
Thanks again. And thanks for a good community.
Good luck finding treasure.
1 Like
Hi PirateJC, sorry, I may have gone too far making my initial playground as simple as possible. I may have misled you to think there is only one mesh (I have updated my initial playground to include several meshes (the corner of a room).
The overall idea is to have a large room, of any shape, made up of small meshes (via a OBJ file). This method, shown in my initial playground, will not allow picking through walls. I worked on this problem and came up with this thread and playground. It solves the through the wall picking problem, but I can’t combine this with adding the glft model. I am just looking to have a large room where you can wander around by clicking small meshes on the walls floor and ceiling and have a simple box like glft attach to the mesh as you go. Again, sorry if I misled you. Cheers.
I’m not sure I completely understand the problem, but from what I gather it sounds like you might be running into the issue of picking stopping when the first mesh (wall) is picked. You can get around this by using the multi-pick rays. Here’s some info to help you understand how to use them.
It’s pretty similar to the scene picking that I did in my example playground for you, only it returns all meshes picked by the ray, not just the first. So you’ll get an array of meshes returned that all were intersected by the selection ray. Then you can loop through that array to find the specific mesh you want to run logic on.
Hope that makes sense.
@PirateJC Hi again, thanks…I appreciate your time. I been looking through a lot of Babylon.js documentation and there is a lot of cool stuff. I came across this example and saw how you can adjust the length of the line that shoots out of the red cube, so it scans a limited area. But I don’t think this is what I am after (I maybe wrong).
My initial playground was good, but then if the camera spins around to the outside part of the wall, and the wall disappears due to the normals being the wrong way, when you click a square to enter the room again you are clicking on the backside of the invisible wall, thinking you are clicking inside (I discovered this issue after I posted my first playground).
My next playground solved this, you see the meshes Blender generated, by clicking through the back of the invisible walls. In the console log you see the names Blender gave to the meshes.
So, I was looking for the functionality of my first playground (just a small corner of a room). With the picking through back of the wall of my second playground. Then there is the added functionality of having a small glft model left as a trail as you click to move the camera around.
The bottom line is I am trying to produce a simple simulation of a user placing a device in different parts of a large, unusual shaped, room.
I am very new to programming; I am more of a designer that wants to learn. I will just try and figure out this somehow.