Note: This documentation is for the old 0.2.0 version of A-Frame. Check out the documentation for the current 0.5.0 version

The raycaster component provides for an entity the ability to do intersection testing with a raycaster. The raycaster component is a helper component. By itself, it does not do anything, but it can be and is used by components such as the cursor component. The raycaster component will poll for intersections with other entities and set this.intersectedEl to the closest intersected entity.


intersectedElThe entity currently intersecting the raycaster.
raycasterthree.js raycaster object.


Event NameDescription
intersectionRaycaster intersecting with an entity.
intersectionclearedRaycaster no longer intersecting with an entity.

Using the Raycaster

To use the raycaster, we can specify the raycaster component as a dependency of another component.

AFRAME.registerComponent('my-component', {
dependencies: ['raycaster'],
init: function () {
this.raycaster = this.el.components.raycaster;