Skip to content

Commit db5ff0e

Browse files
committed
OBJLoader: Added normals.
Starting to get complicated ^^
1 parent 9d84fbe commit db5ff0e

2 files changed

Lines changed: 132 additions & 28 deletions

File tree

examples/js/loaders/OBJLoader.js

Lines changed: 125 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -41,26 +41,27 @@ THREE.OBJLoader.prototype.load = function ( url, callback ) {
4141

4242
THREE.OBJLoader.prototype.parse = function ( data ) {
4343

44-
function vertex( a, b, c ) {
44+
function vector( x, y, z ) {
4545

46-
return new THREE.Vector3( parseFloat( a ), parseFloat( b ), parseFloat( c ) );
46+
return new THREE.Vector3( x, y, z );
4747

4848
}
4949

50-
function face3( a, b, c ) {
50+
function face3( a, b, c, normals ) {
5151

52-
return new THREE.Face3( parseInt( a ) - 1, parseInt( b ) - 1, parseInt( c ) - 1 );
52+
return new THREE.Face3( a, b, c, normals );
5353

5454
}
5555

56-
function face4( a, b, c, d ) {
56+
function face4( a, b, c, d, normals ) {
5757

58-
return new THREE.Face4( parseInt( a ) - 1, parseInt( b ) - 1, parseInt( c ) - 1, parseInt( d ) - 1 );
58+
return new THREE.Face4( a, b, c, d, normals );
5959

6060
}
6161

6262
var objects = [];
6363
var vertices = [];
64+
var normals = [];
6465

6566
var pattern, result;
6667

@@ -72,7 +73,28 @@ THREE.OBJLoader.prototype.parse = function ( data ) {
7273

7374
// ["v 1.0 2.0 3.0", "1.0", "2.0", "3.0"]
7475

75-
vertices.push( vertex( result[ 1 ], result[ 2 ], result[ 3 ] ) );
76+
vertices.push( vector(
77+
parseFloat( result[ 1 ] ),
78+
parseFloat( result[ 2 ] ),
79+
parseFloat( result[ 3 ] )
80+
) );
81+
82+
}
83+
84+
85+
// vn float float float
86+
87+
pattern = /vn( [\d|\.|\+|\-|e]+)( [\d|\.|\+|\-|e]+)( [\d|\.|\+|\-|e]+)/g;
88+
89+
while ( ( result = pattern.exec( data ) ) != null ) {
90+
91+
// ["v 1.0 2.0 3.0", "1.0", "2.0", "3.0"]
92+
93+
normals.push( vector(
94+
parseFloat( result[ 1 ] ),
95+
parseFloat( result[ 2 ] ),
96+
parseFloat( result[ 3 ] )
97+
) );
7698

7799
}
78100

@@ -94,11 +116,24 @@ THREE.OBJLoader.prototype.parse = function ( data ) {
94116

95117
// ["f 1 2 3", "1", "2", "3", undefined]
96118

97-
geometry.faces.push(
98-
result[ 4 ] === undefined ?
99-
face3( result[ 1 ], result[ 2 ], result[ 3 ] ) :
100-
face4( result[ 1 ], result[ 2 ], result[ 3 ], result[ 4 ] )
101-
);
119+
if ( result[ 4 ] === undefined ) {
120+
121+
geometry.faces.push( face3(
122+
parseInt( result[ 1 ] ) - 1,
123+
parseInt( result[ 2 ] ) - 1,
124+
parseInt( result[ 3 ] ) - 1
125+
) );
126+
127+
} else {
128+
129+
geometry.faces.push( face4(
130+
parseInt( result[ 1 ] ) - 1,
131+
parseInt( result[ 2 ] ) - 1,
132+
parseInt( result[ 3 ] ) - 1,
133+
parseInt( result[ 4 ] ) - 1
134+
) );
135+
136+
}
102137

103138
}
104139

@@ -110,11 +145,24 @@ THREE.OBJLoader.prototype.parse = function ( data ) {
110145

111146
// ["f 1/1 2/2 3/3", " 1/1", "1", "1", " 2/2", "2", "2", " 3/3", "3", "3", undefined, undefined, undefined]
112147

113-
geometry.faces.push(
114-
result[ 10 ] === undefined ?
115-
face3( result[ 2 ], result[ 5 ], result[ 8 ] ) :
116-
face4( result[ 2 ], result[ 5 ], result[ 8 ], result[ 11 ] )
117-
);
148+
if ( result[ 10 ] === undefined ) {
149+
150+
geometry.faces.push( face3(
151+
parseInt( result[ 2 ] ) - 1,
152+
parseInt( result[ 5 ] ) - 1,
153+
parseInt( result[ 8 ] ) - 1
154+
) );
155+
156+
} else {
157+
158+
geometry.faces.push( face4(
159+
parseInt( result[ 2 ] ) - 1,
160+
parseInt( result[ 5 ] ) - 1,
161+
parseInt( result[ 8 ] ) - 1,
162+
parseInt( result[ 11 ] ) - 1
163+
) );
164+
165+
}
118166

119167
}
120168

@@ -126,11 +174,36 @@ THREE.OBJLoader.prototype.parse = function ( data ) {
126174

127175
// ["f 1/1/1 2/2/2 3/3/3", " 1/1/1", "1", "1", "1", " 2/2/2", "2", "2", "2", " 3/3/3", "3", "3", "3", undefined, undefined, undefined, undefined]
128176

129-
geometry.faces.push(
130-
result[ 13 ] === undefined ?
131-
face3( result[ 2 ], result[ 6 ], result[ 10 ] ) :
132-
face4( result[ 2 ], result[ 6 ], result[ 10 ], result[ 14 ] )
133-
);
177+
if ( result[ 13 ] === undefined ) {
178+
179+
geometry.faces.push( face3(
180+
parseInt( result[ 2 ] ) - 1,
181+
parseInt( result[ 6 ] ) - 1,
182+
parseInt( result[ 10 ] ) - 1,
183+
[
184+
normals[ parseInt( result[ 4 ] ) - 1 ],
185+
normals[ parseInt( result[ 8 ] ) - 1 ],
186+
normals[ parseInt( result[ 12 ] ) - 1 ]
187+
]
188+
) );
189+
190+
} else {
191+
192+
geometry.faces.push( face4(
193+
parseInt( result[ 2 ] ) - 1,
194+
parseInt( result[ 6 ] ) - 1,
195+
parseInt( result[ 10 ] ) - 1,
196+
parseInt( result[ 14 ] ) - 1,
197+
[
198+
normals[ parseInt( result[ 4 ] ) - 1 ],
199+
normals[ parseInt( result[ 8 ] ) - 1 ],
200+
normals[ parseInt( result[ 12 ] ) - 1 ],
201+
normals[ parseInt( result[ 16 ] ) - 1 ]
202+
]
203+
) );
204+
205+
}
206+
134207

135208
}
136209

@@ -142,17 +215,41 @@ THREE.OBJLoader.prototype.parse = function ( data ) {
142215

143216
// ["f 1//1 2//2 3//3", " 1//1", "1", "1", " 2//2", "2", "2", " 3//3", "3", "3", undefined, undefined, undefined]
144217

145-
geometry.faces.push(
146-
result[ 10 ] === undefined ?
147-
face3( result[ 2 ], result[ 5 ], result[ 8 ] ) :
148-
face4( result[ 2 ], result[ 5 ], result[ 8 ], result[ 11 ] )
149-
);
218+
if ( result[ 10 ] === undefined ) {
219+
220+
geometry.faces.push( face3(
221+
parseInt( result[ 2 ] ) - 1,
222+
parseInt( result[ 5 ] ) - 1,
223+
parseInt( result[ 8 ] ) - 1,
224+
[
225+
normals[ parseInt( result[ 3 ] ) - 1 ],
226+
normals[ parseInt( result[ 6 ] ) - 1 ],
227+
normals[ parseInt( result[ 9 ] ) - 1 ]
228+
]
229+
) );
230+
231+
} else {
232+
233+
geometry.faces.push( face4(
234+
parseInt( result[ 2 ] ) - 1,
235+
parseInt( result[ 5 ] ) - 1,
236+
parseInt( result[ 8 ] ) - 1,
237+
parseInt( result[ 11 ] ) - 1,
238+
[
239+
normals[ parseInt( result[ 3 ] ) - 1 ],
240+
normals[ parseInt( result[ 6 ] ) - 1 ],
241+
normals[ parseInt( result[ 9 ] ) - 1 ],
242+
normals[ parseInt( result[ 12 ] ) - 1 ]
243+
]
244+
) );
245+
246+
}
150247

151248
}
152249

153250
geometry.computeCentroids();
154251

155-
objects.push( new THREE.Mesh( geometry, new THREE.MeshBasicMaterial( { color: Math.random() * 0xffffff } ) ) );
252+
objects.push( new THREE.Mesh( geometry, new THREE.MeshLambertMaterial( { color: Math.random() * 0xffffff } ) ) );
156253

157254
}
158255

examples/webgl_loader_obj.html

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -63,6 +63,13 @@
6363
camera.position.z = 100;
6464
scene.add( camera );
6565

66+
var ambient = new THREE.AmbientLight( 0x101030 );
67+
scene.add( ambient );
68+
69+
var directionalLight = new THREE.DirectionalLight( 0xffeedd );
70+
directionalLight.position.set( 0, 0, 1 ).normalize();
71+
scene.add( directionalLight );
72+
6673
var loader = new THREE.OBJLoader();
6774
loader.load( "obj/male02/male02.obj", function ( objects ) {
6875

0 commit comments

Comments
 (0)