Browse Source

Geometry -> BufferGeometry

WestLangley 7 years ago
parent
commit
c52260d932
2 changed files with 16 additions and 11 deletions
  1. 6 4
      examples/canvas_geometry_terrain.html
  2. 10 7
      examples/canvas_lines_sphere.html

+ 6 - 4
examples/canvas_geometry_terrain.html

@@ -71,17 +71,19 @@
 
 
 				var data = generateHeight( 1024, 1024 );
 				var data = generateHeight( 1024, 1024 );
 				var texture = new THREE.CanvasTexture( generateTexture( data, 1024, 1024 ) );
 				var texture = new THREE.CanvasTexture( generateTexture( data, 1024, 1024 ) );
-				var material = new THREE.MeshBasicMaterial( { map: texture, overdraw: 0.5 } );
+				var material = new THREE.MeshBasicMaterial( { map: texture, side: THREE.DoubleSide, overdraw: 0.5 } );
 
 
 				var quality = 16, step = 1024 / quality;
 				var quality = 16, step = 1024 / quality;
 
 
-				var geometry = new THREE.PlaneGeometry( 2000, 2000, quality - 1, quality - 1 );
+				var geometry = new THREE.PlaneBufferGeometry( 2000, 2000, quality - 1, quality - 1 );
 				geometry.rotateX( - Math.PI / 2 );
 				geometry.rotateX( - Math.PI / 2 );
 
 
-				for ( var i = 0, l = geometry.vertices.length; i < l; i ++ ) {
+				var positions = geometry.attributes.position;
+
+				for ( var i = 0, l = positions.count; i < l; i ++ ) {
 
 
 					var x = i % quality, y = Math.floor( i / quality );
 					var x = i % quality, y = Math.floor( i / quality );
-					geometry.vertices[ i ].y = data[ ( x * step ) + ( y * step ) * 1024 ] * 2 - 128;
+					positions.setY( i, data[ ( x * step ) + ( y * step ) * 1024 ] * 2 - 128 );
 
 
 				}
 				}
 
 

+ 10 - 7
examples/canvas_lines_sphere.html

@@ -83,7 +83,7 @@
 					particle.position.y = Math.random() * 2 - 1;
 					particle.position.y = Math.random() * 2 - 1;
 					particle.position.z = Math.random() * 2 - 1;
 					particle.position.z = Math.random() * 2 - 1;
 					particle.position.normalize();
 					particle.position.normalize();
-					particle.position.multiplyScalar( Math.random() * 10 + 450 );
+					particle.position.multiplyScalar( 450 );
 					particle.scale.multiplyScalar( 2 );
 					particle.scale.multiplyScalar( 2 );
 					scene.add( particle );
 					scene.add( particle );
 
 
@@ -91,25 +91,28 @@
 
 
 				// lines
 				// lines
 
 
-				for (var i = 0; i < 300; i++) {
+				var vertices = [];
 
 
-					var geometry = new THREE.Geometry();
+				for (var i = 0; i < 300; i++) {
 
 
 					var vertex = new THREE.Vector3( Math.random() * 2 - 1, Math.random() * 2 - 1, Math.random() * 2 - 1 );
 					var vertex = new THREE.Vector3( Math.random() * 2 - 1, Math.random() * 2 - 1, Math.random() * 2 - 1 );
 					vertex.normalize();
 					vertex.normalize();
 					vertex.multiplyScalar( 450 );
 					vertex.multiplyScalar( 450 );
 
 
-					geometry.vertices.push( vertex );
+					vertices.push( vertex );
 
 
 					var vertex2 = vertex.clone();
 					var vertex2 = vertex.clone();
 					vertex2.multiplyScalar( Math.random() * 0.3 + 1 );
 					vertex2.multiplyScalar( Math.random() * 0.3 + 1 );
 
 
-					geometry.vertices.push( vertex2 );
+					vertices.push( vertex2 );
 
 
-					var line = new THREE.Line( geometry, new THREE.LineBasicMaterial( { color: 0xffffff, opacity: Math.random() } ) );
-					scene.add( line );
 				}
 				}
 
 
+				var geometry = new THREE.BufferGeometry().setFromPoints( vertices );
+
+				var line = new THREE.LineSegments( geometry, new THREE.LineBasicMaterial( { color: 0xffffff } ) );
+				scene.add( line );
+
 				document.addEventListener( 'mousemove', onDocumentMouseMove, false );
 				document.addEventListener( 'mousemove', onDocumentMouseMove, false );
 				document.addEventListener( 'touchstart', onDocumentTouchStart, false );
 				document.addEventListener( 'touchstart', onDocumentTouchStart, false );
 				document.addEventListener( 'touchmove', onDocumentTouchMove, false );
 				document.addEventListener( 'touchmove', onDocumentTouchMove, false );