A-frame Хочешь кликнуть на сущности, показывает другую сущность - PullRequest
Новая
       5

A-frame Хочешь кликнуть на сущности, показывает другую сущность

0 голосов
/ 25 июня 2018

У меня есть объект, и я хочу, чтобы при нажатии или наведении курсора в виде рамки, который изменяет атрибут видимого другого объекта, на значение true. 

<a-entity id="pug" gltf-model="#pug" position="-1.75 0.0035 3" 
 scale="0.01 0.01 0.01" rotation="0 -11 0" >shadow
    event-set__down="_event: mousedown; scale: 1.2 1.2 1.2"
    event-set__up="_event: mouseup; scale: 1 1 1"
    event-set__leave="_event: mouseleave; scale: 1 1 1">
</a-entity>

Если у меня есть такое взаимодействие скурсор работает, но я не знаю, как (или даже если) я могу заставить его влиять на атрибут другого объекта.

Я хочу, чтобы: 

<script>
    $(document).ready(function(){
        $("#pug").mouseenter(function(){
          $('#bubble').attr('visible', 'true');
        });
    });
</script>

У меня есть курсор в моей камерено я не знаю ... Я новичок в A-Frame и, должно быть, мне чего-то не хватает: / Спасибо!

1 Ответ

0 голосов
/ 26 июня 2018

Имейте в виду, что изменение свойств CSS не повлияет на визуализируемые объекты.Лучший способ изменить свойства - использовать entity.setAttribute("attribute", "value")

Я не уверен, что вы можете сделать переключение (видимое / невидимое) с помощью компонента набора событий, но вы можете сделать объектвидимый или невидимый, установив атрибут visible: 

<a-entity event-set__click="_target: a-cylinder; visible: false;"></a-entity>

проверьте его здесь .

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

AFRAME.registerComponent("foo", {
  init: function() {
   this.el.addEventListener("click", (e) => {
    let cylinder = document.querySelector("a-cylinder")
    cylinder.setAttribute("visible", !cylinder.getAttribute("visible"))
   })
  }
})

HTML: 

<a-entity foo>

довольно просто:
1) Бит AFRAME.registerComponent("foo" «объявляет» компонент.
2) Функция init: function() выполняется при инициализации компонента
3) Внутри слушателя щелчка я сделал простой переключатель, который устанавливает видимость, противоположную фактическому значению.Если он видим, переключите его на! Visible = false.

Проверьте это здесь .

...