threejs-mouse-tracker

This package is made to track the mouse position within a three dimenional space using Three.js Raycaster.

• threejs-mouse-tracker
  • Install
    • npm
    • yarn
  • Getting started
  • Contributing
  • Credits
  • License

Install

npm

  npm install threejs-mouse-tracker

yarn

  yarn add threejs-mouse-tracker

Getting started

All you need to start tracking is the snippet below.

import * as THREE from 'three'
import MouseTracker from 'threejs-mouse-tracker'

// prepare renderer, camera and scene

const wireframe = new THREE.Mesh(
  new THREE.PlaneBufferGeometry(10, 10, 10, 10).rotateX(-Math.PI / 2),
  new THREE.MeshBasicMaterial({
    color: 0xff0000,
    wireframe: true
  })
);

scene.add(wireframe);

const mouse = new MouseTracker({
  mesh: wireframe,
  camera,
  // tracker: (xyz) => console.log(xyz),
  debug: true
});

scene.add(mouse.object);

// render camera and scene using renderer

Full example in examples/plain.ts

Contributing

Consult CONTRIBUTING.md to start contributing to threejs-mouse-tracker.

Credits

Yuri Artiukh [aka @akella]

License

The MIT License (MIT)