3つのJS - メッシュが平面と交差するすべての点を見つける

Question

メッシュと交差する平面を含むthree.jsシーンを作成しました。私がしたいのは、メッシュのエッジが平面を横切るすべての場所の点の配列を取得することです。私は解決策を探していて、何も見つけられないようです。ここで

は、私が現在持っているものの画像です：

そして、ここで私は私が収集しようとしている座標強調している：誰もが私を指すことができる場合

を正しい方向に、それは最も高く評価されるでしょう。

おかげで、

S

Answer 1

これは究極のソリューションではありません。これはあなたが始めることができるところです。

UPD：Here与えられた点から輪郭を形成する方法を、この答えを拡張したものです。

また、それがTHREE.Object3D()の.localToWorld()方法についてWestLangleyとリーStemkoskiから素晴らしいanwersでthis SO questionと呼ばれます。

通常のジオメトリ（たとえば、THREE.DodecahedronGeometry()）の交差点を探しているとしましょう。

アイデア：

1. THREE.Plane()は

2. メッシュ面（THREE.Face3()）

   が含ま.intersectLine (line, optionalTarget)方法を有する

3. 各面はa, b, c特性の指標を有します頂点保存された。

4. 我々は頂点のインデックスを知っているとき、我々は顔の頂点の座標を知ったとき、我々は持っているとき、私たちは3つのTHREE.Line3()オブジェクト

5. を構築することができますvertices

6. の配列からそれらを得ることができますが3行、私たちの平面がそれらを交差するかどうかを調べることができます。

7. 交差点がある場合は、配列に格納できます。

   私たちはTHREE.DodecahedronGeometry()

   でTHREE.PlaneGeometry()とobjあるplane、聞かせてのを持っている：メッシュ

コードといくつかの説明の各面のための7 -

繰り返し、3ステップTHREE.Plane()：

var planePointA = new THREE.Vector3(), 
    planePointB = new THREE.Vector3(), 
    planePointC = new THREE.Vector3(); 

var mathPlane = new THREE.Plane(); 
plane.localToWorld(planePointA.copy(plane.geometry.vertices[plane.geometry.faces[0].a])); 
plane.localToWorld(planePointB.copy(plane.geometry.vertices[plane.geometry.faces[0].b])); 
plane.localToWorld(planePointC.copy(plane.geometry.vertices[plane.geometry.faces[0].c])); 
mathPlane.setFromCoplanarPoints(planePointA, planePointB, planePointC); 

を作成します。

ここでは、planeの任意の面の3つの頂点が同一平面上にあるので、.setFromCoplanarPoints()メソッドを使用して、mathPlaneを作成できます。当社objの顔を通して

その後、我々はよループ：

var a = new THREE.Vector3(), 
    b = new THREE.Vector3(), 
    c = new THREE.Vector3(); 

    obj.geometry.faces.forEach(function(face) { 
    obj.localToWorld(a.copy(obj.geometry.vertices[face.a])); 
    obj.localToWorld(b.copy(obj.geometry.vertices[face.b])); 
    obj.localToWorld(c.copy(obj.geometry.vertices[face.c])); 
    lineAB = new THREE.Line3(a, b); 
    lineBC = new THREE.Line3(b, c); 
    lineCA = new THREE.Line3(c, a); 
    setPointOfIntersection(lineAB, mathPlane); 
    setPointOfIntersection(lineBC, mathPlane); 
    setPointOfIntersection(lineCA, mathPlane); 
    }); 

var pointsOfIntersection = new THREE.Geometry(); 
... 
var pointOfIntersection = new THREE.Vector3(); 

と

function setPointOfIntersection(line, plane) { 
    pointOfIntersection = plane.intersectLine(line); 
    if (pointOfIntersection) { 
    pointsOfIntersection.vertices.push(pointOfIntersection.clone()); 
    }; 
} 

最後に我々は我々のポイントが表示されるようになります：

var pointsMaterial = new THREE.PointsMaterial({ 
    size: .5, 
    color: "yellow" 
    }); 
var points = new THREE.Points(pointsOfIntersection, pointsMaterial); 
scene.add(points); 

jsfiddle例。ボタンを押すと、平面と十二面体の交点が得られます。