Создание линий, которые могут быть изменены с конца

Question

Итак, я хотел бы создать несколько строк, которые могут быть изменены из точек, соединяющих их.

Пример исходного состояния

Сначала один был перемещен вниз, второй и третий вправо и вниз.

На стороне реализации у меня в настоящее время есть две сетки. Первый из них растянут так, что он будет охватывать расстояние от начальной точки до следующей точки, а второй - отправную точку.

var meshLine = new THREE.Mesh(boxGeometry, material); 
meshLine.position.set(x,y,z); 
meshLine.scale(1,1,distancetonextpoint); 

var meshPoint = new THREE.Mesh(sphereGeometry, material); 
meshPoint.position.set(x,y,z); 
meshPoint.scale(2,2,2); 

То, что я хочу от него в том, что, когда пользователь перетаскивает круговую точку другие линии будут растягиваться или изменить их положение соответственно на один тащат.

Есть ли еще несколько разумных решений для этого, поскольку я чувствую, что моя не совсем хорошая и чистая. Я должен был сделать довольно тяжелый подъем, чтобы добиться этого.

Я также посмотрел на this example, который выглядит визуально очень красиво, но не может интегрировать его в мою систему.

Answer 1

Вы имеете в виду, что вам нужно отредактировать геометрию объекта, перетащив их вершины (здесь строка).

1. Объекты не могут перетаскивать объекты, поэтому вам нужно пройти через геометрию и создать маленькие сферы в каждой точке вершин;
2. Вы устанавливаете raycaster для выбора тех сфер, как в примерах;
3. Ваш экран 2D, чтобы перетаскивать объекты в 3D, вам нужна поверхность, перпендикулярная экрану, которая пересекает положение сферы. Для этого вы устанавливаете невидимую плоскость в положение вершины и заставляете ее смотреть на камеру;
4. Как только вы можете правильно перетаскивать сферы, вы указываете соответствующие вершины на объекте (ваши линии), они должны сохранять ту же позицию, что и их сферы;
5. Конец с geometry.verticesNeedUpdate=true.

И у вас есть новая геометрия

• Для получения дополнительной информации коды на собирание объектов смотрите на официальном сборе objects'example draggable cubes
• This example показывает, как использовать его для редактирования объектов

Комментарий, если вам нужно больше объяснений