浏览代码

Added new Geometry tests.

Mr.doob 11 年之前
父节点
当前提交
c485930b28

+ 82 - 0
examples/js/wip/Geometry4.js

@@ -0,0 +1,82 @@
+THREE.Geometry4 = function ( size ) {
+
+        THREE.BufferGeometry.call( this );
+
+        var verticesBuffer = new ArrayBuffer( size * 3 * 4 );
+        var normalsBuffer = new ArrayBuffer( size * 3 * 4 );
+        var uvsBuffer = new ArrayBuffer( size * 2 * 4 );
+
+        this.attributes[ 'position' ] = { array: new Float32Array( verticesBuffer, 0, size * 3 ), itemSize: 3 };
+        this.attributes[ 'normal' ] = { array: new Float32Array( normalsBuffer, 0, size * 3 ), itemSize: 3 };
+        this.attributes[ 'uv' ] = { array: new Float32Array( uvsBuffer, 0, size * 2 ), itemSize: 2 };
+
+        this.vertices = new THREE.VectorArrayProxy( this.attributes[ 'position' ] );
+        this.normals = new THREE.VectorArrayProxy( this.attributes[ 'normal' ] );
+        this.uvs = new THREE.VectorArrayProxy( this.attributes[ 'uv' ] );
+
+};
+THREE.Geometry4.prototype = Object.create( THREE.BufferGeometry.prototype );
+
+THREE.VectorArrayProxy = function(attribute) {
+
+        // Acts as a proxy for an array of vectors, by setting up accessors which return THREE.Vector*Proxy objects
+
+        this.attribute = attribute;
+
+        for (var i = 0, l = this.attribute.array.length / this.attribute.itemSize; i < l; i++)  {
+
+                Object.defineProperty(this, i, {
+                        get: (function(i) { return function() { return this.getValue(i); }})(i),
+                        set: (function(i) { return function(v) { return this.setValue(i, v); }})(i),
+                });
+
+        }
+
+}
+
+THREE.VectorArrayProxy.prototype.getValue = function(i) {
+
+        // Allocates a new THREE.Vector2Proxy or THREE.Vector3Proxy depending on the itemSize of our attribute
+
+        var subarray = this.attribute.array.subarray(i * this.attribute.itemSize, (i + 1) * this.attribute.itemSize);
+
+        switch (this.attribute.itemSize) {
+
+                case 2:
+                        return new THREE.Vector2Proxy(subarray);
+
+                case 3:
+                        return new THREE.Vector3Proxy(subarray);
+
+        }
+
+}
+THREE.VectorArrayProxy.prototype.setValue = function(i, v) {
+
+        var vec = this[i];
+        vec.copy(v);
+
+}
+
+// Vector Proxy Objects
+
+THREE.Vector2Proxy = function(subarray) {
+
+        this.subarray = subarray;
+
+}
+THREE.Vector2Proxy.prototype = Object.create( THREE.Vector2.prototype );
+Object.defineProperty(THREE.Vector2Proxy.prototype, 'x', { get: function() { return this.subarray[0]; }, set: function(v) { this.subarray[0] = v; } });
+Object.defineProperty(THREE.Vector2Proxy.prototype, 'y', { get: function() { return this.subarray[1]; }, set: function(v) { this.subarray[1] = v; } });
+
+
+THREE.Vector3Proxy = function(subarray) {
+
+        this.subarray = subarray;
+
+}
+THREE.Vector3Proxy.prototype = Object.create( THREE.Vector3.prototype );
+
+Object.defineProperty(THREE.Vector3Proxy.prototype, 'x', { get: function() { return this.subarray[0]; }, set: function(v) { this.subarray[0] = v; } });
+Object.defineProperty(THREE.Vector3Proxy.prototype, 'y', { get: function() { return this.subarray[1]; }, set: function(v) { this.subarray[1] = v; } });
+Object.defineProperty(THREE.Vector3Proxy.prototype, 'z', { get: function() { return this.subarray[2]; }, set: function(v) { this.subarray[2] = v; } });

+ 75 - 0
examples/js/wip/Geometry5.js

