ARTest
This commit is contained in:
Kumkwats
parent
1415da72df
commit
d404c10de6
1251
www/package-lock.json
generated
1251
www/package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@ -33,6 +33,7 @@
|
||||
"typescript": "^4.0.0"
|
||||
},
|
||||
"dependencies": {
|
||||
"@ar-js-org/ar.js": "^3.4.3",
|
||||
"papercss": "^1.8.3",
|
||||
"sirv-cli": "^2.0.0",
|
||||
"spaper": "^0.9.6",
|
||||
|
||||
BIN
www/public/models/dingus_the_cat.glb
Normal file
BIN
www/public/models/dingus_the_cat.glb
Normal file
Binary file not shown.
195
www/public/patterns/patt.hiro
Normal file
195
www/public/patterns/patt.hiro
Normal file
@ -0,0 +1,195 @@
|
||||
234 235 240 233 240 234 240 235 240 237 240 238 240 240 240 232
|
||||
229 240 240 240 240 240 240 240 240 240 240 240 240 240 240 228
|
||||
227 240 240 240 240 240 240 240 240 240 240 240 240 240 240 239
|
||||
240 240 240 240 240 240 240 240 240 240 240 240 240 240 240 240
|
||||
236 240 240 240 240 240 240 240 240 240 240 240 240 240 240 240
|
||||
234 240 240 240 240 240 240 240 240 240 240 240 240 240 240 240
|
||||
236 240 240 240 240 240 240 240 240 240 240 240 240 240 240 240
|
||||
231 240 240 240 240 240 240 240 240 240 240 240 240 240 240 240
|
||||
229 240 240 240 240 240 240 240 240 240 240 240 240 240 240 240
|
||||
225 149 240 240 186 216 225 174 240 240 240 237 238 240 240 240
|
||||
150 107 238 231 75 208 115 147 238 228 223 226 237 180 226 240
|
||||
150 62 181 213 62 187 113 169 197 72 29 237 120 50 53 207
|
||||
149 63 47 78 53 184 113 101 142 5 150 150 45 217 186 83
|
||||
121 84 220 222 58 180 121 92 128 109 237 124 155 232 161 64
|
||||
149 71 240 240 76 210 98 109 122 108 240 129 51 119 161 155
|
||||
149 186 240 240 98 219 135 152 207 191 236 227 152 77 175 209
|
||||
235 235 240 233 240 234 240 235 240 236 240 238 240 240 240 240
|
||||
229 240 240 240 240 240 240 240 240 240 240 240 240 240 240 240
|
||||
227 240 240 240 240 240 240 240 240 240 240 240 240 240 240 240
|
||||
240 240 240 240 240 240 240 240 240 240 240 240 240 240 240 240
|
||||
236 240 240 240 240 240 240 240 240 240 240 240 240 240 240 240
|
||||
234 240 240 240 240 240 240 240 240 240 240 240 240 240 240 240
|
||||
236 240 240 240 240 240 240 240 240 240 240 240 240 240 240 240
|
||||
232 240 240 240 240 240 240 240 240 240 240 240 240 240 240 240
|
||||
229 240 240 240 240 240 240 240 240 240 240 240 240 240 240 240
|
||||
225 156 240 240 186 216 225 186 240 240 240 240 240 240 240 240
|
||||
150 117 240 231 72 206 115 162 240 232 223 237 240 180 226 240
|
||||
150 74 187 213 51 184 103 168 197 78 29 237 120 50 53 216
|
||||
144 77 51 74 61 184 106 101 142 5 150 152 52 217 186 85
|
||||
117 89 219 219 65 184 121 92 128 100 236 125 156 240 170 73
|
||||
148 71 240 240 76 210 109 109 121 99 240 137 51 120 166 164
|
||||
140 186 240 240 98 220 150 156 207 192 236 230 152 77 176 212
|
||||
234 235 240 233 240 234 240 235 240 236 240 238 240 240 240 233
|
||||
229 240 240 240 240 240 240 240 240 240 240 240 240 240 240 239
|
||||
227 240 240 240 240 240 240 240 240 240 240 240 240 240 240 240
|
||||
240 240 240 240 240 240 240 240 240 240 240 240 240 240 240 240
|
||||
234 240 240 240 240 240 240 240 240 240 240 240 240 240 240 240
|
||||
232 240 240 240 240 240 240 240 240 240 240 240 240 240 240 240
|
||||
235 240 240 240 240 240 240 240 240 240 240 240 240 240 240 240
|
||||
232 240 240 240 240 240 240 240 240 240 240 240 240 240 240 240
|
||||
228 240 240 240 240 240 240 240 240 240 240 240 240 240 240 240
|
||||
225 156 240 240 182 212 225 180 240 240 240 240 240 240 240 240
|
||||
150 116 238 228 66 205 115 151 238 236 225 240 240 180 226 240
|
||||
156 84 186 211 47 184 109 170 200 92 30 240 120 50 53 216
|
||||
147 83 51 73 50 184 106 110 148 17 151 150 45 217 186 85
|
||||
127 98 219 219 58 179 109 101 128 107 237 125 155 240 163 72
|
||||
155 86 240 240 76 201 85 108 121 95 232 137 51 118 153 155
|
||||
149 189 240 240 98 220 141 154 206 178 235 230 152 77 175 209
|
||||
|
||||
232 228 239 240 240 240 240 240 240 240 240 207 83 64 155 209
|
||||
240 240 240 240 240 240 240 240 240 240 226 53 186 161 161 175
|
||||
240 240 240 240 240 240 240 240 240 240 180 50 217 232 119 77
|
||||
240 240 240 240 240 240 240 240 240 238 237 120 45 155 51 152
|
||||
238 240 240 240 240 240 240 240 240 237 226 237 150 124 129 227
|
||||
240 240 240 240 240 240 240 240 240 240 223 29 150 237 240 236
|
||||
237 240 240 240 240 240 240 240 240 240 228 72 5 109 108 191
|
||||
240 240 240 240 240 240 240 240 240 240 238 197 142 128 122 207
|
||||
235 240 240 240 240 240 240 240 240 174 147 169 101 92 109 152
|
||||
240 240 240 240 240 240 240 240 240 225 115 113 113 121 98 135
|
||||
234 240 240 240 240 240 240 240 240 216 208 187 184 180 210 219
|
||||
240 240 240 240 240 240 240 240 240 186 75 62 53 58 76 98
|
||||
233 240 240 240 240 240 240 240 240 240 231 213 78 222 240 240
|
||||
240 240 240 240 240 240 240 240 240 240 238 181 47 220 240 240
|
||||
235 240 240 240 240 240 240 240 240 149 107 62 63 84 71 186
|
||||
234 229 227 240 236 234 236 231 229 225 150 150 149 121 149 149
|
||||
240 240 240 240 240 240 240 240 240 240 240 216 85 73 164 212
|
||||
240 240 240 240 240 240 240 240 240 240 226 53 186 170 166 176
|
||||
240 240 240 240 240 240 240 240 240 240 180 50 217 240 120 77
|
||||
240 240 240 240 240 240 240 240 240 240 240 120 52 156 51 152
|
||||
238 240 240 240 240 240 240 240 240 240 237 237 152 125 137 230
|
||||
240 240 240 240 240 240 240 240 240 240 223 29 150 236 240 236
|
||||
236 240 240 240 240 240 240 240 240 240 232 78 5 100 99 192
|
||||
240 240 240 240 240 240 240 240 240 240 240 197 142 128 121 207
|
||||
235 240 240 240 240 240 240 240 240 186 162 168 101 92 109 156
|
||||
240 240 240 240 240 240 240 240 240 225 115 103 106 121 109 150
|
||||
234 240 240 240 240 240 240 240 240 216 206 184 184 184 210 220
|
||||
240 240 240 240 240 240 240 240 240 186 72 51 61 65 76 98
|
||||
233 240 240 240 240 240 240 240 240 240 231 213 74 219 240 240
|
||||
240 240 240 240 240 240 240 240 240 240 240 187 51 219 240 240
|
||||
235 240 240 240 240 240 240 240 240 156 117 74 77 89 71 186
|
||||
235 229 227 240 236 234 236 232 229 225 150 150 144 117 148 140
|
||||
233 239 240 240 240 240 240 240 240 240 240 216 85 72 155 209
|
||||
240 240 240 240 240 240 240 240 240 240 226 53 186 163 153 175
|
||||
240 240 240 240 240 240 240 240 240 240 180 50 217 240 118 77
|
||||
240 240 240 240 240 240 240 240 240 240 240 120 45 155 51 152
|
||||
238 240 240 240 240 240 240 240 240 240 240 240 150 125 137 230
|
||||
240 240 240 240 240 240 240 240 240 240 225 30 151 237 232 235
|
||||
236 240 240 240 240 240 240 240 240 240 236 92 17 107 95 178
|
||||
240 240 240 240 240 240 240 240 240 240 238 200 148 128 121 206
|
||||
235 240 240 240 240 240 240 240 240 180 151 170 110 101 108 154
|
||||
240 240 240 240 240 240 240 240 240 225 115 109 106 109 85 141
|
||||
234 240 240 240 240 240 240 240 240 212 205 184 184 179 201 220
|
||||
240 240 240 240 240 240 240 240 240 182 66 47 50 58 76 98
|
||||
233 240 240 240 240 240 240 240 240 240 228 211 73 219 240 240
|
||||
240 240 240 240 240 240 240 240 240 240 238 186 51 219 240 240
|
||||
235 240 240 240 240 240 240 240 240 156 116 84 83 98 86 189
|
||||
234 229 227 240 234 232 235 232 228 225 150 156 147 127 155 149
|
||||
|
||||
209 175 77 152 227 236 191 207 152 135 219 98 240 240 186 149
|
||||
155 161 119 51 129 240 108 122 109 98 210 76 240 240 71 149
|
||||
64 161 232 155 124 237 109 128 92 121 180 58 222 220 84 121
|
||||
83 186 217 45 150 150 5 142 101 113 184 53 78 47 63 149
|
||||
207 53 50 120 237 29 72 197 169 113 187 62 213 181 62 150
|
||||
240 226 180 237 226 223 228 238 147 115 208 75 231 238 107 150
|
||||
240 240 240 238 237 240 240 240 174 225 216 186 240 240 149 225
|
||||
240 240 240 240 240 240 240 240 240 240 240 240 240 240 240 229
|
||||
240 240 240 240 240 240 240 240 240 240 240 240 240 240 240 231
|
||||
240 240 240 240 240 240 240 240 240 240 240 240 240 240 240 236
|
||||
240 240 240 240 240 240 240 240 240 240 240 240 240 240 240 234
|
||||
240 240 240 240 240 240 240 240 240 240 240 240 240 240 240 236
|
||||
240 240 240 240 240 240 240 240 240 240 240 240 240 240 240 240
|
||||
239 240 240 240 240 240 240 240 240 240 240 240 240 240 240 227
|
||||
228 240 240 240 240 240 240 240 240 240 240 240 240 240 240 229
|
||||
232 240 240 240 238 240 237 240 235 240 234 240 233 240 235 234
|
||||
212 176 77 152 230 236 192 207 156 150 220 98 240 240 186 140
|
||||
164 166 120 51 137 240 99 121 109 109 210 76 240 240 71 148
|
||||
73 170 240 156 125 236 100 128 92 121 184 65 219 219 89 117
|
||||
85 186 217 52 152 150 5 142 101 106 184 61 74 51 77 144
|
||||
216 53 50 120 237 29 78 197 168 103 184 51 213 187 74 150
|
||||
240 226 180 240 237 223 232 240 162 115 206 72 231 240 117 150
|
||||
240 240 240 240 240 240 240 240 186 225 216 186 240 240 156 225
|
||||
240 240 240 240 240 240 240 240 240 240 240 240 240 240 240 229
|
||||
240 240 240 240 240 240 240 240 240 240 240 240 240 240 240 232
|
||||
240 240 240 240 240 240 240 240 240 240 240 240 240 240 240 236
|
||||
240 240 240 240 240 240 240 240 240 240 240 240 240 240 240 234
|
||||
240 240 240 240 240 240 240 240 240 240 240 240 240 240 240 236
|
||||
240 240 240 240 240 240 240 240 240 240 240 240 240 240 240 240
|
||||
240 240 240 240 240 240 240 240 240 240 240 240 240 240 240 227
|
||||
240 240 240 240 240 240 240 240 240 240 240 240 240 240 240 229
|
||||
240 240 240 240 238 240 236 240 235 240 234 240 233 240 235 235
|
||||
209 175 77 152 230 235 178 206 154 141 220 98 240 240 189 149
|
||||
155 153 118 51 137 232 95 121 108 85 201 76 240 240 86 155
|
||||
72 163 240 155 125 237 107 128 101 109 179 58 219 219 98 127
|
||||
85 186 217 45 150 151 17 148 110 106 184 50 73 51 83 147
|
||||
216 53 50 120 240 30 92 200 170 109 184 47 211 186 84 156
|
||||
240 226 180 240 240 225 236 238 151 115 205 66 228 238 116 150
|
||||
240 240 240 240 240 240 240 240 180 225 212 182 240 240 156 225
|
||||
240 240 240 240 240 240 240 240 240 240 240 240 240 240 240 228
|
||||
240 240 240 240 240 240 240 240 240 240 240 240 240 240 240 232
|
||||
240 240 240 240 240 240 240 240 240 240 240 240 240 240 240 235
|
||||
240 240 240 240 240 240 240 240 240 240 240 240 240 240 240 232
|
||||
240 240 240 240 240 240 240 240 240 240 240 240 240 240 240 234
|
||||
240 240 240 240 240 240 240 240 240 240 240 240 240 240 240 240
|
||||
240 240 240 240 240 240 240 240 240 240 240 240 240 240 240 227
|
||||
239 240 240 240 240 240 240 240 240 240 240 240 240 240 240 229
|
||||
233 240 240 240 238 240 236 240 235 240 234 240 233 240 235 234
|
||||
|
||||
149 149 121 149 150 150 225 229 231 236 234 236 240 227 229 234
|
||||
186 71 84 63 62 107 149 240 240 240 240 240 240 240 240 235
|
||||
240 240 220 47 181 238 240 240 240 240 240 240 240 240 240 240
|
||||
240 240 222 78 213 231 240 240 240 240 240 240 240 240 240 233
|
||||
98 76 58 53 62 75 186 240 240 240 240 240 240 240 240 240
|
||||
219 210 180 184 187 208 216 240 240 240 240 240 240 240 240 234
|
||||
135 98 121 113 113 115 225 240 240 240 240 240 240 240 240 240
|
||||
152 109 92 101 169 147 174 240 240 240 240 240 240 240 240 235
|
||||
207 122 128 142 197 238 240 240 240 240 240 240 240 240 240 240
|
||||
191 108 109 5 72 228 240 240 240 240 240 240 240 240 240 237
|
||||
236 240 237 150 29 223 240 240 240 240 240 240 240 240 240 240
|
||||
227 129 124 150 237 226 237 240 240 240 240 240 240 240 240 238
|
||||
152 51 155 45 120 237 238 240 240 240 240 240 240 240 240 240
|
||||
77 119 232 217 50 180 240 240 240 240 240 240 240 240 240 240
|
||||
175 161 161 186 53 226 240 240 240 240 240 240 240 240 240 240
|
||||
209 155 64 83 207 240 240 240 240 240 240 240 240 239 228 232
|
||||
140 148 117 144 150 150 225 229 232 236 234 236 240 227 229 235
|
||||
186 71 89 77 74 117 156 240 240 240 240 240 240 240 240 235
|
||||
240 240 219 51 187 240 240 240 240 240 240 240 240 240 240 240
|
||||
240 240 219 74 213 231 240 240 240 240 240 240 240 240 240 233
|
||||
98 76 65 61 51 72 186 240 240 240 240 240 240 240 240 240
|
||||
220 210 184 184 184 206 216 240 240 240 240 240 240 240 240 234
|
||||
150 109 121 106 103 115 225 240 240 240 240 240 240 240 240 240
|
||||
156 109 92 101 168 162 186 240 240 240 240 240 240 240 240 235
|
||||
207 121 128 142 197 240 240 240 240 240 240 240 240 240 240 240
|
||||
192 99 100 5 78 232 240 240 240 240 240 240 240 240 240 236
|
||||
236 240 236 150 29 223 240 240 240 240 240 240 240 240 240 240
|
||||
230 137 125 152 237 237 240 240 240 240 240 240 240 240 240 238
|
||||
152 51 156 52 120 240 240 240 240 240 240 240 240 240 240 240
|
||||
77 120 240 217 50 180 240 240 240 240 240 240 240 240 240 240
|
||||
176 166 170 186 53 226 240 240 240 240 240 240 240 240 240 240
|
||||
212 164 73 85 216 240 240 240 240 240 240 240 240 240 240 240
|
||||
149 155 127 147 156 150 225 228 232 235 232 234 240 227 229 234
|
||||
189 86 98 83 84 116 156 240 240 240 240 240 240 240 240 235
|
||||
240 240 219 51 186 238 240 240 240 240 240 240 240 240 240 240
|
||||
240 240 219 73 211 228 240 240 240 240 240 240 240 240 240 233
|
||||
98 76 58 50 47 66 182 240 240 240 240 240 240 240 240 240
|
||||
220 201 179 184 184 205 212 240 240 240 240 240 240 240 240 234
|
||||
141 85 109 106 109 115 225 240 240 240 240 240 240 240 240 240
|
||||
154 108 101 110 170 151 180 240 240 240 240 240 240 240 240 235
|
||||
206 121 128 148 200 238 240 240 240 240 240 240 240 240 240 240
|
||||
178 95 107 17 92 236 240 240 240 240 240 240 240 240 240 236
|
||||
235 232 237 151 30 225 240 240 240 240 240 240 240 240 240 240
|
||||
230 137 125 150 240 240 240 240 240 240 240 240 240 240 240 238
|
||||
152 51 155 45 120 240 240 240 240 240 240 240 240 240 240 240
|
||||
77 118 240 217 50 180 240 240 240 240 240 240 240 240 240 240
|
||||
175 153 163 186 53 226 240 240 240 240 240 240 240 240 240 240
|
||||
209 155 72 85 216 240 240 240 240 240 240 240 240 240 239 233
|
||||
@ -15,7 +15,7 @@
|
||||
let focalLength: number = 540 / Math.atan((70 * Math.PI) / 180);
|
||||
let fov = 75;
|
||||
//let baseHorizontalFOV: number = 2.0*Math.atan(baseAspectRation*Math.tan(baseVerticalFOV*0.5));
|
||||
|
||||
|
||||
let scene: Three.Scene = new Three.Scene();
|
||||
let camera: Three.PerspectiveCamera = new Three.PerspectiveCamera(
|
||||
75,
|
||||
|
||||
192
www/src/components/ARTest.svelte
Normal file
192
www/src/components/ARTest.svelte
Normal file
@ -0,0 +1,192 @@
|
||||
<script lang="ts">
|
||||
import { beforeUpdate, afterUpdate, onMount, onDestroy } from 'svelte';
|
||||
//import * as THREE from 'three';
|
||||
import * as THREE from '@ar-js-org/ar.js/node_modules/three/build/three';
|
||||
import * as THREEx from '@ar-js-org/ar.js/three.js/build/ar-threex';
|
||||
//import * as ARFr from "@ar-js-org/ar.js/aframe/build/aframe-ar-nft";
|
||||
|
||||
let container: HTMLElement;
|
||||
|
||||
//////////////////////////////////////////////////////////////////////////////////
|
||||
// Init
|
||||
//////////////////////////////////////////////////////////////////////////////////
|
||||
|
||||
var renderer: THREE.WebGLRenderer = new THREE.WebGLRenderer({
|
||||
antialias: true,
|
||||
alpha: true,
|
||||
precision: 'mediump',
|
||||
});
|
||||
|
||||
var clock: THREE.Clock = new THREE.Clock();
|
||||
|
||||
// init scene and camera
|
||||
var scene: THREE.Scene = new THREE.Scene();
|
||||
|
||||
//////////////////////////////////////////////////////////////////////////////////
|
||||
// Initialize a basic camera
|
||||
//////////////////////////////////////////////////////////////////////////////////
|
||||
|
||||
// Create a camera
|
||||
var camera: THREE.Camera = new THREE.Camera();
|
||||
scene.add(camera);
|
||||
|
||||
var light: THREE.AmbientLight = new THREE.AmbientLight(0xffffff);
|
||||
scene.add(light);
|
||||
|
||||
var markerRoot: THREE.Group = new THREE.Group();
|
||||
scene.add(markerRoot);
|
||||
|
||||
////////////////////////////////////////////////////////////////////////////////
|
||||
// handle arToolkitSource
|
||||
////////////////////////////////////////////////////////////////////////////////
|
||||
|
||||
var arToolkitSource = new THREEx.ArToolkitSource({
|
||||
sourceType: 'webcam',
|
||||
sourceWidth: 1920,
|
||||
sourceHeight: 1080,
|
||||
});
|
||||
|
||||
arToolkitSource.init(function onReady() {
|
||||
// use a resize to fullscreen mobile devices
|
||||
setTimeout(function () {
|
||||
onResize();
|
||||
}, 1000);
|
||||
});
|
||||
|
||||
// handle resize
|
||||
window.addEventListener('resize', function () {
|
||||
onResize();
|
||||
});
|
||||
|
||||
// listener for end loading of NFT marker
|
||||
window.addEventListener('arjs-nft-loaded', function (ev) {
|
||||
console.log(ev);
|
||||
});
|
||||
|
||||
function onResize() {
|
||||
arToolkitSource.onResizeElement();
|
||||
arToolkitSource.copyElementSizeTo(renderer.domElement);
|
||||
if (arToolkitContext.arController !== null) {
|
||||
arToolkitSource.copyElementSizeTo(arToolkitContext.arController.canvas);
|
||||
}
|
||||
}
|
||||
|
||||
////////////////////////////////////////////////////////////////////////////////
|
||||
// initialize arToolkitContext
|
||||
////////////////////////////////////////////////////////////////////////////////
|
||||
|
||||
// create atToolkitContext
|
||||
var arToolkitContext = new THREEx.ArToolkitContext(
|
||||
{
|
||||
detectionMode: 'mono',
|
||||
canvasWidth: 1920,
|
||||
canvasHeight: 1080,
|
||||
},
|
||||
{
|
||||
sourceWidth: 1920,
|
||||
sourceHeight: 1080,
|
||||
},
|
||||
);
|
||||
|
||||
// initialize it
|
||||
arToolkitContext.init(function onCompleted() {
|
||||
// copy projection matrix to camera
|
||||
camera.projectionMatrix.copy(arToolkitContext.getProjectionMatrix());
|
||||
});
|
||||
console.log(arToolkitContext);
|
||||
|
||||
////////////////////////////////////////////////////////////////////////////////
|
||||
// Create a ArMarkerControls
|
||||
////////////////////////////////////////////////////////////////////////////////
|
||||
|
||||
// MARKER
|
||||
var arMarkerControls = new THREEx.ArMarkerControls(
|
||||
arToolkitContext,
|
||||
markerRoot,
|
||||
{
|
||||
type: 'pattern',
|
||||
patternUrl: '../../public/patterns/patt.hiro',
|
||||
},
|
||||
);
|
||||
|
||||
scene.visible = false;
|
||||
|
||||
var root = new THREE.Object3D();
|
||||
scene.add(root);
|
||||
|
||||
//////////////////////////////////////////////////////////////////////////////////
|
||||
// add an object in the scene
|
||||
//////////////////////////////////////////////////////////////////////////////////
|
||||
|
||||
var threeGLTFLoader = new THREE.GLTFLoader();
|
||||
var model;
|
||||
|
||||
threeGLTFLoader.load('../../public/models/dingus_the_cat', function (gltf) {
|
||||
model = gltf.scene.children[0];
|
||||
model.name = 'dingus';
|
||||
|
||||
var animation = gltf.animations[0];
|
||||
var mixer = new THREE.AnimationMixer(model);
|
||||
var mixers = [mixer];
|
||||
//
|
||||
var action = mixer.clipAction(animation);
|
||||
action.play();
|
||||
|
||||
root.matrixAutoUpdate = false;
|
||||
root.add(model);
|
||||
|
||||
model.position.z = -100;
|
||||
//model.position.z = 100;
|
||||
|
||||
/*
|
||||
window.addEventListener('arjs-nft-init-data', function (nft) {
|
||||
console.log(nft);
|
||||
var msg = nft.detail;
|
||||
model.position.y = ((msg.height / msg.dpi) * 2.54 * 10) / 2.0; //y axis?
|
||||
model.position.x = ((msg.width / msg.dpi) * 2.54 * 10) / 2.0; //x axis?
|
||||
});*/
|
||||
|
||||
//////////////////////////////////////////////////////////////////////////////////
|
||||
// render the whole thing on the page
|
||||
//////////////////////////////////////////////////////////////////////////////////
|
||||
|
||||
var animate = function () {
|
||||
requestAnimationFrame(animate);
|
||||
|
||||
if (mixers.length > 0) {
|
||||
for (var i = 0; i < mixers.length; i++) {
|
||||
mixers[i].update(clock.getDelta());
|
||||
}
|
||||
}
|
||||
|
||||
if (!arToolkitSource.ready) {
|
||||
return;
|
||||
}
|
||||
|
||||
arToolkitContext.update(arToolkitSource.domElement);
|
||||
|
||||
// update scene.visible if the marker is seen
|
||||
scene.visible = camera.visible;
|
||||
|
||||
renderer.render(scene, camera);
|
||||
};
|
||||
|
||||
requestAnimationFrame(animate);
|
||||
});
|
||||
onMount(() => {
|
||||
renderer.setPixelRatio(window.devicePixelRatio);
|
||||
|
||||
renderer.setClearColor(new THREE.Color('lightgrey'), 0);
|
||||
renderer.setSize(window.innerWidth, window.innerHeight);
|
||||
renderer.domElement.style.position = 'absolute';
|
||||
renderer.domElement.style.top = '0px';
|
||||
renderer.domElement.style.left = '0px';
|
||||
container.appendChild(renderer.domElement);
|
||||
});
|
||||
</script>
|
||||
|
||||
<div class="Container" bind:this={container} />
|
||||
<canvas
|
||||
id="CanvasAR"
|
||||
style="background-color: black; width: 100%; height: 100%"
|
||||
/>
|
||||
@ -2,6 +2,7 @@
|
||||
import View3D from '../components/3DHandler.svelte';
|
||||
import Camera from '../components/CameraHandler.svelte';
|
||||
import NavBar from '../components/NavBar.svelte';
|
||||
import ARTest from '../components/ARTest.svelte';
|
||||
|
||||
let containerHeight: number;
|
||||
let containerWidth: number;
|
||||
@ -12,8 +13,9 @@
|
||||
bind:clientHeight={containerHeight}
|
||||
bind:clientWidth={containerWidth}
|
||||
>
|
||||
<Camera height={containerHeight} width={containerWidth} />
|
||||
<View3D height={containerHeight} width={containerWidth} />
|
||||
<ARTest/>
|
||||
<!-- <Camera height={containerHeight} width={containerWidth} /> -->
|
||||
<!-- <View3D height={containerHeight} width={containerWidth} /> -->
|
||||
</div>
|
||||
<NavBar />
|
||||
|
||||
|
||||
@ -5,7 +5,8 @@
|
||||
"baseUrl": "./src",
|
||||
"paths": {
|
||||
"@core": ["../../core/src"]
|
||||
}
|
||||
},
|
||||
"allowJs": true
|
||||
},
|
||||
"include": ["src/**/*"],
|
||||
"exclude": ["node_modules/*", "public/*"]
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user