如何增加沿 x 和 z 轴的拉伸几何体的厚度 - Three.js

Posted

技术标签:

【中文标题】如何增加沿 x 和 z 轴的拉伸几何体的厚度 - Three.js【英文标题】:How to increase the thickness of the extrude geometry along x and z axis - Three.js 【发布时间】:2014-12-04 00:54:44 【问题描述】:

我已经使用拉伸几何体创建了一个形状,现在我需要通过拉伸设置来增加我使用过的厚度bevelThickness它会增加厚度沿y轴,但需要沿x和z轴增加。

这里是我的工作jsfiddle

以下是我的拉伸设置代码,

var extrusionSettings = 
            curveSegments:5,
            steps: 10,
            amount: 10,
            bevelEnabled: true,
            bevelThickness: 120,
            bevelSize: 0,
            bevelSegments: 8,
            material: 0,
            extrudeMaterial: 1
        ;

        var geometry1 = new THREE.ExtrudeGeometry( shape1, extrusionSettings );

        var materialLeft = new THREE.MeshLambertMaterial(
            color: 0xd6d6d6,// red  
            transparent:true,
            side: THREE.DoubleSide,
            ambient: 0xea6767,
            opacity:-0.5
        );
        var materialRight = new THREE.MeshLambertMaterial(
            color: 0xcc49c3,//violet                
            side: THREE.DoubleSide,
            ambient: 0xcc49c3
        );         

        var materials = [  materialLeft, materialRight                               
                            ];

        var material = new THREE.MeshFaceMaterial( materials );
        var mesh1 = new THREE.Mesh( geometry1, material );          
        object.add( mesh1 );
        object.rotation.x = Math.PI / 2;

        scene.add( object );

下面是示例图片

有什么设置可以增加吗?任何人都可以指导我吗?

【问题讨论】:

请参阅threejs.org/examples/webgl_geometry_shapes.html,了解如何挤出带有孔的形状。 @WestLangley here 是我的另一个小提琴,我曾将孔用于拉伸形状,但要创建这个需要 2 个路径值(1 个用于形状,另一个用于孔),但在我的我将只得到一个路径值(外部路径形状)的过程是可能生成另一个内部路径(孔) 您必须自己创建孔路径...此外,请花时间试验演示中的每个参数值,并确保您了解它所代表的含义。查看您的代码,您似乎还没有理解所有内容。 【参考方案1】:

最后我做了修复它的技巧,我所做的只是我克隆了一个网格并将位置添加到克隆的网格中,所以我在另一个内壁附近找到了墙,通过这种方式我添加了多个克隆与循环,附近的多个内壁造成了墙体加厚,

演示:Fiddle

//outer wall mesh 
var mesh1 = new THREE.Mesh( geometry1, material );
  object.add( mesh1 );

  var mesh_arr=new Array();
  for(i=0.1;i<15;i++)
  

      //cloned mesh,add position to the cloning mesh
      mesh_arr[i] = mesh1.clone();
      mesh_arr[i].position.set(i,i,i);
      mesh_arr[i].updateMatrix();
      object.add( mesh_arr[i] );

   

【讨论】:

以上是关于如何增加沿 x 和 z 轴的拉伸几何体的厚度 - Three.js的主要内容,如果未能解决你的问题,请参考以下文章

运动的6个自由度

平行于全局轴的矩阵旋转

真实物体(固体流体)的微元体应力状态

在四元数旋转上应用镜像效果的有效方法?

在 3D 中查找 X、Y 和 Z 轴的角度 - OpenGL/C++

将围绕任意轴的旋转解析为围绕 X、Y 和 Z 轴的旋转