Question

我有一个用THREE.CanvasRenderer（）渲染的3D立方体，我试图打开一个特定的网页，具体取决于双击立方体的哪个面。但是，无论单击哪个面，都会打开同一页面。一些黑客调试（我不知道如何使用控制台）显示交叉[0] .faceIndex始终是＆＃39; 11＆＃39;。如何让它返回最近的立方体面。

这是我处理这个问题的js部分;

＆＃13;

document.addEventListener('dblclick', onDocumentMouseDblClick, false);

function onDocumentMouseDblClick(event) {

    event.preventDefault();

    mouse.x = (event.clientX / renderer.domElement.width) * 2 - 1;
    mouse.y = -(event.clientY / renderer.domElement.height) * 2 + 1;

    raycaster.setFromCamera(mouse, camera);

    var intersects = raycaster.intersectObject(cube);

    if (intersects.length > 0) {
      if (intersects[0].faceIndex = 1 || 2) {
        window.open("About.html", "_self")
          //title.innerHTML = intersects[ 0 ].faceIndex;
      }
      if (intersects[0].faceIndex = 3 || 4) {
        window.open("Mondrian.html", "_self")
          //title.innerHTML = intersects[ 0 ].faceIndex;
      }
      if (intersects[0].faceIndex = 5 || 6) {
        window.open("page3.html", "_self")
          //title.innerHTML = intersects[ 0 ].faceIndex;
      }
      if (intersects[0].faceIndex = 7 || 8) {
        window.open("page4.html", "_self")
          //title.innerHTML = intersects[ 0 ].faceIndex;
      }
      if (intersects[0].faceIndex = 9 || 10) {
        window.open("page5.html", "_self")
          //title.innerHTML = intersects[ 0 ].faceIndex;
      }
      if (intersects[0].faceIndex = 11 || 12) {
        window.open("page6.html", "_self")
          //title.innerHTML = intersects[ 0 ].faceIndex;
      }

＆＃13;

我开始关注THREE.js interactive cubes example并阅读THREE.raycaster documentation显示交叉点应按最近距离排序。我已经阅读了一些使用Vector3和非投影的SO帖子，这些帖子要么不起作用，要么误解它们。由于声誉，无法将它们联系起来。

Answer 1

最有可能是：

if (intersects[0].faceIndex === 1 || intersects[0].faceIndex === 2) {

每次都返回相同的faceIndex的three.js raycaster.intersectObject（）

1 个答案: