Skip to content

Commit 4373f6d

Browse files
OviliaOvilia
committed
Merge branch 'master' of github.com:Ovilia/ThreeExample.js
2 parents 6fc0255 + cff735c commit 4373f6d

5 files changed

Lines changed: 9502 additions & 43 deletions

File tree

‎Chapter7/7.3.2.html‎

Lines changed: 18 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
<head>
44
<script type="text/javascript" src="../lib/three.js"></script>
55
<script type="text/javascript" src="../lib/MTLLoader.js"></script>
6-
<script type="text/javascript" src="../lib/OBJMTLLoader.js"></script>
6+
<script type="text/javascript" src="../lib/OBJLoader.js"></script>
77

88
<script type="text/javascript">
99
var scene = null;
@@ -25,18 +25,25 @@
2525
camera.lookAt(new THREE.Vector3(0, 2, 0));
2626
scene.add(camera);
2727

28-
var loader = new THREE.OBJMTLLoader();
29-
loader.addEventListener('load', function(event) {
30-
var obj = event.content;
31-
mesh = obj;
32-
scene.add(obj);
28+
// material loader
29+
var mtlLoader = new THREE.MTLLoader();
30+
mtlLoader.setPath('../lib/');
31+
mtlLoader.load('port.mtl', function(materials) {
32+
materials.preload();
33+
34+
// model loader
35+
var objLoader = new THREE.OBJLoader();
36+
objLoader.setMaterials(materials);
37+
objLoader.setPath('../lib/');
38+
objLoader.load('port.obj', function ( object ) {
39+
object.position.y = - 95;
40+
// if has object, add to scene
41+
if (object.children.length > 0) {
42+
scene.add( object.children[0] );
43+
}
44+
});
3345
});
34-
loader.load('../lib/port.obj', '../lib/port.mtl');
3546

36-
37-
//var loader = new THREE.OBJMTLLoader();
38-
39-
4047
var light = new THREE.DirectionalLight(0xffffff);
4148
light.position.set(20, 10, 5);
4249
scene.add(light);

‎Chapter7/7.3.3.html‎

Lines changed: 50 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,50 @@
1+
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
2+
<html>
3+
<head>
4+
<script type="text/javascript" src="../lib/three.js"></script>
5+
<script type="text/javascript" src="../lib/ColladaLoader.js"></script>
6+
7+
<script type="text/javascript">
8+
var scene = null;
9+
var camera = null;
10+
var renderer = null;
11+
12+
var mesh = null;
13+
var id = null;
14+
15+
function init() {
16+
renderer = new THREE.WebGLRenderer({
17+
canvas: document.getElementById('mainCanvas')
18+
});
19+
renderer.setClearColor(0x000000);
20+
scene = new THREE.Scene();
21+
22+
camera = new THREE.OrthographicCamera(-5, 5, 3.75, -3.75, 0.1, 100);
23+
camera.position.set(15, 25, 25);
24+
camera.lookAt(new THREE.Vector3(0, 2, 0));
25+
scene.add(camera);
26+
27+
var loader = new THREE.ColladaLoader();
28+
loader.load('../lib/port.dae', function (collada) {
29+
if (collada.scene.children.length > 0) {
30+
scene.add(collada.scene.children[0]);
31+
}
32+
});
33+
34+
var light = new THREE.DirectionalLight(0xffffff);
35+
light.position.set(20, 10, 5);
36+
scene.add(light);
37+
38+
id = setInterval(draw, 20);
39+
}
40+
41+
function draw() {
42+
renderer.render(scene, camera);
43+
}
44+
</script>
45+
</head>
46+
47+
<body onload="init()">
48+
<canvas id="mainCanvas" width="400px" height="300px" ></canvas>
49+
</body>
50+
</html>

0 commit comments

Comments
 (0)