2016-08-25 8 views
1

最新のv0.3.0ブログの記事では、「私たちはヘッドセットよりもデスクトップディスプレイ上に異なるコンテンツを持ち、非同期のゲームプレイと観客モードのためにドアを開くことができます"これはまさに私が働こうとしていることです。私はシーン内の1台のカメラをHMDの視点を表し、2台目のカメラは同じシーンの観客を表し、そのビューを同じWebページ上のキャンバスにレンダリングするようにしています。 0.3.0は、組み込みコンポーネントを優先して特定のキャンバスにシーンをレンダリングする機能を削除します。 1つのシーンを同時にレンダリングする2台のカメラをどのように実現するかについての考えはありますか?A-Frameで同時に2台のカメラからレンダリングする

私の意図は、デスクトップディスプレイに、ユーザーが何をしているかを別の視点から見せることです。私の最終目標は、複合現実感の緑色の画面コンポーネントを構築することです。

+0

fernandojsgがオンラインに戻っ取得し、彼は前にそれを行っているため、より決定的な答えを提供するまで、 2番目のカメラ/レンダラー/キャンバスを作成し、レンダーループに 'tick 'でフックするコンポーネントが必要になると思います。デフォルトキャンバスはVRモードでヘッドセットにプッシュされます。次に、デスクトップディスプレイに観客のキャンバスを表示するためにz-インデックスを調整することができますか?ちょうど推測。 – ngokevin

+0

私はあなたの提案を働かせることができました。キンクがうまくいけば、私はgithubのレポを投稿します。 – derickson

答えて

3

今後これを行う方法が改善されるかもしれませんが、THREE.jsの世界でどのように行われているかの例を見て、2番目のカメラレンダリングを得ることができました。

コンポーネントを、観客と呼ばれる非アクティブなカメラに追加します。 init関数で新しいレンダラーを設定し、新しいキャンバスを作成するためにシーンの外にdivにアタッチします。次に、ライフサイクルのtick()部分の中でrenderメソッドを呼び出します。

私はまだこのカメラの動きをどのように分離するかを考えていません。 0.3.0 AFRAMEシーンのデフォルトの外観のコントロールはまだ両方のカメラ

を制御

gif of spectator cam

ソースコード: https://gist.github.com/derickson/334a48eb1f53f6891c59a2c137c180fa

+0

観客カメラのルックコントロールを無効にするか、少なくとも 'look-controls =" hmdEnabled:false "を設定することができます。または、ハックルックコントロールを使って、 'window'ではなく' canvas'にマウスドラッグを聞くだけのプロパティを追加することができます。これは現在、カンバスからドラッグした場合の「ウィンドウ」をリッスンしますが、不要な観客モードを使用しています。 – ngokevin

関連する問題