Javascript Three.js-使用深度和方向向量的挤出计量法

我想挤出一个形状并创建一个

extractegeometry

，但该形状必须被挤出到某个方向。我在向量3中有一个方向

形状在x、y平面中绘制，通常z是拉伸方向（拉伸深度）。因此，方向向量

（0,0,1）

将导致默认拉伸。但例如，一个

（0,0，-1）

会在另一个方向上挤出形状

我第一次尝试使用挤出路径来实现这一点，但当使用路径时，形状可以自由“旋转”，初始方向是任意的。这不是我需要的，形状必须保持方向不变。您可以阅读有关此的详细信息

我已经想到了将矩阵应用于结果挤出边几何的后半个顶点的想法，但我似乎无法得到我想要的几何体。也许是我笨拙地使用了矩阵，但我认为在这个技巧之后，面法线是指向内向外的

注意方向向量永远不会与z轴正交，因为这会给出无效的形状

---

那么问题是：

如何获得可靠的解决方案，将形状挤出到给定方向。这里有一个例子。形状是x、y平面上的正方形（宽度和长度为2000）。拉伸深度也为2000，有三个不同的矢量，在2D（前视图）和3D中可以看到预期结果的图形

---

通过指定拉伸深度，以常规方式拉伸几何体，然后拉伸到几何体

var matrix = new THREE.Matrix4();

var dir = new THREE.Vector3( 0.25, 1, 0.25 ); // you set this. a unit-length vector is not required.

var Syx = dir.x / dir.y,
    Syz = dir.z / dir.y;

matrix.set(   1,   Syx,   0,   0,
              0,     1,   0,   0,
              0,   Syz,   1,   0,
              0,     0,   0,   1  );

geometry.applyMatrix4( matrix );

下面是如何指定将倾斜几何图形的剪切矩阵

var matrix = new THREE.Matrix4();

var dir = new THREE.Vector3( 0.25, 1, 0.25 ); // you set this. a unit-length vector is not required.

var Syx = dir.x / dir.y,
    Syz = dir.z / dir.y;

matrix.set(   1,   Syx,   0,   0,
              0,     1,   0,   0,
              0,   Syz,   1,   0,
              0,     0,   0,   1  );

geometry.applyMatrix4( matrix );

（three.js坐标系的y轴向上——与您的图示不同。您必须适应。）

---

three.js r.113

不为您的平台编写代码，但我会尝试以下方法：1。旋转网格，使方向向量与轴2对齐。应用轴对齐挤出3。将结果旋转回原来的方向，我看到了您在我寻求解决此问题时提到的答案。但我不知道如何将我的方向正确地转换成剪切矩阵来得到正确的结果。你能为我的例子演示一下如何做到这一点吗。那太好了！我为你扩展了我的答案。我打赌你可以从这里得到它。在当前版本中，它是

geometry.applyMatrix4（矩阵）@daniel谢谢。更新。