A function for raycasting in WEBGL mode in p5js.
Add this CDN to a script tag in your index.html file
<script src="https://cdn.jsdelivr.net/npm/[email protected]/p5-raycast.js"></script>
or Install via the command line
npm i p5-raycast
Define a camera variable called cam
in the setup function
cam = createCamera();
The raycast function accepts three arguments:
rayDistance
: the length of the ray that will be cast into the 3D scene through the mouse position.objectPosition
: An array[x, y, z]
defining the position of the object you want to select in world space.objectRadius
: The distance from the object's position which is considered a "hit".
raycast(rayDistance, objectPosition, objectRadius); // Returns a boolean
The matrix math for un-projecing is done with math.js
Copy and paste this script tag into your index.html
file
<script src="https://cdnjs.cloudflare.com/ajax/libs/mathjs/11.8.1/math.js" integrity="sha512-5nftKkjZO1gtHEWFlUGXi/vuXzFnWTom549IH/gMqOiJHcPfH5z/1DO8/c0qnoG0R8RCVLOeBDXhCjg2+23nqQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.