Here is an example you can check out:
I noticed that in newer versions of THREE.js, if the render function is called before adding additional objects to the scene, those objects will not be visible even with multiple subsequent calls to render. Is this behavior intentional?
If you'd like to see the full code, here it is:
var cube, cube2, geometry, light, material, renderer;
window.scene = new THREE.Scene();
window.camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 10000);
renderer = new THREE.WebGLRenderer();
renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);
geometry = new THREE.CubeGeometry(75, 75, 16);
material = new THREE.MeshPhongMaterial({
color: 0x0000ff
});
cube = new THREE.Mesh(geometry, material);
cube.position.set(80, 0, -400);
scene.add(cube);
camera.position.fromArray([0, 160, 400]);
camera.lookAt(new THREE.Vector3(0, 0, 0));
light = new THREE.PointLight(0xffffff, 8, 1000);
// If you comment out this line, the second cube will reappear:
renderer.render(scene, camera);
scene.add(light);
geometry = new THREE.CubeGeometry(75, 75, 16);
material = new THREE.MeshPhongMaterial({
color: 0x0000ff
});
cube2 = new THREE.Mesh(geometry, material);
cube2.position.set(-80, 0, -400);
cube2.castShadow = true;
scene.add(cube2);
renderer.render(scene, camera);