three.js漫游

使用Three.js可以实现漫游效果，具体实现方法如下：

1.创建一个Three.js场景，并添加相机和灯光。

2.创建一个包含所有需要漫游的物体的组。

3.使用OrbitControls.js或者FlyControls.js等控制器来控制相机的移动。

4.在每一帧中更新控制器，并渲染场景。

以下是一个简单的Three.js漫游的代码示例：

import * as THREE from 'three';
import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls';

// 创建场景
const scene = new THREE.Scene();

// 创建相机
const camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
camera.position.set(0, 0, 5);

// 创建灯光
const light = new THREE.PointLight(0xffffff, 1, 100);
light.position.set(0, 0, 10);
scene.add(light);

// 创建物体
const geometry = new THREE.BoxGeometry();
const material = new THREE.MeshPhongMaterial({ color: 0x00ff00 });
const cube = new THREE.Mesh(geometry, material);
scene.add(cube);

// 创建控制器
const controls = new OrbitControls(camera, renderer.domElement);

// 渲染场景
const renderer = new THREE.WebGLRenderer();
renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);

function animate() {
  requestAnimationFrame(animate);

  // 更新控制器
  controls.update();

  // 渲染场景
  renderer.render(scene, camera);
}

animate();