Встроенный A-Frame и rayOrigin: мышь - PullRequest
0 голосов
/ 20 марта 2019

Это то, над чем я работаю: 360 Tour . У меня есть встроенная сцена A-Frame, и мне просто нужен простой значок горячей точки, который будет загружать новую страницу при щелчке мышью (переводчик в другую комнату в туре). Это должно быть встроено, чтобы я мог держать стиль css, адаптивный HUD, пристыкованный к краю рамы.

Похоже, что активная интерактивная область смещается в зависимости от размера окна. Эта тема звучит похоже на мою проблему , но их решением было обновление скрипта компонента, и этот скрипт теперь включен в основной скрипт A-Frame (?).

Есть ли установка курсора, которую я пропускаю? Я новичок в A-Frame с ... ( проверяет часы ) ... на прошлой неделе и новичок в Javascript с недели до этого, поэтому я не удивлюсь, если это что-то простое, я недоразумение

Любое руководство или советы с благодарностью. Вот мой A-Frame:

<div id="vrwindow">
  <a-scene embedded="true"  antialias="true" cursor="rayOrigin:mouse" >
      <a-assets>
        <img id="granite" crossorigin="" src="images/granite.png">
        <img id="quartzite" crossorigin="" src="images/quartzite.png">
        <img id="frost" crossorigin="" src="images/frost.png">
        <img id="fieldstone" crossorigin="" src="images/fieldstone.png">
        <img id="riverrock" crossorigin="" src="images/riverrock.png">
        <img id="baltic" crossorigin="" src="images/baltic.png">
        <img id="alpine" crossorigin="" src="images/alpine2.png">
        <img id="linen" crossorigin="" src="images/linen.png">
        <img id="hawthorne" crossorigin="" src="images/hawthorne.png">
        <img id="hemingway" crossorigin="" src="images/hemingway.png">
        <img id="hickory" crossorigin="" src="images/hickory2.png">
        <img id="hotspot" crossorigin="" src="images/bedroom.png">
      </a-assets>

      <a-sky id="bigimage" src="images/guestroom.jpg" rotation="0 -90 0"> 
        </a-sky>    
      <a-circle navigate-on-click="url: junkroom.html" 
       src="images/bedroom.png" position="-2 0 -8"></a-circle>
      <a-camera fov="70"  look-controls>    </a-camera>
  </a-scene>          
</div>  

и скрипт компонента, который я использую

    AFRAME.registerComponent('navigate-on-click', {
schema: {
  url: {default: ''}
},

init: function () {
  var data = this.data;
  var el = this.el;

  el.addEventListener('click', function () {
    window.top.location.href = data.url;
  });
}
});  

1 Ответ

0 голосов
/ 22 марта 2019

Ответ высокого уровня состоял в том, чтобы переместить приложение A-Frame в I-Frame и использовать postMessage для управления сценой A-Frame, чтобы она могла перемещаться, сохраняя состояние приложения и 2D HUD.

...