Weekly Video: Pick Objects in your scene using Rays!

Announcements
1

Hey everyone,

My turn this week! Super pumped to bring you a little bit of the ol’ pirate spirit by showing you how to select a mesh inside of your scene using the scene.createPickingRay feature.

What mesh should we select? Something Piratey me thinks! ARRRRRGG!

https://playground.babylonjs.com/#AC8XPN

6 Likes
2

Hi,

I did not know this solution with pickWithRay. So now I’m asking myself a question.
We can use evt.pickInfo and pickWithRay. Does it do the same thing? What is their difference? Is one method faster than the other, less expensive?
I am now looking for which of the two methods to use, the most versatile.

// METHODE 1: evt.pickInfo
scene.onPointerObservable.add((evt)=> { 	
	if (evt.event.button !== 0)  return; 	
	const pickResult = evt.pickInfo;
	if (pickResult.hit) {
		if (!pickResult.pickedMesh) return;					
		
		//Do something
	}
}, BABYLON.PointerEventTypes.POINTERPICK);	

// METHODE 2: pickWithRay()
scene.onPointerObservable.add((evt)=> { 
    if (evt.event.button !== 0)  return;
	const ray = scene.createPickingRay(scene.pointerX, scene.pointerY, BABYLON.Matrix.Identity(), camera);
	const hit = scene.pickWithRay(ray);
	if (hit) {
		if (!hit.pickedMesh) return;					
		
		//Do something
	}
}, BABYLON.PointerEventTypes.POINTERPICK);
3 Likes
3

I don’t know if my question has been seen, so let me ask again @PirateJC
Thank you!

1 Like
4

I know he ll answer to ping :slight_smile:

5

Hey @Dad72 - Sorry I missed your question the first time!

Yes you are absolutely correct! Two different methods of achieving the same result! So what to use?

This would definitely be one of those moments where I get out of my depth VERY quickly, so we should definitely bring @Deltakosh into this conversation as he can correct anything that I’m not portraying correctly.

So which one to use? I believe there are 2 main differences between the two methods. The amount of math being calculated under the hood for you, and the ability to multi pick objects. For the ray method, there is math that needs to take the world matrix into account in order to cast the ray out into space. Additionally there is math needed to convert the pointer’s 2D coordinates into a direction for the ray to be cast.

I believe the evt.pickInfo option has less calculation that’s being done to achieve the result because I don’t THINK it has the same world matrix math involved. That being said, I absolutely defer to @Deltakosh to confirm or deny that statement. LOL

So on the surface I would guess that evt.pickInfo would be less expensive operationally.

So why use the pickWithRay method? In general, picking with rays allows you to detect collision with multiple objects instead of just one.
https://doc.babylonjs.com/babylon101/raycasts#multi-pick

While I haven’t tried this specifically with the createPickingRay, I believe it’s the main advantage to use rays as a means of selection.

Again, I want to caveat that I am by no means the expert, so apologies if I get this wrong, but I hope this is helpful.

2 Likes
6

Thank you for your very complete answer, it helps me to understand their difference.

I’m waiting to see what Deltakosh will add to this. But you answered the question I was asking myself.

Thank you. And no problem for the delay in response, it happens, there are many questions asked on this forum.

2 Likes
7

This is kind of correct. evt.pickInfo is autopopulated and if it provides what you need (so no need to use a specific X or Y then stay with it), then use it directly.

Under the hood evt.pickInfo is using pickWithRay but does not let you control the parameters

In other words, this is not necessary as hit will be exactly the same as evt.pickInfo

scene.onPointerObservable.add((evt)=> { 
    if (evt.event.button !== 0)  return;
	const ray = scene.createPickingRay(scene.pointerX, scene.pointerY, BABYLON.Matrix.Identity(), camera);
	const hit = scene.pickWithRay(ray);
	if (hit) {
		if (!hit.pickedMesh) return;					
		
		//Do something
	}
}, BABYLON.PointerEventTypes.POINTERPICK);
2 Likes
8

Oh sweet! I did not even know that! Always love learning something new!!! Thanks @Deltakosh!

2 Likes