@@ -0,0 +1,75 @@
+/**
+ * @author mrdoob / http://mrdoob.com/
+ */
+
+THREE.Geometry5 = function ( size ) {
+
+	THREE.BufferGeometry.call( this );
+
+	var verticesBuffer = new Float32Array( size * 3 );
+	var normalsBuffer = new Float32Array( size * 3 );
+	var uvsBuffer = new Float32Array( size * 2 );
+
+	this.vertices = [];
+	this.normals = [];
+	this.uvs = [];
+
+	for ( var i = 0; i < size; i ++ ) {
+
+		this.vertices.push( new THREE.TypedVector3( verticesBuffer, i * 3 ) );
+		this.normals.push( new THREE.TypedVector3( normalsBuffer, i * 3 ) );
+		this.uvs.push( new THREE.TypedVector2( uvsBuffer, i * 2 ) );
+
+	}
+
+	this.attributes[ 'position' ] = { array: verticesBuffer, itemSize: 3 };
+	this.attributes[ 'normal' ] = { array: normalsBuffer, itemSize: 3 };
+	this.attributes[ 'uv' ] = { array: uvsBuffer, itemSize: 2 };
+
+};
+
+THREE.Geometry5.prototype = Object.create( THREE.BufferGeometry.prototype );
+
+THREE.TypedVector2 = function ( array, offset ) {
+
+	this.array = array;
+	this.offset = offset;
+	
+};
+
+THREE.TypedVector2.prototype = Object.create( THREE.Vector2.prototype );
+
+Object.defineProperties( THREE.TypedVector2.prototype, {
+	'x': {
+		get: function () { return this.array[ this.offset ]; },
+		set: function ( v ) { this.array[ this.offset ] = v; }
+	},
+	'y': {
+		get: function () { return this.array[ this.offset + 1 ]; },
+		set: function ( v ) { this.array[ this.offset + 1 ] = v; }
+	}
+} );
+
+THREE.TypedVector3 = function ( array, offset ) {
+	
+	this.array = array;
+	this.offset = offset;
+
+};
+
+THREE.TypedVector3.prototype = Object.create( THREE.Vector3.prototype );
+
+Object.defineProperties( THREE.TypedVector3.prototype, {
+	'x': {
+		get: function () { return this.array[ this.offset ]; },
+		set: function ( v ) { this.array[ this.offset ] = v; }
+	},
+	'y': {
+		get: function () { return this.array[ this.offset + 1 ]; },
+		set: function ( v ) { this.array[ this.offset + 1 ] = v; }
+	},
+	'z': {
+		get: function () { return this.array[ this.offset + 2 ]; },
+		set: function ( v ) { this.array[ this.offset + 2 ] = v; }
+	}
+} );

+ 77 - 0
examples/js/wip/IndexedGeometry5.js

@@ -0,0 +1,77 @@
+/**
+ * @author mrdoob / http://mrdoob.com/
+ */
+
+THREE.IndexedGeometry5 = function ( indices, size ) {
+
+	THREE.BufferGeometry.call( this );
+
+	var verticesBuffer = new Float32Array( size * 3 );
+	var normalsBuffer = new Float32Array( size * 3 );
+	var uvsBuffer = new Float32Array( size * 2 );
+
+	this.indices = new Uint16Array( indices );
+	this.vertices = [];
+	this.normals = [];
+	this.uvs = [];
+
+	for ( var i = 0; i < size; i ++ ) {
+
+		this.vertices.push( new THREE.TypedVector3( verticesBuffer, i * 3 ) );
+		this.normals.push( new THREE.TypedVector3( normalsBuffer, i * 3 ) );
+		this.uvs.push( new THREE.TypedVector2( uvsBuffer, i * 2 ) );
+
+	}
+
+	this.attributes[ 'index' ] = { array: this.indices, itemSize: 1 };
+	this.attributes[ 'position' ] = { array: verticesBuffer, itemSize: 3 };
+	this.attributes[ 'normal' ] = { array: normalsBuffer, itemSize: 3 };
+	this.attributes[ 'uv' ] = { array: uvsBuffer, itemSize: 2 };
+
+};
+
+THREE.IndexedGeometry5.prototype = Object.create( THREE.BufferGeometry.prototype );
+
+THREE.TypedVector2 = function ( array, offset ) {
+
+	this.array = array;
+	this.offset = offset;
+	
+};
+
+THREE.TypedVector2.prototype = Object.create( THREE.Vector2.prototype );
+
+Object.defineProperties( THREE.TypedVector2.prototype, {
+	'x': {
+		get: function () { return this.array[ this.offset ]; },
+		set: function ( v ) { this.array[ this.offset ] = v; }
+	},
+	'y': {
+		get: function () { return this.array[ this.offset + 1 ]; },
+		set: function ( v ) { this.array[ this.offset + 1 ] = v; }
+	}
+} );
+
+THREE.TypedVector3 = function ( array, offset ) {
+	
+	this.array = array;
+	this.offset = offset;
+
+};
+
+THREE.TypedVector3.prototype = Object.create( THREE.Vector3.prototype );
+
+Object.defineProperties( THREE.TypedVector3.prototype, {
+	'x': {
+		get: function () { return this.array[ this.offset ]; },
+		set: function ( v ) { this.array[ this.offset ] = v; }
+	},
+	'y': {
+		get: function () { return this.array[ this.offset + 1 ]; },
+		set: function ( v ) { this.array[ this.offset + 1 ] = v; }
+	},
+	'z': {
+		get: function () { return this.array[ this.offset + 2 ]; },
+		set: function ( v ) { this.array[ this.offset + 2 ] = v; }
+	}
+} );

