Three.js - Как я могу динамически изменять непрозрачность объекта?

Ответ 1

THREE.MeshLambertMaterial extends 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;

(Спасибо Дрю и Дойсу за указание на это)

Я знаю, что есть проблемы с ссылкой на three.js ', но вы можете посмотреть исходный файл для используемого вами класса и просмотреть все свойства/методы, которые он имеет, и если он расширяет что-то еще.

Ответ 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;

Ответ 3

Я знаю, что этот вопрос очень старый, но я хотел дать свой ответ от того, что я использовал, если кому-то это понадобится. С three.js я использовал tweening через Greensock TweenMax/TweenLite. При этом я смог обойти любое свойство любого объекта, и он прошел гладко. Ознакомьтесь с библиотекой здесь. Все, что мне нужно для анимации, было:

TweenLite.to(object, duration, properties);

где продолжительность в секундах и свойства находятся в объекте. "Gotcha" для этого, особенно при использовании функции three.js, заключается в том, чтобы убедиться, что вы задаете конкретный параметр объекта. Например, по этому вопросу, если вы изменяете непрозрачность сетки, вы не можете делать

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

скорее, вам нужно быть более конкретным и написать

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

Надеюсь, это поможет кому-то. Tweening действительно потрясающе!