xrviewer.js
2.73 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
import ARCS from '../build/arcs.js';
import * as THREE from '../deps/three.js/index.js';
//import FrustumCamera from '../deps/three.js/frustumcamera.js';
var XRViewer;
/**
* @class ARViewer
* @classdesc Simple compositing viewer for augmented reality
*/
XRViewer = ARCS.Component.create(
/** @lends ARViewer.prototype */
function () {
let renderer, scene3d, camera3d;
let sceneId;
// scenegraph initializations
scene3d = new THREE.Scene();
/**
* Initializes the widgets (HTML elements) needed as a basis
* for the viewer.
* @param cName {string} id of the container that will enclose the scene renderer
* @param vName {string} id of the element at the source of the video stream
* @slot
* @function ARViewer#setWidgets
*/
this.setWidgets = function() {
renderer = new THREE.WebGLRenderer();
renderer.setClearColor(0x000000, 1);
renderer.setSize(container.width, container.height);
container.appendChild(renderer.domElement);
var theta = 45;
camera3d = new THREE.PerspectiveCamera(theta, container.width / container.height, 0.01, 10);
scene3d.add(camera3d);
var _light = new THREE.DirectionalLight(0xffffff);
_light.position.set(0,5,5);
scene3d.add(_light);
updateAspectRatio();
};
/**
* Adds new objects to the current 3D scene
* @param scene {object} 3D object as defined by Three.js to add to the scene.
* @slot
* @function ARViewer#addScene
*/
this.addScene = function (scene) {
scene3d.add(scene);
};
/**
* Removes an object from the current 3D scene
* @param scene {object} 3D object as defined by Three.js to remove from the scene.
* @slot
* @function ARViewer#removeScene
*/
this.removeScene = function (scene) {
scene3d.remove(scene);
};
/**
* Triggers the rendering of the composite scene
* @function ARViewer#render
* @slot
*/
this.render = function () {
renderer.autoClear = false;
renderer.clear();
renderer.render(scene3d, camera3d);
}
},
/** @lends ARViewer.slots */
[
'setWidgets','setFocal','viewAll','setSize','addScene',
'resetCamera','removeScene','render','keepAspectRatio',
'setExtrinsics', 'setIntrinsics'
],
[]
);
export default {XRViewer: XRViewer};