#three.js #rotation #translate-animation
#three.js #вращение #перевод-анимация
Вопрос:
В three.js r96, существует translate(x, y, z). Я бы использовал это, чтобы переместить объект из его исходной точки.
Теперь в r103 это устарело для translateX(x), однако при просмотре вывода сетки на консоль я вижу, что если у меня есть позиция, скажем, position.set(50,0,0) и traslateX(50), то атрибуты сетки показывают позицию (100,0,0).
https://codepen.io/anon/pen/XQVmyZ
Вот пример проблемы. В этом коде у меня есть три плоскости. Вращающаяся плоскость должна поворачиваться по оси y в точке пересечения красного и синего.
Если ширина моей плоскости равна 100, то установка позиции в (50,0,0) должна переместить синюю центральную точку к самому правому краю красного. Это должно быть новое происхождение blue.
Теперь, если я переведу синий на ось x 50, тогда исходная точка все равно должна находиться в том же месте, но теперь синий при повороте будет вращаться по оси Y, расположенной в самой внешней левой точке синего. Как вы видите, это не так.
Взгляд на сетку показывает, что нет translate, а есть только position .
plane3.position.set(50,0,0);
//plane3.translate(50,0,0); //Used to work
plane3.translateX(50); //New translate, adds to position instead
//var vector = new THREE.Vector3( 1, 0, 0 );
//plane3.translateOnAxis(vector,40);
function render() {
requestAnimationFrame( render );
plane3.rotation.y = 0.03;
renderer.render( scene, camera );
}
Мой желаемый результат таков, каким он был, когда я мог повернуть синий на крайнюю левую ось Y.
Ответ №1:
Кажется, вы смешиваете устаревший Object3D.translate()
метод с BufferGeometry.translate()
. Если вы переводите геометрию вместо 3D-объекта, можно изменить точку поворота, как ожидалось. Я надеюсь, что обновленный codepen покажет ваш предполагаемый визуальный результат:
Комментарии:
1. Ты да Человек. Большое вам спасибо. Это именно то, что я пытаюсь сделать.