javascript - Three.js - 编辑面孔

标签 javascript three.js

我想我会在这里问这个问题,因为我在任何地方都找不到任何信息(SO 或 three.js 文档)- 如何获得特定面孔的平均 x、y、z 坐标?或者至少,有没有办法获取构成面的三个顶点的 x、y、z 坐标?然后用那些来计算平均值?

目前为止

var fLength = plane.geometry.faces.length;
for (var i = 0; i < fLength; i++) {
    var f = plane.geometry.faces[i];
    //How do I get the x,y,z of the current/i face?
    //Is there a way to move this face? 
    //Is there a way to extrude this face? Or do -anything- with it for that matter?
}

此外,除了移动顶点之外,是否有任何方法可以移动面?挤压面怎么样?我意识到这是相当多的问题,但是所有这些的过程对我来说似乎有点不清楚......

最佳答案

每个Three.js Face3包含属性 abc。这些是同一几何对象的顶点数组的索引。例如,使用

v1 = plane.geometry.vertices[f.a];

获取Vector3表示面部第一个顶点的位置。

Three.js 没有提供很多方便的方法来修改现有对象的几何形状。与底层图形 API 一样,它的重点是快速组合和显示主要是静态对象的场景(顶点着色器操作除外)。

您必须手动调整构成面的各个顶点(并设置正确的脏标志),或者如果您的修改有效地修改了边,则甚至需要重建面。根据您的用例,使用顶点着色器执行操作可能更简单。

关键是,快速构建和修改几何体的话题变得很棘手。如果您在那里需要任何帮助,请务必提出一个特定问题,概述您希望对几何体进行的操作。

关于javascript - Three.js - 编辑面孔,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34388501/

相关文章:

javascript - 如何在 Three.js 中从圆柱体中挤出高度段?

javascript - 在 JSON.parse 中使用变量

javascript - 有条件地加载外部脚本不起作用,没有错误

javascript - 如何从平面 JavaScript 数组创建分层 HTML 结构?

javascript - Three.js - 当我将指针放在 THREE.Line 上时,我的程序死掉了

javascript - 我如何在我的 android 应用程序中使用 ThreeJS,或者是否有类似和强大的库像三个 js

javascript - "Type RootQueryType must define one or more fields."}

javascript - 根据滚动更改固定元素的最高值

Three.js/GLSL - 将像素坐标转换为世界坐标

javascript - 突出显示 Three.js 中的 THREE.Line