Question

我已经提到了以下关于对象轮换的问题。

link 1 link 2 link 3 link 4 link 5

但无法准确理解如何围绕特定点旋转圆柱？

Answer 1

我假设您的意思是您希望对象围绕其几何中的特定点旋转。

例如，cylinderGeometry围绕它的中心旋转。假设您希望它围绕 end 旋转。

您需要做的是在创建圆柱体几何体后立即进行平移，以便几何体内的所需点现在位于原点。

geometry.applyMatrix( new THREE.Matrix4().makeTranslation( 0, cylinderHeight/2, 0 ) );

编辑：你现在可以这样做，而不是：

geometry.translate( 0, cylinderHeight/2, 0 ); // three.js r.72

现在，当您旋转圆柱体时，它现在将围绕其末端而不是其中间旋转。

它旋转的末端也将位于您为圆柱网格设置的位置。

显然，您可以使用任何几何体来完成此操作，而不仅仅是圆柱体。

Answer 2

为WestLangley的上述答案提供代码示例：

// CYLINDER
var cyl_material = new THREE.MeshBasicMaterial( { color: 0xff0000 } );
var cyl_width = 1;
var cyl_height = 5;
// THREE.CylinderGeometry(bottomRadius, topRadius, height, segmentsRadius, segmentsHeight, openEnded )
var cylGeometry = new THREE.CylinderGeometry(cyl_width, cyl_width, cyl_height, 20, 1, false);
// translate the cylinder geometry so that the desired point within the geometry is now at the origin
cylGeometry.applyMatrix( new THREE.Matrix4().makeTranslation( 0, cyl_height/2, 0 ) );
var cylinder = new THREE.Mesh(cylGeometry, cyl_material);

scene.add( cylinder );

现在旋转工作在圆柱体原点周围：

cylinder.rotation.x = 0.5*Math.PI;

希望有所帮助。

Answer 3

以下功能可用于实现此目的。请注意，几何是平移的，但网格的位置不会改变。

//rotates a mesh's geometry about a specified axis and pivot
//the axis is a normalized Vector3
const rotateAbout = (mesh, axis, axisPosition, angle) => {
    mesh.geometry.applyMatrix(new THREE.Matrix4().makeTranslation(mesh.position.x-axisPosition.x, mesh.position.y-axisPosition.y, mesh.position.z-axisPosition.z));  //translate geometry to axis location
    mesh.geometry.applyMatrix(new THREE.Matrix4().makeRotationAxis(axis, angle));    //rotate geometry about axis
    mesh.geometry.applyMatrix(new THREE.Matrix4().makeTranslation(axisPosition.x-mesh.position.x, axisPosition.y-mesh.position.y, axisPosition.z-mesh.position.z));  //translate geometry back to original location
}

three.js - 如何围绕特定点旋转圆柱体？

3 个答案: