Вогнутая форма Three.js из облака точек
В настоящее время я пытаюсь динамически создавать фигуры в Three.js из облака точек. Поэтому я использую ConvexGeometry, он прекрасно работает для выпуклых форм, но становится сложнее, когда мне нужна вогнутая форма.
Я рисую линию на 2D-плоскости (красная линия на снимке экрана), затем беру все точки линии или кривой, клонирую их и вращаю вокруг оси X. И теперь, когда у меня есть облако точек, мне хотелось бы просто создать фигуру. Вот результаты: рендеринг фигур Как вы можете видеть, второй и третий сегменты выглядят хорошо, но для первого сетка не покрывает точки так, как мне нужно. рендеринг вогнутой формы Мне нужны любые предложения или идеи о том, как достичь желаемых результатов.
Вот мой компонент, отображающий форму:
import { Vector3 } from "three";
import { ConvexGeometry } from "three/examples/jsm/Addons.js";
type PointsToGeometryProps = {
pointsData: number[][];
};
export function PointsToGeometry({ pointsData }: PointsToGeometryProps) {
const axis = new Vector3(1, 0, 0);
const basePoints = pointsData.map((p) => new Vector3(p[0], p[1], p[2]));
const rotations = 100;
const points = [...basePoints];
for (let i = 1; i <= rotations; i++) {
const angle = (i * 2 * Math.PI) / rotations;
const rotatedPoints = basePoints
.map((p) => {
if (!p.y) return;
return p.clone().applyAxisAngle(axis, angle);
})
.filter((p) => p);
points.push(...(rotatedPoints as Vector3[]));
}
const geometry = new ConvexGeometry(points);
return (
<mesh geometry = {geometry}>
<meshStandardMaterial />
</mesh>
);
}
заранее спасибо
Соответствующая часть этого вопроса - это просто передача массива элементов Vector3 в функцию ConvexGeometry, и я не уверен, что я могу показать, чтобы это чего-то стоило. Сообщите мне, что вам нужно и в каком виде.
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 1
Я хотел поделиться решением, которое я нашел для своей проблемы. Оказывается, класс LatheGeometry из библиотеки Three.js — это именно то, что мне нужно. Не могу поверить, что я так долго упускал это из виду. Если кто-то еще сталкивается с подобной проблемой, я настоятельно рекомендую использовать LatheGeometry. Вот обновленный фрагмент кода, который мне помог:
import { LatheGeometry, Vector2 } from "three";
type PointsToGeometryProps = {
pointsData: Vector2[];
};
export function PointsToGeometry({ pointsData }: PointsToGeometryProps) {
const rotations = 100;
const rotatedPoints = pointsData.map((p) =>
p.rotateAround(new Vector2(0, 0), Math.PI / 2)
);
const geometry = new LatheGeometry(rotatedPoints, rotations).rotateZ(
-Math.PI / 2
);
return (
<mesh geometry = {geometry}>
<meshStandardMaterial />
</mesh>
);
}
Я надеюсь, что это поможет кому-то еще!
Не могли бы вы показать свой код?