仅 Aframe 广告牌 Y 轴

Question

我正在使用 this component 让图像在 Aframe 场景中始终面向相机。它工作正常，但我需要让广告牌只在 Y 轴上工作，想象图像是一个人，这个人应该只转身跟随相机，而不是在相机靠近时仰望。

知道如何修改该组件来实现吗？

Answer 1

通过将目标的 Y 坐标设置为与对象广告牌相同来管理：

this.vector.y = object3D.position.y;  //this line is new
return object3D.lookAt(this.vector);

Answer 2

This thread 导致仅在 y-axis 上旋转实体的简单解决方案。这是一个 self-contained 组件：

AFRAME.registerComponent('look-at-y', {
  schema: {
    target: {type: 'string', default: 'camera'}
  },
  init: function () { },
  update: function () { },
  tick: function () {
    const targetEl = document.getElementById(this.data.target).object3D;
    const el = this.el.object3D;
    const vec = new THREE.Vector3();
    targetEl.getWorldDirection(vec);
    vec.y = 0;
    vec.add(el.position)
    el.lookAt(vec);
  }
});

这通过在计算要查看的向量时忽略目标实体的 Y 位置来实现。

将 vec.y = 0 更改为 vec.x 或 vec.z 将改为在其他轴上显示广告牌。为了更进一步，您可以修改此组件以采用“轴”架构参数并动态交换它！

仅 Aframe 广告牌 Y 轴

Aframe Billboarding Only Y Axis

javascript

three.js

aframe