three.js中有一个叫做 "渲染器" 的组件, 它负责把场景中的对象渲染到浏览器窗口中. 你可以使用以下代码来创建一个渲染器:
const renderer =new THREE.WebGLRenderer();
renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);
在这段代码中, 我们使用 THREE.WebGLRenderer 类来创建了一个渲染器. 然后我们调用 setSize() 方法来设置渲染器的大小, 并把渲染器的 DOM 元素添加到文档中.
要渲染场景, 你需要在渲染器上调用 render() 方法, 并传入场景和相机作为参数. 例如:
renderer.render(scene, camera);
你也可以使用渲染器的 setClearColor() 方法来设置背景颜色:
renderer.setClearColor(0xffffff);
如果你想要在场景中添加多个图层, 你可以使用 THREE.Scene 对象的 add() 方法来添加不同的对象. 例如:
const layer1 =new THREE.Mesh(geometry, material1);
const layer2 = new THREE.Mesh(geometry, material2);
scene.add(layer1);
scene.add(layer2);
然后你就可以使用多个相机来渲染这些图层, 或者使用单个相机, 并设置不同的视口来渲染不同的图层.
希望这些信息对你有帮助!