threejs如何在三维场景中添加点击事件

threejs如何在三维场景中添加点击事件

threejs触发点击事件一般通过THREE.Raycaster射线来实现，当射线与物体相交，触发事件

      this.$refs.loadDiv.addEventListener(
        "click",
        this.onDocumentMouseDown,
        false
      );

    onDocumentMouseDown: function(event) {
      event.preventDefault();
      var raycaster = new THREE.Raycaster();
      var mouse = new THREE.Vector2();
      mouse.x =((event.clientX - 200) / this.renderer.domElement.clientWidth) * 2 - 1;
      mouse.y =-((event.clientY - 60) / this.renderer.domElement.clientHeight) * 2 + 1;
      raycaster.setFromCamera(mouse, this.camera);
      var intersects = raycaster.intersectObjects(this.scene.children, true);
      //当intersects.length > 0说明碰撞到物体，获取最近的物体名称进行判断
      if (intersects.length > 0) {
        if (intersects[0].object.name == "Video1") {
          // alert("摄像头1");
          this.$router.push({
            path: "/Noisehome3",
            query: {
              Dname: ""
            }
          });
        }
    },