Three.js - PlaneGeometry from Math.Plane

Question

Я пытаюсь нарисовать плоскость наименьших квадратов через множество точек в Three.js. У меня есть plane определяется следующим образом:

var plane = new THREE.Plane(); 
plane.setFromNormalAndCoplanarPoint(normal, point).normalize(); 

Мое понимание, что мне нужно сделать этот самолет и использовать его, чтобы придумать геометрии для того, чтобы создать сетку, чтобы добавить в сцену для показа:

var dispPlane = new THREE.Mesh(planeGeometry, planeMaterial); 
scene.add(dispPlane); 

Я пытаюсь применить this answer для получения геометрии. Это то, что я придумал:

plane.setFromNormalAndCoplanarPoint(dir, centroid).normalize(); 
planeGeometry.vertices.push(plane.normal); 
planeGeometry.vertices.push(plane.orthoPoint(plane.normal)); 
planeGeometry.vertices.push(plane.orthoPoint(planeGeometry.vertices[1])); 
planeGeometry.faces.push(new THREE.Face3(0, 1, 2)); 

planeGeometry.computeFaceNormals(); 
planeGeometry.computeVertexNormals(); 

Но самолет не отображается на всех, и нет никаких ошибок, чтобы указать, где я, возможно, не так.

Итак, мой вопрос: как я могу взять объект Math.Plane и использовать его в качестве геометрии для сетки?

Answer 1

Этот подход должен создать визуализацию плоскости сетки. Я не уверен, насколько это применимо, однако, к фитингу с наименьшими квадратами.

// Create plane 
var dir = new THREE.Vector3(0,1,0); 
var centroid = new THREE.Vector3(0,200,0); 
var plane = new THREE.Plane(); 
plane.setFromNormalAndCoplanarPoint(dir, centroid).normalize(); 

// Create a basic rectangle geometry 
var planeGeometry = new THREE.PlaneGeometry(100, 100); 

// Align the geometry to the plane 
var coplanarPoint = plane.coplanarPoint(); 
var focalPoint = new THREE.Vector3().copy(coplanarPoint).add(plane.normal); 
planeGeometry.lookAt(focalPoint); 
planeGeometry.translate(coplanarPoint.x, coplanarPoint.y, coplanarPoint.z); 

// Create mesh with the geometry 
var planeMaterial = new THREE.MeshLambertMaterial({color: 0xffff00, side: THREE.DoubleSide}); 
var dispPlane = new THREE.Mesh(planeGeometry, planeMaterial); 
scene.add(dispPlane); 

Answer 2

var material = ...; 
var plane = new THREE.Plane(...); 

// Align to plane 
var geometry = new THREE.PlaneGeometry(100, 100); 
var mesh = new THREE.Mesh(geometry, material); 
mesh.translate(plane.coplanarPoint()); 
mesh.quaternion.setFromUnitVectors(new THREE.Vector3(0,0,1), plane.normal); 

Plane.coplanarPoint() Обратите внимание, что просто возвращает -normal*constant, так что может быть лучшим вариантом для использования Plane.projectPoint(), чтобы определить центр, который «близко к» произвольной точке.