Javascript 渲染THREE.js后无法添加到场景
见示例: 在THREE.js的较新版本中,如果我在向场景添加其他对象之前调用render,则它们将永远不可见,即使有其他渲染调用。这是预期的行为吗 请参阅完整代码:Javascript 渲染THREE.js后无法添加到场景,javascript,three.js,Javascript,Three.js,见示例: 在THREE.js的较新版本中,如果我在向场景添加其他对象之前调用render,则它们将永远不可见,即使有其他渲染调用。这是预期的行为吗 请参阅完整代码: var cube, cube2, geometry, light, material, renderer; window.scene = new THREE.Scene(); window.camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.i
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);
// comment out this line ot bring back second cube:
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);
实际上,立方体在黑色背景上呈现为黑色 首先渲染没有灯光的场景,然后在添加灯光后再次渲染 正如Wiki文章中所述,在运行时(至少渲染一次材质)无法轻松更改的属性包括灯光的数量和类型 在第一次渲染之前将灯光添加到场景中,一切都将按预期工作 如果必须在第一次渲染后添加灯光,则需要设置
material.needsUpdate = true;
3.js r.68