Three.js - 如何动态更改对象的不透明度？

Question

这是我的对象：

var object = new THREE.Mesh( geometry, new THREE.MeshLambertMaterial( { map: THREE.ImageUtils.loadTexture( "image.png" ) } ) );
object.position.set(2, 3, 1.5);

现在我在 init() 中创建了这个对象之后；函数，我可以直接转到对象并更改他的位置，如下所示：

object.position.x = 15;

现在的问题是如何更改纹理的不透明度？？？

谢谢 ：-）

Answer 1

THREE.MeshLambertMaterial 扩展了 THREE.Material 这意味着它继承了 opacity 属性，因此您需要做的就是访问对象上的材质，并更改材质的不透明度：

object.materials[0].opacity = 1 + Math.sin(new Date().getTime() * .0025);//or any other value you like

另请注意，材质的 transparent 属性必须设置为 true。

object.materials[0].transparent = true;

（感谢 Drew 和 Dois 指出了这一点）

更新

该属性现在只是 材料：

// enable transparency
object.material.transparent = true;
// set opacity to 50%
object.material.opacity = 0.5; 

Answer 2

var map = THREE.ImageUtils.loadTexture( myJSONObject[i].url );
var material = new THREE.MeshLambertMaterial( { map: map, transparent: true } );
var object = new THREE.Mesh( geometry, material );

material.opacity = 0.6;

Answer 3

我知道这个问题很老了，但我想根据我使用过的内容给出答案，以防有人需要。对于 Three.js，我通过 Greensock 的 TweenMax/TweenLite 使用补间。这样，我就能够补间任何对象的任何属性，并且运行顺利。请在此处查看该库。我需要补间的属性是：

TweenLite.to(object, duration, properties);

其中持续时间以秒为单位，属性位于对象中。这样做的“陷阱”，特别是在使用 Three.js 时，是确保您了解对象参数的具体情况。例如，对于这个问题，如果您要更改网格的不透明度，您不能

TweenLite.to(mesh, 2, {material.opacity: 0});

这样做，您需要更具体并写下

TweenLite.to(mesh.material, 2, {opacity: 0});

我希望这对某人有帮助。补间真的太棒了！