| 123456789101112131415161718192021222324252627282930313233343536 |
- <!doctype html>
- <html>
- <head>
- <meta charset="utf-8">
- <meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1, maximum-scale=1">
- <title>encantar.js WebAR demo with three.js</title>
- <link href="../assets/demo.css" rel="stylesheet">
- <script async src="https://cdn.jsdelivr.net/npm/es-module-shims@1.10.1/dist/es-module-shims.js"></script>
- <script type="importmap">
- {
- "imports": {
- "three": "https://cdn.jsdelivr.net/npm/three@0.172.0/build/three.module.js",
- "three/addons/": "https://cdn.jsdelivr.net/npm/three@0.172.0/examples/jsm/",
- "three-with-encantar": "../../plugins/three-with-encantar.js"
- }
- }
- </script>
- <script src="../../dist/encantar.min.js"></script>
- <script type="module" src="demo.js"></script>
- </head>
- <body>
- <div id="ar-viewport">
- <div id="ar-hud" hidden>
- <a id="info" href="NOTICE.html" draggable="false"></a>
- <a id="like" href="https://encantar.dev/support-my-work" draggable="false"></a>
- <img id="scan" src="../assets/scan.png" draggable="false">
- </div>
- </div>
- <img id="mage" src="../assets/mage.webp" hidden>
- <img id="cat" src="../assets/cat.webp" hidden>
- <video id="my-video" hidden muted loop playsinline autoplay>
- <source src="../assets/my-video.webm" type="video/webm" />
- <source src="../assets/my-video.mp4" type="video/mp4" />
- </video>
- </body>
- </html>
|
