A幀切換實體可見組件不會渲染360圖像

我試圖在我的單頁應用中交換實體以使用我生成的一些測試按鈕來模擬場景切換。它適用於'scene3DModel'，但切換到'scene360'時，設置爲src的360圖像將不會渲染當其他「場景」被註釋掉時，360圖像正確呈現。A幀切換實體可見組件不會渲染360圖像

標記爲 '場景' 的實體：

<a-entity id="sceneHome" visible="true"> 
     <a-sky color="#6EBAA7"></a-sky> 
    </a-entity> 

    <a-entity id="scene360" visible="false"> 
     <a-sky src='url(/assets/360-photo.jpg)'></a-sky> 
    </a-entity> 

    <a-entity id="scene3DModel" visible="false" gltfpostprocessing gltf-opaque update-sun fog="density:1.3; near:4.0;"> 
    <!-- procedural environment--> 
    <a-entity environment="preset: yavapai; seed: 5; skyColor: #cbdff7; horizonColor: #d8e0ae; shadow: true; shadowSize: 25.0; lightPosition: 10 40 30; fog: 0.91; playArea: 1; ground:hills; groundYScale: 4; groundColor: #c69c7b; groundColor2: #c1a582; dressingAmount: 0; dressingUniformScale: false; grid: crosses; gridColor: #bb9977"></a-entity> 
    <!-- scene lights--> 
    <a-entity light="type: ambient; color: #fffcf2; intensity: 0.6; "></a-entity> 
    <!--3D Models--> 
    <a-entity id="loaded-model" gltf-model="#temple-gltf" ></a-entity> 
    </a-entity>

生成的標記爲按鈕 - 活動正在發射正確

<a-entity view-toggle-test="" id="view-toggle" position="0 1 2" rotation="0 180 0" scale="0.2 0.2 0.2" visible=""> 
    <a-triangle position="0 0" text="value:image;color:red;width:4;align:center" rotation="" scale="" visible="" material="" geometry="height:0.1846484165324745;width:4;primitive:triangle"></a-triangle> 
    <a-triangle position="0 1.5" text="value:home;color:red;width:4;align:center" rotation="" scale="" visible="" material="" geometry="height:0.1846484165324745;width:4;primitive:triangle"></a-triangle> 
    <a-plane position="0 3" text="value:model;color:red;width:4;align:center" rotation="" scale="" visible="" material="" geometry=""></a-plane> 
</a-entity>

場景管理器組件

AFRAME.registerComponent('scene-manager', { 
    schema: { 
    }, 
    init: function(){ 
     var self = this 
     var el = this.el; 
     window.addEventListener('activeSceneChanged',(e)=> { 
      nextScene = e.detail.activeScene; 
      self.setScene(nextScene) 
     }); 
    }, 
    setScene: function(nextScene){ 
     var sceneHome = document.getElementById('sceneHome'); 
     var scene360 = document.getElementById('scene360'); 
     var scene3DModel = document.getElementById('scene3DModel'); 

     //stupid version of swapping logic 
     if(nextScene == 'sceneHome'){ 
      scene360.setAttribute('visible', 'false'); 
      scene3DModel.setAttribute('visible', 'false'); 
      sceneHome.setAttribute('visible', 'true'); 
     }if(nextScene == 'scene360'){ 
      sceneHome.setAttribute('visible', 'false'); 
      scene3DModel.setAttribute('visible', 'false'); 
      scene360.setAttribute('visible', 'true'); 
     }if(nextScene == 'scene3DModel'){ 
      sceneHome.setAttribute('visible', 'false'); 
      scene360.setAttribute('visible', 'false'); 
      scene3DModel.setAttribute('visible', 'true'); 
     } 
    } 
});

來源

2017-10-17 aaaavvvv

我使用的環境組件的環境設置覆蓋了a-sky 360.我切換到k幀模板進行場景管理，並且正在切換屬性 - 環境，{active：false}

來源

2017-10-19 12:25:14 aaaavvvv

A幀切換實體可見組件不會渲染360圖像

回答

相關問題