three.js 源碼註釋(八十四)extras/geometries/ParametricGeometry.js

商域無疆 (http://blog.csdn.net/omni360/)

本文遵循“署名-非商業用途-保持一致”創作公用協議

轉載請保留此句:商域無疆 -  本博客專注於 敏捷開發及移動和物聯設備研究:數據可視化、GOLANG、Html5、WEBGL、THREE.JS否則,出自本博客的文章拒絕轉載或再轉載,謝謝合作。


俺也是剛開始學,好多地兒肯定不對還請見諒.

以下代碼是THREE.JS 源碼文件中extras/geometries/ParametricGeometry.js文件的註釋.

更多更新在 : https://github.com/omni360/three.js.sourcecode


/**
 * @author zz85 / https://github.com/zz85
 * Parametric Surfaces Geometry
 * based on the brilliant article by @prideout http://prideout.net/blog/?p=44
 *
 * new THREE.ParametricGeometry( parametricFunction, uSegments, ySegements );
 *
 */
/*
///ParametricGeometry用來在三維空間內通過參數func的定義,生成一個幾何體.有了這個對象,各種你想要的集合體,發揮你的數學天賦吧.
///
///	用法: 
/// 	  var func = function(u,v){
///				var point = new THREE.Vector3();
///				point.x = 100 + Math.cos(u);
///				point.y = 100 + Math.sin(v);
///				return point;
///		  };
///		  var geometry = new THREE.ParametricGeometry(func,8,8);	
/// 	  var material = new THREE.MeshBasicMaterial({color: 0x00ff00});
/// 	  var param = new THREE.Mesh(geometry,material);
/// 	  scene.add(param);
*/
///<summary>ParametricGeometry</summary>
///<param name ="func" type="funciton">功能函數,必須接受參數u,v,返回Vector3</param>
///<param name ="slices" type="int">u方向上的細分線段數</param>
///<param name ="stacks" type="int">v方向上的細分線段數</param>
THREE.ParametricGeometry = function ( func, slices, stacks ) {

	THREE.Geometry.call( this );	//調用Geometry對象的call方法,將原本屬於Geometry的方法交給當前對象ParametricGeometry來使用.

	var verts = this.vertices;
	var faces = this.faces;
	var uvs = this.faceVertexUvs[ 0 ];

	var i, il, j, p;
	var u, v;

	var stackCount = stacks + 1;
	var sliceCount = slices + 1;
	//計算頂點數據,壓入vertices數組.
	for ( i = 0; i <= stacks; i ++ ) {

		v = i / stacks;

		for ( j = 0; j <= slices; j ++ ) {

			u = j / slices;

			p = func( u, v );
			verts.push( p );

		}
	}

	var a, b, c, d;
	var uva, uvb, uvc, uvd;
	//計算三角面,以及貼圖uv.
	for ( i = 0; i < stacks; i ++ ) {

		for ( j = 0; j < slices; j ++ ) {

			a = i * sliceCount + j;
			b = i * sliceCount + j + 1;
			c = (i + 1) * sliceCount + j + 1;
			d = (i + 1) * sliceCount + j;

			uva = new THREE.Vector2( j / slices, i / stacks );
			uvb = new THREE.Vector2( ( j + 1 ) / slices, i / stacks );
			uvc = new THREE.Vector2( ( j + 1 ) / slices, ( i + 1 ) / stacks );
			uvd = new THREE.Vector2( j / slices, ( i + 1 ) / stacks );

			faces.push( new THREE.Face3( a, b, d ) );
			uvs.push( [ uva, uvb, uvd ] );

			faces.push( new THREE.Face3( b, c, d ) );
			uvs.push( [ uvb.clone(), uvc, uvd.clone() ] );

		}

	}

	// console.log(this);

	// magic bullet
	// var diff = this.mergeVertices();
	// console.log('removed ', diff, ' vertices by merging');

	this.computeFaceNormals();	//計算面的法線
	this.computeVertexNormals();	//計算頂點法線

};
/*************************************************
****下面是ParametricGeometry對象的方法屬性定義,繼承自Geometry對象.
**************************************************/
THREE.ParametricGeometry.prototype = Object.create( THREE.Geometry.prototype );


商域無疆 (http://blog.csdn.net/omni360/)

本文遵循“署名-非商業用途-保持一致”創作公用協議

轉載請保留此句:商域無疆 -  本博客專注於 敏捷開發及移動和物聯設備研究:數據可視化、GOLANG、Html5、WEBGL、THREE.JS否則,出自本博客的文章拒絕轉載或再轉載,謝謝合作。


以下代碼是THREE.JS 源碼文件中extras/geometries/ParametricGeometry.js文件的註釋.

更多更新在 : https://github.com/omni360/three.js.sourcecode

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章