useRaycaster()

The raycaster couples the user's mouse inside the browser with the 3D scene, translating the 2D position into 3D space.

Usage

You need to import it from the package as a dependency:

import { useScene, useCamera, useRenderer, useRaycaster } from '@heyokajs/nuxt';


const scene = useScene()
const camera = useCamera()
const renderer = useRenderer()

const { intersects, onClick, onPointerMove } = useRaycaster(scene.children, { renderer, camera, raycaster })

onClick((data) => {
  if (intersects.value.length > 0) {
    // do whatever
  }
});

onPointerMove((data) => {
  if (intersects.value.length > 0) {
    // do whatever
  }
});

Options

intersects

Array of objects that the raycaster intersects with.

onClick

Function to execute when an object is clicked.

onPointerMove

Function to execute when the pointer moves over an object.