THREE.js Line 在哪里与网格相交答案

【问题标题】：THREE.js Where does Line intersect meshTHREE.js Line 在哪里与网格相交
【发布时间】：2021-09-29 01:04:18
【问题描述】：

我有一个网格myMesh：

  const vertices = new Float32Array( [
    0, 1, 0, 0, 1, 2, 2, 1, 2,
    0, 1, 0, 2, 1, 2, 2, 1, 0
  ]);
  const myGeometry = new THREE.BufferGeometry();
  myGeometry.setAttribute('position', new THREE.BufferAttribute(vertices, 3));
  const myMesh = new THREE.Mesh(myGeometry, new THREE.MeshBasicMaterial({color: 0x00ff00, side: THREE.DoubleSide}));
  scene.add(myMesh);

还有一行myLine:

  var material = new THREE.LineBasicMaterial( { color: "#0000ff"});
  var geometry = new THREE.BufferGeometry();
  const lineVerts = new Float32Array([ 1, 0, 1, 1, 2, 1]);
  geometry.setAttribute('position', new THREE.BufferAttribute(lineVerts, 3));
  var myLine = new THREE.Line( geometry, material );
  scene.add(myLine);

jsfiddle

我想得到线和网格彼此相交的点。这可能吗？

function getIntersection(mesh, line) {
  // get point where they intersect (if they do so)

  return point
}

【问题讨论】：

以stackoverflow.com/q/31587440/1461008开头

标签： three.js line mesh intersection

【解决方案1】：

感谢@WestLangley 提供的链接

也许该解决方案可以帮助其他有同样问题的人：

在线的点之间创建归一化向量
迭代网格的每个面（三角形）
与THREE.Ray 中的.intersectTriangle 确认直线是否与面部相交

  var v1 = new THREE.Vector3(0.5,0,1);
  var v2 = new THREE.Vector3(0.5, 2, 1);
  var dir = new THREE.Vector3();
  dir.subVectors( v2, v1 ).normalize();
  dir.normalize();
  
  var ray = new THREE.Ray(v1, dir);
  
  for (var i = 0; i < vertices.length; i+=9) {
    var a = new THREE.Vector3(vertices[i], vertices[i+1], vertices[i+2]);
    var b = new THREE.Vector3(vertices[i+3], vertices[i+4], vertices[i+5]);
    var c = new THREE.Vector3(vertices[i+6], vertices[i+7], vertices[i+8]);
    
    var target = new THREE.Vector3();
    
    ray.intersectTriangle(a, b, c, false, target);
    console.log(target);
  }

jsfiddle

【讨论】：