Fix Three.js import map (admin/viewer black canvas)

This commit is contained in:
2026-07-06 19:39:12 +10:00
parent e92ad04b7e
commit 14d7185a6e
6 changed files with 33 additions and 6 deletions
+12 -1
View File
@@ -161,6 +161,17 @@
<div id="toast"></div> <div id="toast"></div>
<script type="module" src="js/admin.js?v=1"></script> <!-- Import map so OrbitControls' bare `from 'three'` resolves.
Without this the module import fails and the editor never boots. -->
<script type="importmap">
{
"imports": {
"three": "https://cdn.jsdelivr.net/npm/three@0.160.0/build/three.module.js",
"three/addons/": "https://cdn.jsdelivr.net/npm/three@0.160.0/examples/jsm/"
}
}
</script>
<script type="module" src="js/admin.js?v=2"></script>
</body> </body>
</html> </html>
+8
View File
@@ -78,6 +78,14 @@
<script src="vendor/posit1.js"></script> <script src="vendor/posit1.js"></script>
<script src="vendor/aruco.js"></script> <script src="vendor/aruco.js"></script>
<script src="vendor/dictionaries/aruco_4x4_1000.js"></script> <script src="vendor/dictionaries/aruco_4x4_1000.js"></script>
<script type="importmap">
{
"imports": {
"three": "https://cdn.jsdelivr.net/npm/three@0.160.0/build/three.module.js",
"three/addons/": "https://cdn.jsdelivr.net/npm/three@0.160.0/examples/jsm/"
}
}
</script>
<script type="module" src="js/ar-head.js"></script> <script type="module" src="js/ar-head.js"></script>
</body> </body>
</html> </html>
+8
View File
@@ -25,6 +25,14 @@
<div class="row">link: <span id="status" class="warn">connecting…</span> · ghosts: <b id="count">0</b></div> <div class="row">link: <span id="status" class="warn">connecting…</span> · ghosts: <b id="count">0</b></div>
<div class="row">drag to orbit · scroll to zoom</div> <div class="row">drag to orbit · scroll to zoom</div>
</div> </div>
<script type="importmap">
{
"imports": {
"three": "https://cdn.jsdelivr.net/npm/three@0.160.0/build/three.module.js",
"three/addons/": "https://cdn.jsdelivr.net/npm/three@0.160.0/examples/jsm/"
}
}
</script>
<script type="module" src="js/viewer.js"></script> <script type="module" src="js/viewer.js"></script>
</body> </body>
</html> </html>
+2 -2
View File
@@ -8,8 +8,8 @@
* Coordinates: world millimetres, origin at the front-left table corner. * Coordinates: world millimetres, origin at the front-left table corner.
* X = length (1500), Z = depth (700), Y = height. Three.js uses metres (×0.001). * X = length (1500), Z = depth (700), Y = height. Three.js uses metres (×0.001).
*/ */
import * as THREE from 'https://cdn.jsdelivr.net/npm/three@0.160.0/build/three.module.js'; import * as THREE from 'three';
import { OrbitControls } from 'https://cdn.jsdelivr.net/npm/three@0.160.0/examples/jsm/controls/OrbitControls.js'; import { OrbitControls } from 'three/addons/controls/OrbitControls.js';
const MM = 0.001; const MM = 0.001;
const LURE = { const LURE = {
+1 -1
View File
@@ -7,7 +7,7 @@
* *
* This is the real-3D successor to ar-test.js (which was a flat sprite). * This is the real-3D successor to ar-test.js (which was a flat sprite).
*/ */
import * as THREE from 'https://cdn.jsdelivr.net/npm/three@0.160.0/build/three.module.js'; import * as THREE from 'three';
import { buildLegoHeadGhost } from './lego-head-ghost.js?v=1'; import { buildLegoHeadGhost } from './lego-head-ghost.js?v=1';
import { TunedDetector, MarkerTracker } from './detect-tuned.js?v=1'; import { TunedDetector, MarkerTracker } from './detect-tuned.js?v=1';
+2 -2
View File
@@ -1,5 +1,5 @@
import * as THREE from 'https://cdn.jsdelivr.net/npm/three@0.160.0/build/three.module.js'; import * as THREE from 'three';
import { OrbitControls } from 'https://cdn.jsdelivr.net/npm/three@0.160.0/examples/jsm/controls/OrbitControls.js'; import { OrbitControls } from 'three/addons/controls/OrbitControls.js';
// ---- Config -------------------------------------------------------------- // ---- Config --------------------------------------------------------------
const MM = 0.001; // millimetre -> Three.js metre scale const MM = 0.001; // millimetre -> Three.js metre scale