logo标签列表

在THREE.js中按索引设置面的透明度

three.js
4

我已经成功使用以下代码设置了网格面的颜色：


geometry.faces[i].color.setHex('0xff00ff');

是否有一个函数可以将透明度设置为真，不透明度设置为0.5？ 我确信有这个函数，但我不知道语法。

1个回答
6
实际上，你不能通过更改几何来实现透明度控制，因为透明度由材质控制。但有方法可以做到这一点。首先，每个面都有一个材质索引（请参阅Face manual）。接下来，场景中绘制的每个网格都有材质。还有一种特殊的材质类型THREE.MeshFaceMaterial（请参阅MeshFaceMaterial manual），它以材质数组作为参数。当绘制面时，three.js渲染器会获取面的材质索引，并使用该材质数组中对应的材质，或者如果网格包含单个材质类型，则使用单个材质。因此，你可以这样做：
var opacMaterial = new THREE.MeshLambertMaterial({
  transparent:true, 
  opacity:0.7
});
var solidMaterial = new THREE.MeshLambertMaterial({
  transparent:false, 
  color:new THREE.Color(1,0,0)
});

var mesh = new THREE.Mesh(
  geometry, 
  new THREE.MultiMaterial([solidMaterial, opacMaterial])
 );

默认情况下，如果您的几何体的每个面都具有materialIndex == 0，则会绘制实体材质。

如果您想使其透明，请执行以下操作：

geometry.faces[i].materialIndex = 1;

不要忘记在网格中更新几何体：(如何更新网格中的几何体问题。)
另外，请注意，如果您的面中的materialIndex大于材质数组的长度，则会在THREE.js内部出现尴尬的错误。
坦白地说，我在这个答案中打错了一个字。我刚刚修正了它。 - Vasiliy Stavenko
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接