<!DOCTYPE html>
<head>
<!-- ① スクリプトの読み込み -->
<script src="https://aframe.io/releases/0.8.2/aframe.min.js"></script>
<script src="https://cdn.rawgit.com/jeromeetienne/AR.js/1.6.2/aframe/build/aframe-ar.js"></script>
</head>
<body style='margin: 0; overflow: hidden;'>
<!-- シーンの追加とデバックUIを非表示 -->
<a-scene embedded arjs="debugUIEnabled:false;">
<!-- ② hiroマーカーでのソース -->
<a-marker preset="custom" type='patten' url='pattern-kumashiru.patt'>
<a-sphere scale=".25 .25 .25" position="0 .5 0" color="#111">
<a-animation attribute="position" to="0 1 0" direction="alternate" dur="2000" repeat="indefinite">
</a-animation>
</a-sphere>
</a-marker>
<a-marker preset="custom" type='patten' url='pattern-karasu3.patt'>
<a-sphere scale=".25 .25 .25" position="0 .5 0" color="#111">
<a-animation attribute="position" to="0 1 0" direction="alternate" dur="2000" repeat="indefinite">
</a-animation>
</a-sphere>
</a-marker>
<!-- ③ 作成したマーカーでのソース -->
<a-marker type='pattern' url='pattern-AR-marker.patt '>
<a-sphere scale=".25 .25 .25" position="0 .5 0" color="#f00">
<a-animation attribute="position" to="0 1 0" direction="alternate" dur="2000" repeat="indefinite">
</a-animation>
</a-sphere>
</a-marker>
<a-entity camera></a-entity>
</a-scene>
</body>
</html>
