2017-07-21 41 views
2

在React VR中編寫場景有點麻煩,因爲你總是被困在第一人稱視圖中,這使得很難判斷物體放置的深度。如何將相機更改爲React VR中的第三人?

默認情況下,相機放置在[0, 0, 0] coords,我想知道是否有辦法控制它。在docs找不到任何東西,但我知道它們不完整。如果有可能的話,它可以爲像這樣的專用編輯器鋪平道路。

editor view in a-frame

回答

1

添加到這裏的答案。

  1. 你可以得到一個「editor'y覺得使用核素和Atom,這些鏈接的陣營VR文檔here
  2. 發現爲了移動相機的位置,你可以使用自定義ThreeJS攝像頭並將其添加到您的場景,這樣您可以留下您的VR元素不變

    const vr = new VRInstance(bundle,"ReactVR",parent, { camera:customCamera,/*your custom threeJS camera*/ ...options, });

您的自定義相機也能像

import { PerspectiveCamera } from "three"; 

const VIEW_ANGLE = 60; 
const ASPECT = document.body.clientWidth/document.body.clientHeight; 
const NEAR = 0.1; 
const FAR = 10000; 


const camera = new PerspectiveCamera(VIEW_ANGLE, ASPECT, NEAR, FAR); 

camera.name = "Custom3JSCamera"; 

camera.position.set(0,0,5); 
export default camera; 
+0

謝謝@luciferous,我喜歡這種方法,因爲它不需要改變你的場景,它實際上是一個單獨的相機,這正是我所期待的。 – Valentin

1

的背景信息,在A型框架,你可以改變你想要的任何相機或移動活動的攝像頭的地方:

<a-scene> 
    <a-entity position="0 0 -5"><a-entity id="camera1" camera="active: true"></a-entity> 
    <a-entity position="5 0 5"><a-entity id="camera2" camera="active: false"></a-entity> 
</a-scene> 

<script> 
    document.querySelector('#camera2').setAttribute('camera', 'active', true); 
</script> 
1

您可以使用變換來改變攝像頭的地方,這應該給你一個類似於你的屏幕上的效果:

<View style={{ 
    transform: [ 
     {translate: [-20, -10, -20]}, 
    ], 
    }}>