aframevr / aframevr/aframe

Raycasting to objects that are not the closest

Open
#4,965 2 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
JavaScript
Stars
17.6k
Forks
4.4k
PR merge metrics
No merged PRs in 30d

Description

Description:

I've been hitting various circumstances in which I want to access raycast entities that are not the closest to the camera.

Specific cases are:

  • In VR, I have a control system where I can grab an object with the raycaster and move it around. While grabbed, I want the raycast line to always point to the grabbed object, even when it passes behind a closer raycastable object.
  • I have some small objects that appear always on top (using depthTest: false). I want raycasting experience with these to match what the user sees, so when they can see an object, they can interact with it, even when it is further away than another object.
  • Plus one more case involving a transparent plane that I want to be able to grab with a raycast, but also want to be able to raycast through.

So far I have been working around this in my application code:

  • I have a customized version of "raycaster-line" that picks the correct item to draw a line to.
  • I have code to grab objects that steps through the list of raycast matches to find the top priority one.

However I'm now needing to solve a similar problem in a situation where I use cursor.js.

I could make some modifications to cursor.js, but it occurred to me that a more elegant solution would be to allow raycaster to have a configurable object priority order to use, instead of distance order.

This would mean that I could define my precedence order in one place, and avoid having custom code in each of:

  • raycaster-line
  • cursor
  • my own application code.

I have made some code changes to raycaster.js, and it's all working fine apart from one fix I needed to make to cursor as well.

PR to follow soon...

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start by reading raycaster.js and cursor.js, then inspect the customized raycaster-line behavior described in the issue. Trace how raycast matches are ordered and consumed by these components; done means a configurable object-priority order works consistently for raycaster-line, cursor, and application raycast interactions, including transparent and non-closest targets.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript
Domain
frontend, game-dev
Issue type
Feature
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
30/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.