通过相机旋转计算x z在平面上的移动

时间:2019-03-28 13:25:29

标签: javascript three.js augmented-reality hammer.js

我在AR空间中使用HammerJS移动对象3D。

只要我不移动手机(即相机),它就可以正常工作...

const newTranslation = new THREE.Vector3(this._initTranslation.x + e.deltaX, this._initTranslation.y, this._initTranslation.z + e.deltaY);

init ...是Object3D的原始版本

当我四处移动时,运动仍然在我开始的x z轴上。 (我将手指在手机上向上移动(以将对象向后移动(沿z轴)),而不是从左向右移动)

我知道我必须将摄影机旋转数纳入考虑范围,才能将摄影机旋转到世界,但不知道该怎么做。

预先感谢您的帮助。

1 个答案:

答案 0 :(得分:2)

我自己修好了。如果有人需要,这是我的解决方案:

我现在以相机旋转角度旋转该点:

const movePoint = new THREE.Vector2(e.deltaX, e.deltaY);
movePoint.rotateAround(new THREE.Vector2(0, 0), this.getCameraAngle());

const newTranslation = new THREE.Vector3(this._initTranslation.x + movePoint.x, 
this._initTranslation.y, this._initTranslation.z + movePoint.y);

对于摄像机角度:

public getCameraAngle (): number {
  const cameraDir = new THREE.Vector3();
  this._arCamera.getWorldDirection(cameraDir);
  cameraDir.setY(0);
  cameraDir.normalize();

  return Math.atan2(cameraDir.z, cameraDir.x) - Math.atan2(-1, 0);
}