Рендеринг плоскости из 3-х вершин в три. js - PullRequest
2 голосов
/ 19 апреля 2020

Я пытаюсь визуализировать плоскость набором из 3 вершин (как показано). Однако каждый метод, который я пробовал (в основном из SO или официального форума. js), не работает для меня.

// example vertices
const vert1 = new THREE.Vector3(768, -512, 40)
const vert2 = new THREE.Vector3(768, -496, 40)
const vert3 = new THREE.Vector3(616, -496, 40)

Я уже пробовал следующий код для вычисления ширины и высоты плоскости , но я думаю, что это слишком сложно (так как я вычисляю только координаты X и Y, и я думаю, что мой код будет расти экспоненциально, если бы я также добавил координату Z и положение плоскости к этой логике c).

const width = vert1.x !== vert2.x ? Math.abs(vert1.x - vert2.x) : Math.abs(vert1.x - vert3.x)
const height = vert1.y !== vert2.y ? Math.abs(vert1.y - vert2.y) : Math.abs(vert1.y - vert3.y)

Пример: я хочу создать плоскость с 3 углами точек A, B и C и плоскость с 3 углами точек D, E и F.

Пример видео

1 Ответ

2 голосов
/ 19 апреля 2020

Вы можете использовать THREE.Plane.setFromCoplanarPoints () , чтобы создать плоскость из трех копланарных точек. Однако экземпляр THREE.Plane - это всего лишь математическое представление бесконечной плоскости, разделяющей трехмерное пространство на два полупространства. Если вы хотите визуализировать это, рассмотрите возможность использования THREE.PlaneHelper . Или вы используете подход из следующего потока, чтобы вывести плоскость me sh из вашего экземпляра THREE.Plane.

Three. js - PlaneGeometry из Math.Plane

...