Javascript 需要在 AFRAME 中更改相机的旋转轴

我正在为我的metaverse应用程序使用AFRAME.我正在try 为我的头像获取第三方透视图(TPP).我在我的模型中使用了带摄像头的旋转组件，以便在旋转come时化身会旋转.我把相机放在我的头像后面一点，以产生TPP效果.为摄像头和头像提供wasd控制.

我能够完美地同步运动，但问题是相机的旋转.相机围绕原点旋转，即以位置="0 0 0"为中心，而不是以化身位置为中心.

这是我正在使用的寄存器组件.

AFRAME.registerComponent("rotate-with-camera", {
tick: (function () {
// create once
const tmpq = new THREE.Quaternion();
const tmpe = new THREE.Euler();

return function (t, dt) {
  if (!this.el.sceneEl.camera) return; // ignore when there is no camera
  const cam = this.el.sceneEl.camera.el; // get the camera entity
  cam.object3D.getWorldQuaternion(tmpq); // get the world rotation
  tmpe.setFromQuaternion(tmpq, "YXZ");
  // set attribute is necesarry for wasd-controls
  this.el.setAttribute("rotation", {
    x: 0,
    y: (tmpe.y * 180) / Math.PI,
    z: 0,
  });
};
})(),
});

这是我在代码中使用的come和avatar.

<!--Camera -->
  <a-entity look-at=".avatar"  look-controls="pointerLockEnabled: false" wasd-controls="acceleration:12;">
    <a-entity camera="near:0.01;" position="4 1.72 177.5"></a-entity>
  </a-entity>

  <!-- Avatar -->
  <a-entity class="avatar" >
    <a-gltf-model
    id="player"
    src="#boyBlue"
    position="4 0.12 175"
    animation-mixer="clip:Idle"
    wasd-controls="acceleration: 12"
    rotate-with-camera
    >
    </a-gltf-model>
  </a-entity>

我希望我的相机以我的头像位置为轴旋转.我如何继续？