three.js - 如何動態更改對象的不透明度？

這是我的目標：three.js - 如何動態更改對象的不透明度？

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;

現在的問題是我怎麼可以改變紋理的透明度???

感謝:-)

來源

2011-12-14 BorisD

我認爲在使用不透明度功能時，請謹記[https://www.udacity.com/course/viewer#!/c-cs291/l-91376562/m-103530762]。這是來自課程的材料，因此您可能需要觀看以前的視頻，但它們很短。 – 2014-03-28 20:17:33

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;

（謝謝德魯和的DOI指出這一點）

我知道有與three.js所「參考」的問題，但你可以看看該類的源文件你可以使用並查看它擁有的所有屬性/方法，以及它是否擴展其他任何內容。

來源

2011-12-14 13:53:01

謝謝喬治......我想你是我的three.js GURU; - ）...我找到了我自己的解決方案，它花了我一段時間......但它又是瞭解它的最好方法 – BorisD 2011-12-14 15:18:32

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;

來源

2011-12-14 15:20:36 BorisD

我知道這個問題很古老，但我想給我的答案從我使用的情況下，有人需要它。隨着three.js，我通過Greensock的TweenMax/TweenLite補間。這樣，我就能夠補間任何物體的任何財產，並順利運行。檢查圖書館here。所有我需要補間的屬性是：

TweenLite.to(object, duration, properties);

其中持續時間在秒和屬性中的對象。這個「陷阱」，尤其是在使用three.js時，是爲了確保你對對象參數有特定的含義。例如，每這個問題，如果要更改網格的不透明度，你不能這樣做

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

相反，你需要更具體，寫

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

我希望這可以幫助別人。補間真的很棒！

來源

2013-12-13 23:38:56

three.js - 如何動態更改對象的不透明度？

回答

相關問題