three.js - THREE.js Line 在哪里与网格相交

Question

我有一个 Mesh 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
}

标签： three.jslinemeshintersection

Answer 1

感谢您提供的链接@WestLangley

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

1. 在线的点之间创建归一化向量
2. 迭代网格的每个面（三角形）
3. 检查线是否与.intersectTriangle面THREE.Ray相交

  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