ar.jsで複数の画像を表示させる方法
解決したいこと
AR.JSで一度起動したWEBアプリカメラ内において、それぞれのマーカーを認識し、2D画像を表示させる方法を教えてください。
1つ目は表示できるのですが、2つ目のコードを内、必要なものをサーバーにアップすると1枚目の画像すら表示されなくなります。
発生している問題・エラー
WEBARを駆使して、小さな水族館で解説パネルを表示させるARを作りたいと考えています。
現在、1つのマーカーで一つの画像を表示させることには成功しているのですが、2つ目を表示させるため、マーカーと表示画像のコードを入力すると、何も読み込まなくなってしまいます。もちろん画像は入れています。
それまで表示できていた1つ目の画像まで表示されなくなります。
こういったコーディングやhtmlの知識が乏しく、お力を貸していただけると幸いです。
該当するソースコード
<!-- 自作マーカーを追加 ビワヒガイ -->
<a-marker preset="custom" type='pattern' url='assets/pattern-biwahigai.patt'>
<!-- イメージ表示 -->
<a-image width="2" height="2" position="0.2 0.4 0.4" rotation="-120 0 0" src="assets/biwahigai.png">
</a-image>
</a-marker>
<!-- 自作マーカーを追加 モツゴ -->
<a-marker preset="custom" type='pattern' url='assets/pattern-motugo.patt'>
<!-- イメージ表示 -->
<a-image width="2" height="2" position="0.2 0.4 0.4" rotation="-120 0 0" src="assets/motugo.png">
</a-image>
</a-marker>
<!-- カメラを追加 -->
<a-entity camera></a-entity>
0