在ThreeJS

Question

我有一个.obj文件，如下所示：

我需要做的是仅缩放手柄的某个部分 - 在这种情况下，手柄实际从顶部向下弯曲的点。所以我希望能够在这种情况下让它们更长。

有没有人有任何指导或示例如何实现这一目标？我看到的所有例子都只是缩放整个模型，而不仅仅是缩放模型的一部分。

我在想我需要根据obj中的顶点创建一个Spline，然后操纵Spline创建，但我希望有更简单的选项，因为我没有＆＃39;我知道如何将模型与Spline结合起来

由于

编辑我相信Splines的答案并不在于它 - 实际上它取决于变形对象的目标属性。当我进一步开始时，我会在这里发帖，如果有人知道我的意思，那么请指出我正确的方向。

编辑2 根据零建议我尝试将SkinnedMeshes与骨骼一起使用。我试图填补skinIndices＆amp;带有skinWeights个对象的Vector4但是Typescript会抛出错误：

  

类型'Vector4'的参数不能分配给number类型的参数

我知道这是一个Typescript问题而不是ThreeJS问题，但我创建了一个具有相同代码的jsfiddle，但其中skinIndices的数组是Vector4.类型我认为的唯一原因那个我的意思不是因为我通过BufferedGeometry函数发送了.obj个THREE.fromBufferGeometry对象：

let geometry = new THREE.Geometry().fromBufferGeometry(frontHandle.children[0].geometry);

编辑3

let geometry = new THREE.Geometry().fromBufferGeometry(frontHandle.children[0].geometry);

for ( let i = 0; i < geometry.vertices.length; i ++ ) {
  let vertex = geometry.vertices[ i ];
  let y = (vertex.y + sizing.halfHeight);

  let skinIndex = Math.floor( y / sizing.segmentHeight );
  let skinWeight = ( y % sizing.segmentHeight ) / sizing.segmentHeight;

  let vectorOne = new THREE.Vector4( skinIndex, skinIndex + 1, 0, 0);
  let vectorTwo = new THREE.Vector4( 1 - skinWeight, skinWeight, 0, 0);

  // Here's where the compliant is
  geometry.skinIndices.push(vectorOne);
  geometry.skinWeights.push(vectorTwo);
}           

编辑4

我解决了上面描述的问题，现在已经解决了这个问题（蓝色手柄是带有多个骨骼的蒙皮网格，而垂直蓝色和绿色线是骨架帮手）：

我还在DATGUI助手中添加了如下内容：

但我仍然无法正确缩放网格。截图中手柄的打结部分应始终保持相同的大小。当我将它们缩小时，我只需要在它们下面的把手部分延伸，并且当袋子变大时希望打结的部分向侧面伸缩。

Answer 1

根据我的理解，您正在尝试使网格变形。有两种主要的网格变形方法：

1. Morph Targets
2. Skeletal Animation

变形目标

变形目标允许您定义多个变换“目标”，或者可以在其间混合网格的关键帧。这通常用于为网格设置动画。变形目标是冗长的。它们基本上是网格的重复，但每个顶点都转换为您希望目标的样子。它们允许对顶点进行非常精细的操作，因为您可以指定每个关键帧的每个顶点的精确变换。但是，如上所述，它们很冗长。您必须以某种方式使每个变形目标可用，以便您可以将目标混合在一起。

如果你有一个2000顶点多边形和3个变形目标，你必须保持6000个顶点的定义。

网状皮肤和骨骼

控制顶点变换的另一种方法是使用骨骼。骨骼允许您向顶点添加多个变换影响，并在某种程度上将顶点组合在一起，以便您可以变换骨骼以获得所需的网格变形，而不必手动调整单个顶点。

您仍然要定义变换关键帧，但是您要为骨骼而不是单个顶点定义它们。这具有节省空间和实现变换重用的优点。您不必为网格中的每个顶点定义新的变换，而是定义将网格绑定到骨架的“皮肤”，并且骨架动画应该适当地运行。

在您的情况下，我不确定哪种方法更合适。我认为皮肤会有所帮助，因为您可以设置手柄中要转换为骨骼的所有顶点的重量，然后省去结和包的重量。然后你可以应用你需要做的任何变换。

three.js支持Skinned Meshes。您可以在此处查看API和演示：Skinned Meshes。