aframe glft click event

Я пытаюсь поймать событие щелчка для модели glft в сцене. Код сцены ниже.

<a-scene raycaster-autorefresh> 
    <a-assets>
     <a-asset-item id="store_homeModel" src="app/home/store_models/store_model.gltf"></a-asset-item>
     <a-asset-item id="shampoo" src="app/home/product_models/Ayush Shampoo.gltf"></a-asset-item>
     <a-asset-item id="soap" src="app/home/product_models/Ayush Soap.gltf"></a-asset-item>
     <a-asset-item id="facewash" src="app/home/product_models/Citra Pearl face wash.gltf"></a-asset-item>
    </a-assets>


    <a-gltf-model src="#store_homeModel"></a-gltf-model>
    <a-gltf-model src="#shampoo" open-desc"></a-gltf-model>

</a-scene>

и код компонента у меня есть. Но событие щелчка не получает подвох, и я не вижу журнал консоли...

AFRAME.registerComponent('raycaster-autorefresh', {
  init: function () {
    // This will be called after the entity has properly attached and loaded.
    console.log('I am readyyyyy!');
  }
});

AFRAME.registerComponent('open-desc', {  
    init: function() {
        var data = this.data;
        var el = this.el;      
        el.addEventListener('click', function() {
            console.log("hiiiiiiiiiiii");           
        });
    },

});

1 ответ

Решение

Пожалуйста, помните, что a-frame делает весь взгляд на <canvas>, поэтому вы не можете просто использовать мышь, чтобы нажать на любой элемент внутри <a-scene>,

Если вы хотите простой курсор на основе взгляда, вам нужно прикрепить курсор к камере:

<a-camera>
  <a-cursor></a-cursor>
</a-camera>


Если вы хотите использовать мышь, используйте компонент курсора в <a-scene>:

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


Если вы хотите использовать контроллеры Vive / Oculus, вы должны попробовать laser-controls,

Более подробную информацию о свойствах и событиях, связанных с курсором, можно найти в документации.

Другие вопросы по тегам