renshu/kenta/index html.html at master

Fork: 0

SakataKoryo2021 / renshu

Find file

Newer

Older

renshu / kenta / index html.html

石垣健太 on 20 Oct 2021 1 KB Add files via upload

Raw Blame History

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>A-Frame で超簡単 AR</title>
</head>
<body style="margin: 0px; overflow:hidden;">
 <!-- A-Frame ライブラリの読み込み -->
 <script src="https://aframe.io/releases/1.0.4/aframe.min.js"></script>
 <!-- AR.js ライブラリの読み込み -->
 <script src="https://raw.githack.com/AR-js-org/AR.js/master/aframe/build/aframe-ar.js"></script>
    
 <script src="js/aframe-text-geometry-component.min.js"></script>
 <script src="js/aframe-extras.js"></script>
 <!-- A-Frame の VR空間に AR.js を紐づける(デバッグUIを非表示) -->
 <a-scene embedded arjs="debugUIEnabled:false;">
 <a-assets>
	       <a-asset-item id="kaken" src="kaken.gltf"></a-asset-item>
        </a-assets>
  <!-- マーカーを登録(プリセットされている「hiro」マーカー) -->
  <a-marker preset="custom" type="pattern" url='pattern-koryo.patt'>
   <!-- マーカーの場所に箱を置く(見やすいようにワイヤーフレーム表示) -->
  <a-box position="0 0.10 -0.150" wireframe="true" link="https://www.sakatakoryo-h.ed.jp/; title: kakennoyatu; image: #kaken"></a-box>
  
  </a-marker>
  
  <!-- AR用のカメラを置く -->
  <a-entity camera></a-entity>
  <a-entity
    id="button"
    click-change
    geometry="primitive: ring; radiusInner: 0.75; radiusOuter: 0.8"
    material="color: white; side: double;"
    raycaster="objects: .clickable"
    >
</a-entity>
 </a-scene>
 <script type="text/javascript" src="event2.js" charset="utf-8">
    </script>
</body>
</html>