gltumble
This library provides a math class called Trackball
that allows users to tumble an object by
dragging with a mouse, trackpad, or touch screen. It optionally applies inertia such that the object
continues to spin if you flick it.
The trackball does not do anything with quaternions. It simply applies Y rotation (spin) followed by X rotation (tilt).
The trackball avoids rotation about the Z axis. Personally, I like this constraint because I rarely tilt my head in real life. If you find it to be too limiting, try another package such as trackball-controller.
- Interactive Demo using Filament and WebGL 2.0
- The demo source is a single file.
Note that gltumble
emulates the behavior used by sketchfab.com except that it does not support
zooming.
Example
const canvas = document0;const trackball = canvas;const mat = trackball;console;
Install
Install with NPM (npm install gltumble
) or Yarn (yarn add gltumble
), then:
;
Or use one of the following two CDN builds.
<!-- minified build --> <!-- dev build -->
API Reference
new Trackball(element, options)
Constructs a trackball, given an optional DOM element and configuration dictionary. Listens to pointer events on the given DOM element.
trackball.getMatrix()
Returns a flat array of 16 numbers representing the current mat4 transformation.