Threejs-围绕中心旋转对象

Threejs - rotation object around center

本文关键字:旋转 对象 Threejs-      更新时间:2023-09-26

我有这个代码的工作解决方案:

var collisionGroup = new THREE.Group();
scene.add( collisionGroup );
(function() {
  var geometry = new THREE.CircleGeometry( 20, 32 );
  var material = new THREE.MeshBasicMaterial( { color: 0xffff00 } );
  var collisionCircle = new THREE.Mesh( geometry, material );
  collisionCircle.position.z = -180;
  collisionGroup.add( collisionCircle );
})();
function animate(timestamp) {
  // apply camera rotation
  var rotObjectMatrix = new THREE.Matrix4();
  rotObjectMatrix.makeRotationFromQuaternion(camera.quaternion);
  collisionGroup.rotation.setFromRotationMatrix(rotObjectMatrix);
  // Update VR headset position and apply to camera.
  controls.update();
  // Render the scene through the manager.
  manager.render(scene, camera, timestamp);
  requestAnimationFrame(animate);
}

但我想知道是否有可能在不为我想旋转的每个对象创建组的情况下实现这一点(会有很多)。这些对象的位置是基于相机旋转的,这就是为什么我使用makeRotationFromQuaternion和rotation.setFromRotationMatrix。

也许有比存储相机四元数更简单的解决方案。

我不确定这是否是您想要实现的一个好的替代方案,但您可以考虑直接将对象添加到相机中(相机也是THREE.Object3D实例)。作为摄影机的子对象,这将使其位置和旋转相对于摄影机的位置和旋转。