Cómo cambiar el zOrder de objeto con Threejs?

Question

Me hizo una escena utilizando la webgl representador de donde puedo poner varios objetos en 3D que me puede seleccionar y mover.Sin embargo, cuando un objeto está seleccionado, me gustaría llamar su eje.No hay problema con el dibujo de las líneas del centro del objeto, pero me gustaría que aparecen delante de cualquier otra cosa en la escena de manera que sean visibles incluso si otros objetos están en el frontal Como en la Licuadora.

Traté de jugar con el renderDepth param pero creo que no he entendido cómo usarlo y no me dieron resultado.

Gracias por su ayuda.

Answer 1

Si usted quiere algunos objetos a procesar "en la parte superior", o "en el frente", un truco es crear dos escenas, la primera escena es su escena, y la segunda escena contiene los objetos que desea tener en la parte superior.

En primer lugar, establecer

renderer.autoClear = false;

A continuación, cree dos escenas

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

Agregar los objetos de la primera escena, como de costumbre, y agregar los objetos de su deseo de tener en la parte superior a la segunda escena.

Luego, en su render() la función, hacer esto:

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

Esto hará que la primera escena, borrar el búfer de profundidad, y luego renderizar la escena segunda en la parte superior.

Aquí es un Violín: http://jsfiddle.net/d9Lzdkkr/

---

EDITAR:Otra solución es tener una sola escena, pero el uso de este patrón:

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

Si la malla tiene un solo material, se va a convertir "en la parte superior".

three.js r.85