I am dealing with multiple meshes in my code and I am trying to figure out how to make the renderer display the object that should be in front, somewhat similar to what is shown in this example: --> . I have read about render depth, but I am unsure of how to implement it in my code. For example, if I have two spheres:
var shape1 = new THREE.SphereGeometry(50,10,8,10)
var cover1 = new THREE.MeshNormalMaterial();
var Sphere1 = new THREE.Mesh(shape1, cover1);
scene.add(Sphere1);
Sphere1.position.set(10,0,0);
var shape2 = new THREE.SphereGeometry(50,10,8,10)
var cover2 = new THREE.MeshNormalMaterial();
var Sphere2 = new THREE.Mesh(shape2, cover2);
scene.add(Sphere2);
Sphere2.position.set(-10,0,0);
Now, I want the first Sphere to overlap the other one without changing the z-axis.
The site I am working with is and I am using version r52 of the software.