Threejs物联网，养殖场3D可视化（二）

      var camera;
      var renderer;
      var mesh;
      function init() {
        // 创建一个场景，它将包含我们所有的元素，如物体，相机和灯光。
        var scene = new THREE.Scene();
        var urls = [
          'assets/textures/posx.jpg',
          'assets/textures/negx.jpg',
          'assets/textures/posy.jpg',
          'assets/textures/negy.jpg',
          'assets/textures/posz.jpg',
          'assets/textures/negz.jpg'
        ];
        var cubeLoader = new THREE.CubeTextureLoader();
        scene.background = cubeLoader.load(urls);
        // 创建一个摄像机，它定义了我们正在看的地方
        camera = new THREE.PerspectiveCamera(50, window.innerWidth / window.innerHeight, 0.1, 30000);
        // 将摄像机对准场景的中心
        camera.position.x = 5500;
        camera.position.y = 3000;
        camera.position.z = 2000;
        camera.lookAt(scene.position);
        var orbit = new THREE.OrbitControls(camera);
        // 创建一个渲染器并设置大小，WebGLRenderer将会使用电脑显卡来渲染场景
        // initialize basic renderer
        renderer = new THREE.WebGLRenderer({
          antialias: true,
          logarithmicDepthBuffer: true,
        });
        renderer.setSize(window.innerWidth, window.innerHeight);
        // 添加环境光
        scene.add(new THREE.AmbientLight("#ffffff", 1.5));
        // 将呈现器的输出添加到HTML元素
        document.getElementById("dom").appendChild(renderer.domElement);
        // 在屏幕上显示坐标轴
        var axes = new THREE.AxesHelper(10000);
        // scene.add(axes);
        initModel();
        // 启动动画
        renderScene();
        // 添加模型
        function initModel() {
          var mtlLoader = new THREE.MTLLoader();
          mtlLoader.setPath("assets/models/obj_mtl/")
          mtlLoader.load('yangzhichang.mtl', function(materials) {
            materials.preload();
            var objLoader = new THREE.OBJLoader();
            objLoader.setMaterials(materials);
            objLoader.load('assets/models/obj_mtl/yangzhichang.obj', function(object) {
              mesh = object;
              object.traverse(function(node) {
                if (node.material) {
                  node.material.side = THREE.DoubleSide;
                }
              });
              scene.add(mesh);
            });
          });
        }
        document.addEventListener('click', onDocumentMouseDown, false);
        function onDocumentMouseDown(event) {
          // 点击屏幕创建一个向量
          var vector = new THREE.Vector3((event.clientX / window.innerWidth) * 2 - 1, -(event.clientY / window
            .innerHeight) * 2 + 1, 0.5);
          vector = vector.unproject(camera); // 将屏幕的坐标转换成三维场景中的坐标
          var raycaster = new THREE.Raycaster(camera.position, vector.sub(camera.position).normalize());
          var intersects = raycaster.intersectObjects(mesh, true);
          if (intersects.length > 0) {
            var name = intersects[0].object.name;
            var obj = scene.getObjectByName(name);
            console.log(obj)
            scene.remove(obj);
          }
        }
        function renderScene() {
          orbit.update();
          requestAnimationFrame(renderScene);
          renderer.render(scene, camera);
        }
        // 渲染的场景
        renderer.render(scene, camera);
      }
      window.onload = init;