创建透明圆柱体

时间:2012-07-17 15:11:40

标签: javascript webgl three.js

我正在尝试创建一个透明圆柱体。我试过设置透明,不透明等,但似乎无法让它工作。有没有办法做到这一点?我是否需要加载带alpha通道的虚拟纹理?有更简单的方法吗?

material = new THREE.MeshBasicMaterial({wireframe: true});
material.transparent = true;
mesh = new THREE.Mesh(new THREE.CylinderGeometry(4, 4, 50, 8, 1, true), material);
scene.add(mesh);

更新:我已将代码更改为以下内容,但以这种方式使用ShaderMaterial似乎是错误的。但它有效......

material = new THREE.ShaderMaterial({wireframe: true, transparent: true});
mesh = new THREE.Mesh(new THREE.CylinderGeometry(4, 4, 50, 8, 1, true), material);
scene.add(mesh);

更新:这是图片。

  • 我无法正确添加图片或添加链接,因为我需要11的声誉,而且只有10,所以我添加了断开的链接。在每个网址前添加“h”。

TTP://img692.imageshack.us/img692/6412/shadermaterial.png 使用ShaderMaterial,您会看到由透明圆柱包围的矩形灰色Sprite。

http://img855.imageshack.us/img855/3988/opacity00.png 使用MeshBasicMaterial和Opacity 0.0。

http://img27.imageshack.us/img27/6087/opacity05.png 使用不透明度为0.5的MeshBasicMaterial。

http://img837.imageshack.us/img837/8043/opacity10.png 将MeshBasicMaterial与Opacity 1.0一起使用。

1 个答案:

答案 0 :(得分:3)

不应该是这个吗?

material = new THREE.MeshBasicMaterial( { wireframe: true, opacity: 0.5 } );