Spaces:
Running
Running
| <html lang="en-us"> | |
| <head> | |
| <meta charset="utf-8"> | |
| <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no"> | |
| <title>excav_simul_3d</title> | |
| <link rel="shortcut icon" href="TemplateData/favicon.ico"> | |
| <link rel="stylesheet" href="TemplateData/style.css"> | |
| <link rel="stylesheet" href="main.css"> | |
| </head> | |
| <body class="dark"> | |
| <div id="unity-container" class="unity-desktop"> | |
| <canvas id="unity-canvas"></canvas> | |
| </div> | |
| <div id="loading-cover" style="display:none;"> | |
| <div id="unity-loading-bar"> | |
| <div id="unity-logo"><img src="logo.png"></div> | |
| <div id="unity-progress-bar-empty" style="display: none;"> | |
| <div id="unity-progress-bar-full"></div> | |
| </div> | |
| <div class="spinner"></div> | |
| </div> | |
| </div> | |
| <div id="unity-fullscreen-button" style="display: none;"></div> | |
| <script> | |
| const hideFullScreenButton = ""; | |
| const buildUrl = "Build"; | |
| const loaderUrl = buildUrl + "/SimplifiedTerrain-simpleMovement-demo-webgl-dev.loader.js"; | |
| const config = { | |
| dataUrl: buildUrl + "/SimplifiedTerrain-simpleMovement-demo-webgl-dev.data", | |
| frameworkUrl: buildUrl + "/SimplifiedTerrain-simpleMovement-demo-webgl-dev.framework.js", | |
| codeUrl: buildUrl + "/SimplifiedTerrain-simpleMovement-demo-webgl-dev.wasm", | |
| streamingAssetsUrl: "StreamingAssets", | |
| companyName: "DefaultCompany", | |
| productName: "excav_simul_3d", | |
| productVersion: "0.1", | |
| }; | |
| const container = document.querySelector("#unity-container"); | |
| const canvas = document.querySelector("#unity-canvas"); | |
| const loadingCover = document.querySelector("#loading-cover"); | |
| const progressBarEmpty = document.querySelector("#unity-progress-bar-empty"); | |
| const progressBarFull = document.querySelector("#unity-progress-bar-full"); | |
| const fullscreenButton = document.querySelector("#unity-fullscreen-button"); | |
| const spinner = document.querySelector('.spinner'); | |
| const canFullscreen = (function () { | |
| for (const key of [ | |
| 'exitFullscreen', | |
| 'webkitExitFullscreen', | |
| 'webkitCancelFullScreen', | |
| 'mozCancelFullScreen', | |
| 'msExitFullscreen', | |
| ]) { | |
| if (key in document) { | |
| return true; | |
| } | |
| } | |
| return false; | |
| }()); | |
| if (/iPhone|iPad|iPod|Android/i.test(navigator.userAgent)) { | |
| container.className = "unity-mobile"; | |
| config.devicePixelRatio = 1; | |
| } | |
| loadingCover.style.display = ""; | |
| const script = document.createElement("script"); | |
| script.src = loaderUrl; | |
| script.onload = () => { | |
| createUnityInstance(canvas, config, (progress) => { | |
| spinner.style.display = "none"; | |
| progressBarEmpty.style.display = ""; | |
| progressBarFull.style.width = `${100 * progress}%`; | |
| }).then((unityInstance) => { | |
| loadingCover.style.display = "none"; | |
| if (canFullscreen) { | |
| if (!hideFullScreenButton) { | |
| fullscreenButton.style.display = ""; | |
| } | |
| fullscreenButton.onclick = () => { | |
| unityInstance.SetFullscreen(1); | |
| }; | |
| } | |
| }).catch((message) => { | |
| alert(message); | |
| }); | |
| }; | |
| document.body.appendChild(script); | |
| </script> | |
| <div id="infoBox"> | |
| <h1>Controls</h1> | |
| <div id="controls"> | |
| <table> | |
| <th>Binding</th> | |
| <th>Description</th> | |
| <tr> | |
| <td>Right Mouse Click (Drag)</td> | |
| <td> | |
| Rotates the camera in the direction of the mouse drag. | |
| </td> | |
| </tr> | |
| <tr> | |
| <td>Left Mouse Click</td> | |
| <td> | |
| Sets the goal point to the location on the terrain where you clicked. | |
| </td> | |
| </tr> | |
| <tr> | |
| <td>W</td> | |
| <td> | |
| Move forward. | |
| </td> | |
| </tr> | |
| <tr> | |
| <td>S</td> | |
| <td> | |
| Move backward. | |
| </td> | |
| </tr> | |
| <tr> | |
| <td>A</td> | |
| <td> | |
| Move left. | |
| </td> | |
| </tr> | |
| <tr> | |
| <td>D</td> | |
| <td> | |
| Move right. | |
| </td> | |
| </tr> | |
| <tr> | |
| <td>E</td> | |
| <td>Move up.</td> | |
| </tr> | |
| <tr> | |
| <td>Q</td> | |
| <td>Move down.</td> | |
| </tr> | |
| <tr> | |
| <td>R</td> | |
| <td> | |
| Restart the episode. | |
| Note that the terrain does not change even if you are in random mode. | |
| Deformations to the terrain are preserved as well. | |
| </td> | |
| </tr> | |
| <tr> | |
| <td>1</td> | |
| <td> | |
| <div class="cellHeader">Terrain Mode: RANDOM</div> | |
| Restart with a random terrain shape (no perlin noise). | |
| </td> | |
| </tr> | |
| <tr> | |
| <td>2</td> | |
| <td> | |
| <div class="cellHeader">Terrain Mode: RANDOM_NOISE</div> | |
| Restart with a random terrain shape (with perlin noise). | |
| </td> | |
| </tr> | |
| <tr> | |
| <td>3</td> | |
| <td> | |
| <div class="cellHeader">Terrain Mode: GAUSSIAN_SLOPE</div> | |
| Restart with a gaussian slope shaped terrain. | |
| </td> | |
| </tr> | |
| <tr> | |
| <td>4</td> | |
| <td> | |
| <div class="cellHeader">Terrain Mode: POINTY_GAUSSIAN_SLOPE</div> | |
| Restart with a <i>pointy</i> gaussian slope shaped terrain. | |
| </td> | |
| </tr> | |
| <tr> | |
| <td>5</td> | |
| <td> | |
| <div class="cellHeader">Terrain Mode: TRAPEZOIDAL_HILL</div> | |
| Restart with a trapezoidal hill shaped terrain. | |
| </td> | |
| </tr> | |
| </table> | |
| </div> | |
| <h1>Disclaimer</h1> | |
| <div id="disclaimerBody"> | |
| <p> | |
| <a target=”_blank” href="https://docs.unity3d.com/Packages/[email protected]/manual/index.html#inference"> | |
| Unfortunately, MLAgents doesn't support GPU inference for WebGL builds. | |
| </a><br> | |
| The current model is small enough that it runs smoothly with GPU | |
| inference, but large enough that it runs slowly with CPU inference. | |
| If you would like to receive the latest build on your target platform, | |
| PM cm107 on huggingface. | |
| </p> | |
| <p> | |
| For more information about WebGL performance considerations, refer to | |
| <a target=”_blank” href="https://docs.unity3d.com/Manual/webgl-performance.html"> | |
| the unity documentation | |
| </a>. | |
| </p> | |
| </div> | |
| <h1>Downloads</h1> | |
| <ul> | |
| <li> | |
| <a download="linux-build.zip" | |
| href="https://huggingface.co/spaces/cm107/excav_demo/resolve/main/linux-build.zip"> | |
| Linux Build | |
| </a> | |
| </li> | |
| <li> | |
| <a download="mac-build.zip" href="https://huggingface.co/spaces/cm107/excav_demo/resolve/main/mac-build.zip"> | |
| Mac Build | |
| </a> | |
| </li> | |
| </ul> | |
| </div> | |
| </body> | |
| </html> |