2017-06-05 2 views
0

私は落ちてくるダイスの簡単なアニメーションを作成しようとしています。以下のコードでは、私はキューブマップをa-boxに適用しようとしていますが、望ましい結果を得ることはできません。キューブマップを取得していないAフレーム

<!DOCTYPE html> 
<html> 
    <head> 
     <script src="https://aframe.io/releases/0.2.0/aframe.js"></script> 

    </head> 

    <body> 
     <a-scene> 
      <a-assets> 
       <a-cubemap id="sky"> 
        <img src="dice/Dice-1.png"> 
        <img src="dice/Dice-2.png"> 
        <img src="dice/Dice-3.png"> 
        <img src="dice/Dice-4.png"> 
        <img src="dice/Dice-5.png"> 
        <img src="dice/Dice-6.png"> 
       </a-cubemap> 
      </a-assets> 
      <a-entity geometry="primitive: box" material="envMap: #sky"></a-entity> 
      </a-scene> 
    </body> 
</html> 

答えて

0

は、私の知る限りでは、環境マップは、すなわちキューブマップを使用して、球環境を提供する、または周囲の環境のマップを提供することで、reflecion /屈折で動作するために使用されています。あなたのケースでは

、私は<a-box>ためのテクスチャを使用するか、または平面で作られたカスタムボックスを作成し、このようにそれに応じてテクスチャになります。

<a-entity id="dice"> 
    <a-plane position="-0.5 0 0" rotation="0 -90 0"></a-plane> 
    <a-plane position="0.5 0 0" rotation="0 90 0"></a-plane> 
    <a-plane position="0 0.5 0" rotation="-90 0 0"></a-plane> 
    <a-plane position="0 -0.5 0" rotation="90 0 0"></a-plane> 
    <a-plane position="0 0 0.5" rotation="0 0 -90"></a-plane> 
    <a-plane position="0 0 -0.5" rotation="0 0 90"></a-plane> 

    </a-entity> 

フィドル作業:https://jsfiddle.net/x8dt1jjb/を。

キューブマップ: 私は複数のソースからわかるように、キューブマップは、多くの問題を持っていた:

here同様または here私は 、いくつかの男が彼の githubをチェックアウトし、キューブマップは最初のものを除くすべてのエンティティ上で動作することを主張しましたキューブマップは、彼の index.html

に取り組んでいる彼の例にキューブマップ確かに、注意してください、あなたの環境マップはなく、規模= "0と、適用されて最初のエンティティで作業していないので、私のアドバイスは、彼のキューブマップの宣言をコピーされるだろう、と<a-entity>を作成します0 0 "、またはvisible =" false "となります。そのようにすると、最初のエンティティは「盗んだ」(しかし、目に見えない、誰が気にしている)か、エンティティは正常に動作するはずです。
私のために適切に動作しますが、ソースを逆にしました:http://gftruj.nazwa.pl/cubemap/
説明したように、キューブマップの顔を宣言する必要があります。heredice cubemapを見ると、あなたが例えば、まっすぐにあなたの順序を取得する必要があります:
サイコロ-5、サイコロ-2、サイコロ-4、サイコロ-3、サイコロ-6、サイコロ-1

はところで私はcubemap componentを見つけましたまだ試していない。

+0

私はそれを試しました。しかし、ダイスのテクスチャは、1つのドットの一方の側と反対側の6つのドットのようにダイスの周りにうまくいきます。 –

+0

@PrakashBayasは私の更新をチェックします、あなたはキューブマップであなたの顔を並べ替える必要があると思います –

+0

与えられたリンクからキューブマップを試しました。また、コンポーネントキューブマップは、動的ボディコンポーネントと連携しません。私はまた、このgithubリポジトリに与えられた例について、このノードサーバを持つインスペクタを読み込めませんでした。私は実り多い結果を出さずに注文を更新しました。これらのラインに沿った私の研究の後、私は、ボックスや同様のエンティティの周りの完全なキューブマップテクスチャの作業がまだ進行中であると結論づけます。 –

関連する問題