Como alterar o zOrder de objeto com Threejs?

Question

Eu fiz uma cena usando o webgl, processador de onde eu colocar vários objetos 3D que eu possa selecionar e mover.No entanto, quando um objeto é selecionado, eu gostava de desenhar seus próprios eixos.Nenhum problema com as linhas de desenho para o centro do objeto, mas gostaria de aparecer na frente de qualquer outra coisa no cenário de modo que eles são visíveis, mesmo se outros objetos que estão na frente, Como em um Liquidificador.

Eu tentei jogar com o renderDepth param, mas eu não acho que eu entendi como usá-lo e eu não obter qualquer resultado.

Obrigado por sua ajuda.

Answer 1

Se você quiser alguns objetos para compor "em cima" ou "em frente", um truque é criar duas cenas, a primeira cena é o seu regular de cena, e a segunda cena contém os objetos que você deseja ter em cima.

Primeiro, defina o

renderer.autoClear = false;

Em seguida, crie duas cenas

var scene = new THREE.Scene();
var scene2 = new THREE.Scene();

Adicionar os objetos para a primeira cena, como de costume, e adicionar os objetos que deseja ter no topo para a segunda cena.

Em seguida, no seu render() a função, faça o seguinte:

renderer.clear();
renderer.render( scene, camera );
renderer.clearDepth();
renderer.render( scene2, camera );

Isso irá tornar a primeira cena, limpar o buffer de profundidade e, em seguida, compor a segunda cena na parte superior.

Aqui é um Violino: http://jsfiddle.net/d9Lzdkkr/

---

EDITAR:Outra solução é ter apenas uma cena, mas usar este padrão:

mesh.renderOrder = 999;
mesh.onBeforeRender = function( renderer ) { renderer.clearDepth(); };

Se a malha tem um único material, o que irá tornar o "em cima".

three.js r.85