如何使用 setAttribute 更改 A-Frame 中对象的位置？

【问题标题】：How do I change the position of an object in A-Frame using setAttribute?如何使用 setAttribute 更改 A-Frame 中对象的位置？
【发布时间】：2018-07-26 20:49:39
【问题描述】：

我在 0.8.0 中遇到了这个问题。我的

<a-sphere id="ball" position="-1 0.59 -4"></a-sphere>

已存在于<body> 的<a-scene> 中。点击这个球后，我希望它的位置变为 -3 0.59 -3。我试过了

document.getElementById("ball").setAttribute('position', '-3 0.59 -3')
document.getElementById("ball").setAttribute('position', {x:-3, y:0.59, z:-3}) 
document.getElementById("ball").object3D.position.set('-3 0.59 -3')

但它们似乎都不起作用。

我正在构建一个应用程序，其中球的位置会更改为单击光标的位置。

【问题讨论】：

标签： aframe virtual-reality webvr

【解决方案1】：

两种方法：

document.getElementById("ball").setAttribute('position', '-3 0.59 -3')
document.getElementById("ball").setAttribute('position', {x:-3, y:0.59, z:-3})

正确并将球移动到选定的位置。在我的fiddle 中查看。

有可能是你：
1.在加载场景之前调用方法，因此无法抓取球。
2. 没有设置光标或鼠标来处理渲染的对象。
设置鼠标很简单——只需将cursor 组件添加到场景中：

<a-scene cursor="rayOrigin: mouse">

一定要查看光标上的docs。

3. 没有为点击正确设置事件监听器，我是这样做的：

 AFRAME.registerComponent("foo", {
   init: function() {
      this.el.addEventListener("click", (e)=>{
        //do Your thing here
      })
   }
 })

如果您对组件系统不熟悉，请务必查看out。

【讨论】：