如何使用a - frame在触发时设置对象的旋转以匹配Vive控制器的旋转?

How do I set an object's rotation to match a Vive controller rotation upon trigger using A-Frame?

本文关键字：旋转 控制器 Vive 对象 设置 何使用 frame      更新时间：2023-09-26

以项目a - frame Dominoes为例，我创建了一个基本的a - frame应用程序，当按下Vive触发器时生成对象。

我可以让新生成的对象在触发时匹配Vive的控制器位置，但是我无法想出一种方法来匹配新对象的旋转到控制器的旋转。

这是我尝试过的:

onTriggerDown: function () {
  var sceneEl = d3.select(this.el.sceneEl);
  var controllerWorldPosition = this.el.object3D.getWorldPosition();
  var controllerWorldRotation = this.el.object3D.getWorldRotation();
  sceneEl.append('a-obj-model')
         .attr('id', 'base-street-children')
         .attr('scale', '0.01 0.01 0.01')
         .attr('position', controllerWorldPosition)
         .attr('rotation', controllerWorldRotation)
         .attr('src', '#base-street-obj')
         .attr('mtl', '#base-street-mtl');
},

有什么特别的设置一个新的对象的旋转与JavaScript，我错过了?

在Three.js中，旋转以弧度为单位，但在A-Frame中旋转以度为单位。因为你是从Three.js Object3D中提取旋转数据，所以你需要在将其应用于a - frame实体之前进行转换。

在你的例子中是这样做的:

.attr('rotation', function() {
  var controllerWorldRotationX = controllerWorldRotation._x / (Math.PI / 180);
  var controllerWorldRotationY = controllerWorldRotation._y / (Math.PI / 180);
  var controllerWorldRotationZ = controllerWorldRotation._z / (Math.PI / 180);
  return controllerWorldRotationX + ' ' + controllerWorldRotationY + ' ' + controllerWorldRotationZ;
})
相关文章：