Skip to content

Commit 99ae5a1

Browse files
Mugen87mrdoob
Mugen87
authored and
mrdoob
committed
PLYLoader: BufferGeometry and Blender style (mrdoob#9796)
1 parent cce25aa commit 99ae5a1

2 files changed

Lines changed: 76 additions & 77 deletions

File tree

‎examples/js/loaders/PLYLoader.js‎

Lines changed: 74 additions & 75 deletions
Original file line numberDiff line numberDiff line change
@@ -64,7 +64,7 @@ THREE.PLYLoader.prototype = {
6464
function isASCII( data ) {
6565

6666
var header = parseHeader( bin2str( data ) );
67-
return header.format === "ascii";
67+
return header.format === 'ascii';
6868

6969
}
7070

@@ -86,7 +86,7 @@ THREE.PLYLoader.prototype = {
8686
function parseHeader( data ) {
8787

8888
var patternHeader = /ply([\s\S]*)end_header\s/;
89-
var headerText = "";
89+
var headerText = '';
9090
var headerLength = 0;
9191
var result = patternHeader.exec( data );
9292

@@ -138,28 +138,28 @@ THREE.PLYLoader.prototype = {
138138
var line = lines[ i ];
139139
line = line.trim();
140140

141-
if ( line === "" ) continue;
141+
if ( line === '' ) continue;
142142

143143
lineValues = line.split( /\s+/ );
144144
lineType = lineValues.shift();
145-
line = lineValues.join( " " );
145+
line = lineValues.join( ' ' );
146146

147147
switch ( lineType ) {
148148

149-
case "format":
149+
case 'format':
150150

151151
header.format = lineValues[ 0 ];
152152
header.version = lineValues[ 1 ];
153153

154154
break;
155155

156-
case "comment":
156+
case 'comment':
157157

158158
header.comments.push( line );
159159

160160
break;
161161

162-
case "element":
162+
case 'element':
163163

164164
if ( currentElement !== undefined ) {
165165

@@ -174,7 +174,7 @@ THREE.PLYLoader.prototype = {
174174

175175
break;
176176

177-
case "property":
177+
case 'property':
178178

179179
currentElement.properties.push( make_ply_element_property( lineValues, scope.propertyNameMapping ) );
180180

@@ -183,7 +183,7 @@ THREE.PLYLoader.prototype = {
183183

184184
default:
185185

186-
console.log( "unhandled", lineType, lineValues );
186+
console.log( 'unhandled', lineType, lineValues );
187187

188188
}
189189

@@ -224,7 +224,7 @@ THREE.PLYLoader.prototype = {
224224

225225
for ( var i = 0; i < properties.length; i ++ ) {
226226

227-
if ( properties[ i ].type === "list" ) {
227+
if ( properties[ i ].type === 'list' ) {
228228

229229
var list = [];
230230
var n = parseASCIINumber( values.shift(), properties[ i ].countType );
@@ -253,14 +253,20 @@ THREE.PLYLoader.prototype = {
253253

254254
// PLY ascii format specification, as per http://en.wikipedia.org/wiki/PLY_(file_format)
255255

256-
var geometry = new THREE.Geometry();
256+
var buffer = {
257+
indices : [],
258+
vertices : [],
259+
normals : [],
260+
uvs : [],
261+
colors : []
262+
};
257263

258264
var result;
259265

260266
var header = parseHeader( data );
261267

262268
var patternBody = /end_header\s([\s\S]*)$/;
263-
var body = "";
269+
var body = '';
264270
if ( ( result = patternBody.exec( data ) ) !== null ) {
265271

266272
body = result [ 1 ];
@@ -270,13 +276,12 @@ THREE.PLYLoader.prototype = {
270276
var lines = body.split( '\n' );
271277
var currentElement = 0;
272278
var currentElementCount = 0;
273-
geometry.useColor = false;
274279

275280
for ( var i = 0; i < lines.length; i ++ ) {
276281

277282
var line = lines[ i ];
278283
line = line.trim();
279-
if ( line === "" ) {
284+
if ( line === '' ) {
280285

281286
continue;
282287

@@ -291,31 +296,42 @@ THREE.PLYLoader.prototype = {
291296

292297
var element = parseASCIIElement( header.elements[ currentElement ].properties, line );
293298

294-
handleElement( geometry, header.elements[ currentElement ].name, element );
299+
handleElement( buffer, header.elements[ currentElement ].name, element );
295300

296301
currentElementCount ++;
297302

298303
}
299304

300-
return postProcess( geometry );
305+
return postProcess( buffer );
301306

302307
}
303308

304-
function postProcess( geometry ) {
309+
function postProcess( buffer ) {
305310

306-
if ( geometry.useColor ) {
311+
var geometry = new THREE.BufferGeometry();
307312

308-
for ( var i = 0; i < geometry.faces.length; i ++ ) {
313+
// mandatory buffer data
309314

310-
geometry.faces[ i ].vertexColors = [
311-
geometry.colors[ geometry.faces[ i ].a ],
312-
geometry.colors[ geometry.faces[ i ].b ],
313-
geometry.colors[ geometry.faces[ i ].c ]
314-
];
315+
geometry.setIndex( ( buffer.indices.length > 65535 ? THREE.Uint32Attribute : THREE.Uint16Attribute )( buffer.indices, 1 ) );
316+
geometry.addAttribute( 'position', THREE.Float32Attribute( buffer.vertices, 3 ) );
315317

316-
}
318+
// optional buffer data
319+
320+
if ( buffer.normals.length > 0 ) {
321+
322+
geometry.addAttribute( 'normal', THREE.Float32Attribute( buffer.normals, 3 ) );
323+
324+
}
325+
326+
if ( buffer.uvs.length > 0 ) {
317327

318-
geometry.elementsNeedUpdate = true;
328+
geometry.addAttribute( 'uv', THREE.Float32Attribute( buffer.uvs, 2 ) );
329+
330+
}
331+
332+
if ( buffer.colors.length > 0 ) {
333+
334+
geometry.addAttribute( 'color', THREE.Float32Attribute( buffer.colors, 3 ) );
319335

320336
}
321337

@@ -325,61 +341,42 @@ THREE.PLYLoader.prototype = {
325341

326342
}
327343

328-
function handleElement( geometry, elementName, element ) {
344+
function handleElement( buffer, elementName, element ) {
329345

330-
if ( elementName === "vertex" ) {
346+
if ( elementName === 'vertex' ) {
331347

332-
geometry.vertices.push(
333-
new THREE.Vector3( element.x, element.y, element.z )
334-
);
348+
buffer.vertices.push( element.x, element.y, element.z );
335349

336-
if ( 'red' in element && 'green' in element && 'blue' in element ) {
350+
if ( 'nx' in element && 'ny' in element && 'nz' in element ) {
351+
352+
buffer.normals.push( element.nx, element.ny, element.nz );
337353

338-
geometry.useColor = true;
354+
}
355+
356+
if ( 's' in element && 't' in element ) {
339357

340-
var color = new THREE.Color();
341-
color.setRGB( element.red / 255.0, element.green / 255.0, element.blue / 255.0 );
342-
geometry.colors.push( color );
358+
buffer.uvs.push( element.s, element.t );
343359

344360
}
345361

346-
} else if ( elementName === "face" ) {
362+
if ( 'red' in element && 'green' in element && 'blue' in element ) {
347363

348-
var vertex_indices = element.vertex_indices;
349-
var texcoord = element.texcoord;
364+
buffer.colors.push( element.red / 255.0, element.green / 255.0, element.blue / 255.0 );
350365

351-
if ( vertex_indices.length === 3 ) {
366+
}
352367

353-
geometry.faces.push(
354-
new THREE.Face3( vertex_indices[ 0 ], vertex_indices[ 1 ], vertex_indices[ 2 ] )
355-
);
368+
} else if ( elementName === 'face' ) {
356369

357-
if ( texcoord ) {
358-
geometry.faceVertexUvs[ 0 ].push( [
359-
new THREE.Vector2( texcoord[ 0 ], texcoord[ 1 ]),
360-
new THREE.Vector2( texcoord[ 2 ], texcoord[ 3 ]),
361-
new THREE.Vector2( texcoord[ 4 ], texcoord[ 5 ])
362-
] );
363-
}
370+
var vertex_indices = element.vertex_indices || element.vertex_index; // issue #9338
371+
372+
if ( vertex_indices.length === 3 ) {
373+
374+
buffer.indices.push( vertex_indices[ 0 ], vertex_indices[ 1 ], vertex_indices[ 2 ] );
364375

365376
} else if ( vertex_indices.length === 4 ) {
366377

367-
geometry.faces.push(
368-
new THREE.Face3( vertex_indices[ 0 ], vertex_indices[ 1 ], vertex_indices[ 3 ] ),
369-
new THREE.Face3( vertex_indices[ 1 ], vertex_indices[ 2 ], vertex_indices[ 3 ] )
370-
);
371-
372-
if ( texcoord ) {
373-
geometry.faceVertexUvs[ 0 ].push( [
374-
new THREE.Vector2( texcoord[ 0 ], texcoord[ 1 ]),
375-
new THREE.Vector2( texcoord[ 2 ], texcoord[ 3 ]),
376-
new THREE.Vector2( texcoord[ 6 ], texcoord[ 7 ])
377-
], [
378-
new THREE.Vector2( texcoord[ 2 ], texcoord[ 3 ]),
379-
new THREE.Vector2( texcoord[ 4 ], texcoord[ 5 ]),
380-
new THREE.Vector2( texcoord[ 6 ], texcoord[ 7 ])
381-
] );
382-
}
378+
buffer.indices.push( vertex_indices[ 0 ], vertex_indices[ 1 ], vertex_indices[ 3 ] );
379+
buffer.indices.push( vertex_indices[ 1 ], vertex_indices[ 2 ], vertex_indices[ 3 ] );
383380

384381
}
385382

@@ -412,7 +409,7 @@ THREE.PLYLoader.prototype = {
412409

413410
for ( var i = 0; i < properties.length; i ++ ) {
414411

415-
if ( properties[ i ].type === "list" ) {
412+
if ( properties[ i ].type === 'list' ) {
416413

417414
var list = [];
418415

@@ -446,10 +443,16 @@ THREE.PLYLoader.prototype = {
446443

447444
function parseBinary( data ) {
448445

449-
var geometry = new THREE.Geometry();
446+
var buffer = {
447+
indices : [],
448+
vertices : [],
449+
normals : [],
450+
uvs : [],
451+
colors : []
452+
};
450453

451454
var header = parseHeader( bin2str( data ) );
452-
var little_endian = ( header.format === "binary_little_endian" );
455+
var little_endian = ( header.format === 'binary_little_endian' );
453456
var body = new DataView( data, header.headerLength );
454457
var result, loc = 0;
455458

@@ -461,20 +464,18 @@ THREE.PLYLoader.prototype = {
461464
loc += result[ 1 ];
462465
var element = result[ 0 ];
463466

464-
handleElement( geometry, header.elements[ currentElement ].name, element );
467+
handleElement( buffer, header.elements[ currentElement ].name, element );
465468

466469
}
467470

468471
}
469472

470-
return postProcess( geometry );
473+
return postProcess( buffer );
471474

472475
}
473476

474477
//
475478

476-
console.time( 'PLYLoader' );
477-
478479
var geometry;
479480
var scope = this;
480481

@@ -488,8 +489,6 @@ THREE.PLYLoader.prototype = {
488489

489490
}
490491

491-
console.timeEnd( 'PLYLoader' );
492-
493492
return geometry;
494493

495494
}

‎examples/webgl_loader_ply.html‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -92,9 +92,9 @@
9292
var loader = new THREE.PLYLoader();
9393
loader.load( './models/ply/ascii/dolphins.ply', function ( geometry ) {
9494

95-
geometry.computeFaceNormals();
95+
geometry.computeVertexNormals();
9696

97-
var material = new THREE.MeshStandardMaterial( { color: 0x0055ff } );
97+
var material = new THREE.MeshStandardMaterial( { color: 0x0055ff, shading: THREE.FlatShading } );
9898
var mesh = new THREE.Mesh( geometry, material );
9999

100100
mesh.position.y = - 0.25;

0 commit comments

Comments
 (0)