用three.js挤压

时间:2012-07-09 14:51:08

标签: path geometry three.js

我想沿圆形挤出一个矩形来制作一个3d环 我查看了webgl_geometry_extrude_shapes.html示例,但我无法用圆圈更改示例路径。 有人可以发一个例子吗? 提前谢谢!

1 个答案:

答案 0 :(得分:3)

我认为你正在寻找一种叫做Lathe的不同类型的'挤压'。 您需要创建一个带有描述偏移矩形的点的路径,然后将其传递给LatheGeometry并插入到Mesh实例中:

lathe view 1

lathe view 2

e.g。

var pts = [
            new THREE.Vector3(150,0,50),//top left
            new THREE.Vector3(200,0,50),//top right
            new THREE.Vector3(200,0,-50),//bottom right
            new THREE.Vector3(150,0,-50),//bottom left
            new THREE.Vector3(150,0,50)//back to top left - close square path
           ];
var mesh = new THREE.Mesh( new THREE.LatheGeometry( pts, 12 ), new THREE.MeshLambertMaterial( { color: 0x2D303D, wireframe: true, shading: THREE.FlatShading } ));
mesh.position.y = 150;
mesh.overdraw = true;
mesh.doubleSided = true;

scene.add( mesh );

在LatheGeometry构造函数中,第一个参数是您想要作为点数组进行车削的路径,第二个参数是步数(步数越多,细节/径向迭代越多)和第三个(我是我没有在示例中使用)是角度 - 默认情况下它是360,但你也可以控制它。

关于这些点,请注意它们在x轴上偏移一点。定位您的点不仅会影响正方形车床的尺寸,还会影响车床偏移(偏移量为0应该可以得到一个完整的气缸)。此外,这些点会影响车床轴(注意我使用了XZ)。

如果您不熟悉车床的概念,您可能应该在3D编辑器中进行游戏,因为大多数都支持该功能。 (有点偏离主题,但这种操作在Illustrator的支持下有效> 3D> Revolve)