+ 82 - 0
examples/js/wip/IndexedPlaneGeometry5.js

@@ -0,0 +1,82 @@
+/**
+ * @author mrdoob / http://mrdoob.com/
+ * based on http://papervision3d.googlecode.com/svn/trunk/as3/trunk/src/org/papervision3d/objects/primitives/Plane.as
+ */
+
+THREE.IndexedPlaneGeometry5 = function ( width, height, widthSegments, heightSegments ) {
+
+	this.width = width;
+	this.height = height;
+
+	this.widthSegments = widthSegments || 1;
+	this.heightSegments = heightSegments || 1;
+
+	var width_half = width / 2;
+	var height_half = height / 2;
+
+	var gridX = this.widthSegments;
+	var gridY = this.heightSegments;
+
+	var gridX1 = gridX + 1;
+	var gridY1 = gridY + 1;
+
+	var segment_width = this.width / gridX;
+	var segment_height = this.height / gridY;
+
+	var indices = gridX * gridY * 6;
+	var vertices = gridX1 * gridY1;
+
+	THREE.IndexedGeometry5.call( this, indices, vertices );
+
+	var offset = 0;
+
+	for ( var iy = 0; iy < gridY1; iy ++ ) {
+
+		var y = iy * segment_height - height_half;
+
+		for ( var ix = 0; ix < gridX1; ix ++ ) {
+
+			var x = ix * segment_width - width_half;
+
+			this.vertices[ offset ].x = x;
+			this.vertices[ offset ].y = - y;
+
+			this.normals[ offset ].z = 1;
+
+			this.uvs[ offset ].x = ix / gridX;
+			this.uvs[ offset ].y = iy / gridY;
+
+			offset ++;
+
+		}
+
+	}
+
+	var offset = 0;
+
+	for ( var iy = 0; iy < gridY; iy ++ ) {
+
+		for ( var ix = 0; ix < gridX; ix ++ ) {
+
+			var a = ix + gridX1 * iy;
+			var b = ix + gridX1 * ( iy + 1 );
+			var c = ( ix + 1 ) + gridX1 * ( iy + 1 );
+			var d = ( ix + 1 ) + gridX1 * iy;
+
+			this.indices[ offset     ] = a;
+			this.indices[ offset + 1 ] = b;
+			this.indices[ offset + 2 ] = d;
+
+			this.indices[ offset + 3 ] = b;
+			this.indices[ offset + 4 ] = c;
+			this.indices[ offset + 5 ] = d;
+
+			offset += 6;
+
+		}
+
+	}
+
+};
+
+THREE.IndexedPlaneGeometry5.prototype = Object.create( THREE.IndexedGeometry5.prototype );

+ 65 - 0
examples/js/wip/PlaneGeometry5.js

