summaryrefslogtreecommitdiffhomepage
path: root/derelict.js
diff options
context:
space:
mode:
Diffstat (limited to 'derelict.js')
-rw-r--r--derelict.js23
1 files changed, 18 insertions, 5 deletions
diff --git a/derelict.js b/derelict.js
index d32d269..b4b686e 100644
--- a/derelict.js
+++ b/derelict.js
@@ -2,24 +2,37 @@ import * as THREE from 'https://unpkg.com/three@0.126.1/build/three.module.js'
import { OrbitControls } from 'https://unpkg.com/three@0.126.1/examples/jsm/controls/OrbitControls.js'
import { CSS2DRenderer, CSS2DObject } from 'https://unpkg.com/three@0.126.1/examples/jsm/renderers/CSS2DRenderer.js'
-let camera, scene, renderer, renderer2d
+let camera, scene, renderer, renderer2d, wreck
-init()
-animate()
+load(() => {
+ init()
+ animate()
+})
function Wreck(x, y, z) {
const point = new THREE.Object3D()
point.position.fromArray([x, y, z])
const div = document.createElement('div')
- div.textContent = "<wreck icon>"
- div.style.color = '#fff'
+ div.className = 'wreck'
+ const w = document.importNode(wreck, true)
+ div.appendChild(w)
const label = new CSS2DObject(div)
point.add(label)
return point;
}
+function load(callback) {
+ const xhr = new XMLHttpRequest()
+ xhr.open("GET", "wreck.svg", true)
+ xhr.onload = function (e) {
+ wreck = xhr.responseXML.documentElement
+ callback()
+ }
+ xhr.send(null)
+}
+
function init() {
camera = new THREE.PerspectiveCamera(70, window.innerWidth / window.innerHeight, 0.01, 10)
camera.position.set(1, 1, 1)