Skip to content
rotate3d manipulation library - lightweight and extensible
JavaScript
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Failed to load latest commit information.
demo
README.md
rotor.js

README.md

ʀoToᴙ.js

rotate3d manipulation library

Demo

Here is a simple demo.

Main Features

  • enables manipulation of DOM nodes on three rotation axis, as if it was wrapped in a virtual trackball
  • set and get current rotation of rotor enabled nodes
  • lightweight (2.4k minified / 1.3k gzipped) and clean code base
  • built with extensibility in mind (event helpers and geometry utils included)

API

rotor( elem, [options] )

Rotor constructor: enables manipulation of elem on three rotation axis. The only option currently availbale is inertia, which is on by default.

// create a new rotor instance and disable inertia
rtr = rotor( elem, { inertia: false } );

.rotation( [axisAngle] )

Rotation getter/setter: modify or access the current rotation of a rotor instance

// setter
rtr.rotation({
    x: xVal,
    y: yVal,
    z: zVal,
    a: angle
});
// getter
rtr.rotation();

.on() / .off()

Enable/Disable manipulation of a rotor instance

// disable
rtr.off();
// re-enable
rtr.on();

rotor.aaProd( axisAngle0, axisAngle1 )

Combine two rotations by calculating the product of two axis-angles

// Rotate a DOM node by 90deg on the Z axis,
// relative to its current rotation
var currentRotation = rtr.rotation(),
    zRotation = {
        x: 0,
        y: 0,
        z: 1,
        a: Math.PI / 2
    },
    newRotation = rotor.aaProd( currentRotation, zRotation );

rtr.rotation( newRotation );

More

rotor.js is easy to extend using its event helpers and geometry utils, see the wiki.

Credits & License

Inspired from traqball.js by dirkweber

Geometry algos adapted from euclideanspace.com

MIT Licensed http://louisremi.mit-license.org/

Something went wrong with that request. Please try again.