three.js
three.js copied to clipboard
RFC: RaycasterHelper
Hey! 👋
I made a very simple raycaster helper for myself, was wondering if it isn't worth adding this along the other existing helpers.
https://user-images.githubusercontent.com/1862172/162688071-4993e811-2fe0-4b8a-99c6-99c38214d78e.mov
Try it here https://6tc01w.csb.app/
It displays:
- a segment going from origin to near + near to far
- the two near/far points
- optionally displays any hit via instances - this could just be points tbh
- optionally displays wether or not any hit exists
The style is halfway between @gkjohnson 's bvh ray visualizations and three's directional light helper
API is:
const raycaster = new Raycaster(origin, direction, near, far)
const helper = new RaycasterHelper( raycaster, 5 ) // raycaster + max number of hits to display
// in your loop
const hits = raycaster.intersectObjects( scene.children )
helper.hits = hits;
Some boring nuance:
- all the elements created by the helper have their raycast set as null, otherwise they'd always be hit by the ray they are visualizing 😓
- there's some inefficiency in the way lines are updated, but that should be easily fixed if it's worth doing
- all the components of the visualization are exposed as properties of the object, so they can be easily overridden, eg.
const helper = new RaycasterHelper( raycaster )
// make the hits red instead of white
helper.hitsVisualization.material.color = "#ff005b"
![Screen Shot 2022-04-11 at 12 58 49 PM](https://user-images.githubusercontent.com/97088/162819676-5aac8b97-809f-4d9e-977c-358a65e3fad3.png)
🤔
I'm also confused by these points:
![Screen Shot 2022-04-11 at 1 00 12 PM](https://user-images.githubusercontent.com/97088/162820321-8050a0f0-c34e-448c-94f2-0b431dbf9f74.png)
🤔
Looks good though!
Would be nice to put it in examples/jsm/helpers/
.
@mrdoob ops, that's silly me, I recorded this from a demo where I'm doing some experiments with layers, so there's a third capsule that doesn't show up in the camera layer lol
Also fixed the sandbox link, I forgot to remove some typescript when copypasting 😊
Ah I see...
Yeah, sounds good to me!
By the way, I just noticed that CapsuleGeometry
's normals seem to have something wrong at the poles 🤔
![Screen Shot 2022-04-14 at 11 12 25 AM](https://user-images.githubusercontent.com/97088/163451776-f410a03c-023a-4d2b-bda0-1e27539b09ff.png)