@@ -0,0 +1,65 @@
+/**
+ * @author mrdoob / http://mrdoob.com/
+ * based on http://papervision3d.googlecode.com/svn/trunk/as3/trunk/src/org/papervision3d/objects/primitives/Plane.as
+ */
+
+THREE.PlaneGeometry5 = function ( width, height, widthSegments, heightSegments ) {
+
+	THREE.Geometry5.call( this, ( widthSegments * heightSegments ) * 2 * 3 );
+
+	var vertices = this.vertices;
+	var normals = this.normals;
+	var uvs = this.uvs;
+
+	this.width = width;
+	this.height = height;
+
+	this.widthSegments = widthSegments || 1;
+	this.heightSegments = heightSegments || 1;
+
+	var widthHalf = width / 2;
+	var heightHalf = height / 2;
+
+	var gridX = this.widthSegments;
+	var gridY = this.heightSegments;
+
+	var segmentWidth = this.width / gridX;
+	var segmentHeight = this.height / gridY;
+
+	var offset = 0;
+
+	for ( var iy = 0; iy < gridY; iy ++ ) {
+
+		var y1 = iy * segmentHeight - heightHalf;
+		var y2 = ( iy + 1 ) * segmentHeight - heightHalf;
+
+		for ( var ix = 0; ix < gridX; ix ++ ) {
+
+			var x1 = ix * segmentWidth - widthHalf;
+			var x2 = ( ix + 1 ) * segmentWidth - widthHalf;
+
+			vertices[ offset + 0 ].set( x1, y1, 0 );
+			vertices[ offset + 1 ].set( x2, y1, 0 );
+			vertices[ offset + 2 ].set( x1, y2, 0 );
+
+			normals[ offset + 0 ].z = 1;
+			normals[ offset + 1 ].z = 1;
+			normals[ offset + 2 ].z = 1;
+
+			vertices[ offset + 3 ].set( x2, y1, 0 );
+			vertices[ offset + 4 ].set( x2, y2, 0 );
+			vertices[ offset + 5 ].set( x1, y2, 0 );
+
+			normals[ offset + 3 ].z = 1;
+			normals[ offset + 4 ].z = 1;
+			normals[ offset + 5 ].z = 1;
+
+			offset += 6;
+
+		}
+
+	}
+
+};
+
+THREE.PlaneGeometry5.prototype = Object.create( THREE.Geometry5.prototype );

+ 15 - 5
examples/misc_geometry2_sandbox.html

@@ -17,6 +17,8 @@
 
 		<script src="../build/three.min.js"></script>
 
+		<script src="js/wip/PlaneGeometryB.js"></script>
+
 		<script src="js/wip/Geometry2.js"></script>
 		<script src="js/wip/BoxGeometry2.js"></script>
 		<script src="js/wip/PlaneGeometry2.js"></script>
@@ -25,7 +27,11 @@
 		<script src="js/wip/Geometry3.js"></script>
 		<script src="js/wip/PlaneGeometry3.js"></script>
 
-		<script src="js/wip/PlaneGeometryB.js"></script>
+		<script src="js/wip/Geometry5.js"></script>
+		<script src="js/wip/PlaneGeometry5.js"></script>
+
+		<script src="js/wip/IndexedGeometry5.js"></script>
+		<script src="js/wip/IndexedPlaneGeometry5.js"></script>
 
 		<script src="js/libs/stats.min.js"></script>
 
@@ -57,10 +63,11 @@
 
 				//
 
-				addGeometries( 'PlaneGeometryB', 'BoxGeometry', 0 );
+				// addGeometries( 'PlaneGeometry', 'BoxGeometry', 0 );
+				// addGeometries( 'IndexedPlaneGeometry5', 'BoxGeometry', 0 );
 				// addGeometries( 'PlaneGeometry2', 'BoxGeometry2', 0 );
 				// addGeometries( 'PlaneGeometry3', 'BoxGeometry2', 0 );
-				// addGeometries( 'PlaneGeometryB', 'BoxGeometry2', 0 );
+				addGeometries( 'PlaneGeometryB', 'BoxGeometry2', 0 );
 
 				//
 
@@ -79,6 +86,7 @@
 
 				window.addEventListener( 'resize', onWindowResize, false );
 
+				/*
 				setInterval( function () {
 
 					console.log( '---' );
@@ -86,9 +94,11 @@
 					createGeometry( 'PlaneGeometry' );
 					createGeometry( 'PlaneGeometry2' );
 					createGeometry( 'PlaneGeometry2b' );
+					createGeometry( 'PlaneGeometry5' );
 					createGeometry( 'PlaneGeometryB' );
 
 				}, 2000 );
+*/
 
 			}
 
@@ -107,12 +117,12 @@
 				// Plane
 
 				console.time( PlaneGeometry );
-				var geometry = new THREE[ PlaneGeometry ]( 200, 200, 100, 100 );
+				var geometry = new THREE[ PlaneGeometry ]( 200, 200, 200, 200 );
 				console.timeEnd( PlaneGeometry );
 
 				geometry.applyMatrix( new THREE.Matrix4().makeRotationX( - Math.PI / 2 ) );
 
-				var material = new THREE.MeshPhongMaterial( { color: 0xffffff /*, wireframe: true*/ } );
+				var material = new THREE.MeshPhongMaterial( { color: 0xff0000/*, wireframe: true*/ } );
 
 				plane = new THREE.Mesh( geometry, material );
 				plane.position.x = x;