http://cur.lv/4x9e0 (Earn BTC)
/**
* Transform a THREE.CSS3DObject object so that it aligns to a given rectangle.
*
* @param object: A THREE.CSS3DObject object.
* @param v: A list of the 4 vertices of the rectangle (clockwise order) on which to align the object.
*/
function alignObject(object, v) {
// width of DOM object wrapped via CSS3DObject
var width = parseInt(object.element.style.width, 10);
// compute rect vectors from rect vertices
var v10 = v[1].clone().sub(v[0]);
var v30 = v[3].clone().sub(v[0]);
// compute (uniform) scaling
var scale = v10.length() / width;
// compute translation / new mid-point
var position = new THREE.Vector3().addVectors(v10, v30).multiplyScalar(0.5).add(v[0]);
// compute rotations
var rotX = -v30.angleTo(new THREE.Vector3(0, -1, 0));
// FIXME: rotY, rotZ
// apply transformation
object.scale.set(scale, scale, scale);
object.position = position;
object.rotateX(rotX);
}
