Question

I want an imported object in Three.js to appear slowly. I have already searched for answers, but I have still no idea.

To show and hide is working well with this code:

function spielfunktion_01_einblenden() {
    Objekt_Spielfunktion_02 = scene.getObjectByName("Neo02_02");
    Objekt_Spielfunktion_01.traverse(function (child) {
        child.visible = true;
    });
}

Well: How can I get a transition effect to make objects visible?

Thanks in advance! :)

Answer 1

例如，你的场景中有一个立方体（我们想要应用转换的抽象对象）：

var cube = new THREE.Mesh(new THREE.BoxGeometry(2, 2, 2), new THREE.MeshBasicMaterial({
  color: "red",
  transparent: true,
  opacity: 0
}));

以及带有onclick事件的两个按钮，用于通过不透明度转换使我们的多维数据集可见或不可见（其ID为showOn和showOff）：

showOn.addEventListener("click", function(event) {
  cube.visible = true;
  var tweenon = new TWEEN.Tween(cube.material).to({
    opacity: 1
  }, 2000).
  onComplete(function(){
    cube.material.transparent = false;
  });
  tweenon.start();
});

showOff.addEventListener("click", function(event) {
  cube.material.transparent = true;
  var tweenoff = new TWEEN.Tween(cube.material).to({
    opacity: 0
  }, 2000).
  onComplete(function(){
    cube.visible = false;
  });
  tweenoff.start();
});

jsfiddle示例。

Answer 2

你的意思是透明度？在网格上尝试不透明度属性并将其添加到你的场景。

---------------------------------------------------------------------------
LocationParseError                        Traceback (most recent call last)
<ipython-input-8-57649e8bd1d1> in <module>()
      1 import requests
----> 2 r = requests.get('https://www.python.org')

How to animate visibility in three.js?

2 个答案: