setAttribute for animation component 'to' attribute using position 设置失败

Question

我正在使用 A-Frame (webVR) 制作多全景浏览器。这个世界有几个 3d 按钮（每个按钮位置都有全景映射的球体）。您单击一个按钮，动画组件将相机从其当前位置移动到按钮位置。包含侦听器（用于按钮上的单击事件）的自定义组件使用 setAttribute 设置相机上动画组件的 'to' 和 'from' 属性。发射命令触发动画。不幸的是它失败了，我可以看到 'from' 属性设置不正确（它设置为与 'to' 相同）。它不会抛出错误，但我可以在控制台中看到 from 不会设置，即使我明确地设置了它。

我已经在以前的版本中使用了它。您可以在此处查看和测试它： https://glitch.com/~camera-jumper

在这个版本中，我没有设置from属性，它仍然可以正常工作，大概是因为它采用了以前的值作为默认值。

然后我内置了一些其他功能，但现在它失败了。您可以在此处查看当前版本： https://glitch.com/~panojumper

AFRAME.registerComponent('buttoncontrol', { 
    schema: {
        pano:{type:'string',default: 'pSphere1'} 
    },  
    init: function(){   
        var el = this.el;       
        var cam = document.querySelector('#camera'); 
        var panoManEntity = document.querySelector('#panoMan'); 
        var panoName = this.data.pano;
        console.log(cam.getAttribute('animation__jump', 'to'));
        this.el.addEventListener('click', function(evt){

            // Animate the camera moving to the button position
            var btnpos = el.getAttribute('position'); 
            var cam = document.querySelector('#camera');
            var campos = cam.getAttribute('position');              

            cam.setAttribute('animation__jump','to', {x: btnpos.x, y: 
              btnpos.y, z: btnpos.z });             
            cam.setAttribute('animation__jump','from', {x: campos.x, y: 
              campos.y, z: campos.z });     
            cam.emit('camjump');
        }); 
    }
});

我希望 'from' 的 setAttribute 是我设置的值，但它与 'to' 值相同。

Answer 1

设置from属性似乎有效，您可以通过修改您的第一个故障来验证它。添加 from 属性，它仍然正常工作：

var campos = cam.getAttribute('position')
// Animate the camera moving to the button position
cam.setAttribute('animation__jump','to', {x: btnpos.x, y: btnpos.y, z: btnpos.z });
cam.setAttribute('animation__jump','from', {x: campos.x, y: campos.y, z: campos.z });

fiddle here.

如果您在 <head> 中或至少在 <a-scene> 之前注册自定义组件，其他故障也会起作用。在 docs.

中也有关于它的注释

fiddle here.

Answer 2

你成功了！自定义组件一定不能在场景中，而要在头部。我移动它是因为我的 assets 标签在场景标签之前，这会引发错误，所以我将场景标签向北移动得太远了。将场景标签移动到 registerComponents 下方解决了这个问题。所有这些都在文档中，但我是菜鸟。谢谢你的帮助！

setAttribute for animation component 'to' attribute using position 设置失败

setAttribute for animation component 'to' attribute using position fails to set

javascript

aframe