Examples: Clean up

examples/svg_sandbox.html

@@ -84,30 +84,39 @@
 
 				// POLYFIELD
 
-				var geometry = new THREE.Geometry();
-				var material = new THREE.MeshBasicMaterial( { vertexColors: THREE.FaceColors, side: THREE.DoubleSide } );
+				var geometry = new THREE.BufferGeometry();
+				var material = new THREE.MeshBasicMaterial( { vertexColors: THREE.VertexColors, side: THREE.DoubleSide } );
+
+				var v = new THREE.Vector3();
+				var v0 = new THREE.Vector3();
+				var v1 = new THREE.Vector3();
+				var v2 = new THREE.Vector3();
+				var color = new THREE.Color();
+
+				var vertices = [];
+				var colors = [];
 
 				for ( var i = 0; i < 100; i ++ ) {
 
-					var v = new THREE.Vector3(
+					v.set(
 						Math.random() * 1000 - 500,
 						Math.random() * 1000 - 500,
 						Math.random() * 1000 - 500
 					);
 
-					var v0 = new THREE.Vector3(
+					v0.set(
 						Math.random() * 100 - 50,
 						Math.random() * 100 - 50,
 						Math.random() * 100 - 50
 					);
 
-					var v1 = new THREE.Vector3(
+					v1.set(
 						Math.random() * 100 - 50,
 						Math.random() * 100 - 50,
 						Math.random() * 100 - 50
 					);
 
-					var v2 = new THREE.Vector3(
+					v2.set(
 						Math.random() * 100 - 50,
 						Math.random() * 100 - 50,
 						Math.random() * 100 - 50
@@ -117,19 +126,22 @@
 					v1.add( v );
 					v2.add( v );
 
-					var face = new THREE.Face3(
-						geometry.vertices.push( v0 ) - 1,
-						geometry.vertices.push( v1 ) - 1,
-						geometry.vertices.push( v2 ) - 1,
-						null,
-						new THREE.Color( Math.random() * 0xffffff )
-					);
+					color.setHex( Math.random() * 0xffffff );
+
+					// create a single triangle
+
+					vertices.push( v0.x, v0.y, v0.z );
+					vertices.push( v1.x, v1.y, v1.z );
+					vertices.push( v2.x, v2.y, v2.z );
 
-					geometry.faces.push( face );
+					colors.push( color.r, color.g, color.b );
+					colors.push( color.r, color.g, color.b );
+					colors.push( color.r, color.g, color.b );
 
 				}
 
-				geometry.computeFaceNormals();
+				geometry.addAttribute( 'position', new THREE.Float32BufferAttribute( vertices, 3 ) );
+				geometry.addAttribute( 'color', new THREE.Float32BufferAttribute( colors, 3 ) );
 
 				group = new THREE.Mesh( geometry, material );
 				group.scale.set( 2, 2, 2 );

examples/webgl_materials.html

@@ -64,34 +64,18 @@
 				materials.push( new THREE.MeshPhongMaterial( { color: 0xdddddd, specular: 0x009900, shininess: 30, flatShading: true } ) );
 				materials.push( new THREE.MeshNormalMaterial() );
 				materials.push( new THREE.MeshBasicMaterial( { color: 0xffaa00, transparent: true, blending: THREE.AdditiveBlending } ) );
-				//materials.push( new THREE.MeshBasicMaterial( { color: 0xff0000, blending: THREE.SubtractiveBlending } ) );
-
 				materials.push( new THREE.MeshLambertMaterial( { color: 0xdddddd } ) );
 				materials.push( new THREE.MeshPhongMaterial( { color: 0xdddddd, specular: 0x009900, shininess: 30, map: texture, transparent: true } ) );
 				materials.push( new THREE.MeshNormalMaterial( { flatShading: true } ) );
 				materials.push( new THREE.MeshBasicMaterial( { color: 0xffaa00, wireframe: true } ) );
-
 				materials.push( new THREE.MeshDepthMaterial() );
-
 				materials.push( new THREE.MeshLambertMaterial( { color: 0x666666, emissive: 0xff0000 } ) );
 				materials.push( new THREE.MeshPhongMaterial( { color: 0x000000, specular: 0x666666, emissive: 0xff0000, shininess: 10, opacity: 0.9, transparent: true } ) );
-
 				materials.push( new THREE.MeshBasicMaterial( { map: texture, transparent: true } ) );
 
 				// Spheres geometry
 
-				var geometry = new THREE.SphereGeometry( 70, 32, 16 );
-
-				for ( var i = 0, l = geometry.faces.length; i < l; i ++ ) {
-
-					var face = geometry.faces[ i ];
-					face.materialIndex = Math.floor( Math.random() * materials.length );
-
-				}
-
-				geometry.sortFacesByMaterialIndex();
-
-				objects = [];
+				var geometry = new THREE.SphereBufferGeometry( 70, 32, 16 );
 
 				for ( var i = 0, l = materials.length; i < l; i ++ ) {
 
@@ -99,8 +83,6 @@
 
 				}
 
-				addMesh( geometry, materials );
-
 				// Lights
 
 				scene.add( new THREE.AmbientLight( 0x111111 ) );