Threejs使用LOD根据摄像机距离物体的距离显示不同的物体

var lod = new THREE.LOD();
// 创建一个基础材质的立方体
function createBoxGeometryBasicMaterialImg() {
  var texture = THREE.ImageUtils.loadTexture("assets/textures/brick-wall.jpg");
  var mat = new THREE.MeshPhongMaterial();
  mat.map = texture;
  // 创建一个立方体并设置大小
  var cubeGeometry = new THREE.BoxGeometry(8, 8, 8);
  var cube = new THREE.Mesh(cubeGeometry, mat);
  // 设置立方体位置
  cube.position.x = -10;
  cube.position.y = 3;
  cube.position.z = 0;
  return cube;
}
// 创建一个基础材质的立方体
function createBoxGeometryBasicMaterial() {
  // 创建一个立方体并设置大小
  var cubeGeometry = new THREE.BoxGeometry(14, 14, 4);
  // MeshBasicMaterial（基础材质不会对光源有反应只会使用指定的颜色渲染）
  var cubeMaterial = new THREE.MeshBasicMaterial({
    color: 0xff0000,
  });
  var cube = new THREE.Mesh(cubeGeometry, cubeMaterial);
  // 设置立方体位置
  cube.position.x = -5;
  cube.position.y = 10;
  cube.position.z = -30;
  return cube;
}
// 创建一个球形几何体
function createSphereGeometryLambertMaterial() {
  var textureLoader = new THREE.TextureLoader();
  // 创建一个球体
  var sphereGeometry = new THREE.SphereGeometry(4, 20, 20);
  var cubeMaterial = new THREE.MeshStandardMaterial({
    map: textureLoader.load("assets/textures/brick-wall.jpg"),
  });
  // cubeMaterial.map.wrapS = THREE.RepeatWrapping;
  // cubeMaterial.map.wrapT = THREE.RepeatWrapping;
  var sphere = new THREE.Mesh(sphereGeometry, cubeMaterial);
  // 位置范围
  sphere.position.x = 20;
  sphere.position.y = 4;
  sphere.position.z = 2;
  return sphere;
}
// 将立方体添加到场景中
var cube = createBoxGeometryBasicMaterial();
lod.addLevel(cube, 200);
// 将立方体添加到场景中
var cube_img = createBoxGeometryBasicMaterialImg();
lod.addLevel(cube_img, 100);
// 将球体添加到场景中
var sphere = createSphereGeometryLambertMaterial();
lod.addLevel(sphere, 300);
scene.add(lod);
function renderScene() {
  orbit.update();
  lod.update(camera)
  // 使用requestAnimationFrame函数进行渲染
  renderer.render(scene, camera);
  requestAnimationFrame(renderScene);
}