从2组点计算仿射变换

时间:2013-07-24 14:30:13

标签: javascript 3d geometry three.js

我正在使用 threejs ,并且通过两组THREE.Vector3定义了2个矩形,每组{4}有4个顶点。

如何计算将第一个矩形转换为第二个矩形的仿射变换?

我想通过.applyMatrix(matrix)将计算的仿射变换应用于第三个矩形。

enter image description here

解决:

/**
 * 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);
}

2 个答案:

答案 0 :(得分:1)

我正在寻找同样的事情。发现这个: https://github.com/epistemex/transformation-matrix-js

尚未尝试过,但fromTriangles()函数看起来很有希望。

protected void Page_Load(object sender, EventArgs e) { CultureInfo us = new CultureInfo("en-US"); string shortUsDateFormatString = us.DateTimeFormat.ShortDatePattern; string shortUsTimeFormatString = us.DateTimeFormat.ShortTimePattern; Response.Write(shortUsDateFormatString); }

编辑:哎呀,以为我发布了这个评论。它成了一个答案。哦,好吧..

答案 1 :(得分:0)

有计算仿射矩阵的方法,例如,2D-case:Affine transformation algorithm。但是要在3D中找到独特的仿射变换,您需要4个非共面点(对于2d - 3个非共线点也是如此)。 4个共面点(矩形顶点)的M矩阵是奇异的,没有逆矩阵,上述方法不适用。

2d情况的模糊性示例:点B,C,D是共线的。一些仿射变换将它们移动到B,E,F点。但是有无限多的匹配仿射变换。其中两个将A点转换为G或H点。

enter image description here

对于有限类型的仿射变换存在一些解决方案。例如 - 您的第三个矩形是否始终位于XY平面中? 如果是真的,那么变换后的矩形将与第二个矩形位于同一平面上,并且您的问题变得更简单 - 您需要将变化后的矢量bazis中的坐标从(V1,V2,V3)计算到(V1',V2', V3' )。让我们来看A = V2-V1, B = V3-V1, A' = V2'-V1', B' = V3'-V1'。 XY平面中的每个点P(例如,第三个矩形顶点)是线性组合P = V1 + t * A + u * B,它是新平面P' = V1' + t * A' + u * B'中的变换图像。在这种情况下,不难找到t,u系数:t=(P.x - V1.x)/(V2.x-V1.x) u=(P.y - V1.y)/(V2.y-V1.y)