-
Notifications
You must be signed in to change notification settings - Fork 11
/
ar-marker-with-qr-code.html
36 lines (29 loc) · 1.63 KB
/
ar-marker-with-qr-code.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
<title>WebAR: Marker with QR Code</title>
<script src="./js/aframe/aframe.min.js"></script>
<script src="./js/arjs/aframe-ar.js"></script>
<!-- include text geometry -->
<script src="https://unpkg.com/[email protected]/dist/aframe-text-geometry-component.min.js">
</script>
</head>
<body style="margin : 0px; overflow: hidden;">
<a-scene embedded vr-mode-ui="enabled: false" arjs="detectionMode: mono_and_matrix; matrixCodeType: 3x3; debugUIEnabled: true;">
<!-- handle custom marker, ganti dengan pattern QR Code -->
<a-marker-camera type="pattern" url="./marker/unila-bw/ar-marker-unila.patt"></a-marker-camera>
<a-box position="0 0.5 0" material="color:blue;"></a-box>
</a-marker>
<!-- add a simple camera -->
<a-entity camera></a-entity>
</a-scene>
<ul>
<li><a target="_blank" href="https://medium.com/chialab-open-source/how-to-deliver-ar-on-the-web-only-with-a-qr-code-e24b7b61f8cb">How to deliver AR on the web only with a QR Code</a></li>
<li><a target="_blank" href="https://www.qrcode-monkey.com/">QRCODEMONKEY: The 100% Free QR Code Generator</a></li>
<li><a target="_blank" href="http://au.gmented.com/app/marker/marker.php">Marker generator</a></li>
<li><a target="_blank" href="http://www.ucreative.com/articles/what-is-a-qr-code-and-how-does-it-work/">What Is A QR Code And How Does It Work? </a></li>
</ul>
</body>
</html>