商域無疆 (http://blog.csdn.net/omni360/)
本文遵循“署名-非商業用途-保持一致”創作公用協議
轉載請保留此句:商域無疆 - 本博客專注於 敏捷開發及移動和物聯設備研究:數據可視化、GOLANG、Html5、WEBGL、THREE.JS,否則,出自本博客的文章拒絕轉載或再轉載,謝謝合作。
俺也是剛開始學,好多地兒肯定不對還請見諒.
以下代碼是THREE.JS 源碼文件中extras/geometries/TorusGeometry.js文件的註釋.
更多更新在 : https://github.com/omni360/three.js.sourcecode
/**
* @author oosmoxiecode
* @author mrdoob / http://mrdoob.com/
* based on http://code.google.com/p/away3d/source/browse/trunk/fp10/Away3DLite/src/away3dlite/primitives/Torus.as?r=2888
*/
/*
///TorusGeometry用來在三維空間內創建一個圓環體對象.
///
/// 用法: var geometry = new THREE.TorusGeometry(3,1,12,18);
/// var material = new THREE.MeshBasicMaterial({color: 0x00ff00});
/// var torus = new THREE.Mesh(geometry,material);
/// scene.add(torus);
*/
///<summary>TorusGeometry</summary>
///<param name ="radius" type="float">圓環體半徑</param>
///<param name ="tube" type="float">圓環彎管半徑</param>
///<param name ="radialSegments" type="int">圓環體圓周上細分線段數</param>
///<param name ="tubularSegments" type="int">圓環彎管圓周上的細分線段數</param>
///<param name ="arc" type="float">圓環體圓周弧長,默認初始化爲Math.PI * 2</param>
THREE.TorusGeometry = function ( radius, tube, radialSegments, tubularSegments, arc ) {
THREE.Geometry.call( this ); //調用Geometry對象的call方法,將原本屬於Geometry的方法交給當前對象TorusGeometry來使用.
this.parameters = {
radius: radius, //圓環體半徑
tube: tube, //圓環彎管半徑
radialSegments: radialSegments, //圓環體圓周上細分線段數
tubularSegments: tubularSegments, //圓環彎管圓周上的細分線段數
arc: arc //圓環體圓周弧長,默認初始化爲Math.PI * 2
};
radius = radius || 100; //圓環體半徑,如果參數未設置,初始化爲100.
tube = tube || 40; //圓環彎管半徑,如果參數未設置,初始化爲40.
radialSegments = radialSegments || 8; //圓環體圓周上細分線段數,如果參數未設置,初始化爲8.
tubularSegments = tubularSegments || 6; //圓環彎管圓周上的細分線段數,如果參數未設置,初始化爲6.
arc = arc || Math.PI * 2; //圓環體圓周弧長,默認初始化爲Math.PI * 2
var center = new THREE.Vector3(), uvs = [], normals = [];
//計算頂點數據,壓入vertices數組.
for ( var j = 0; j <= radialSegments; j ++ ) {
for ( var i = 0; i <= tubularSegments; i ++ ) {
var u = i / tubularSegments * arc;
var v = j / radialSegments * Math.PI * 2;
center.x = radius * Math.cos( u );
center.y = radius * Math.sin( u );
var vertex = new THREE.Vector3();
vertex.x = ( radius + tube * Math.cos( v ) ) * Math.cos( u );
vertex.y = ( radius + tube * Math.cos( v ) ) * Math.sin( u );
vertex.z = tube * Math.sin( v );
this.vertices.push( vertex );
uvs.push( new THREE.Vector2( i / tubularSegments, j / radialSegments ) );
normals.push( vertex.clone().sub( center ).normalize() );
}
}
//計算三角面,以及貼圖uv.
for ( var j = 1; j <= radialSegments; j ++ ) {
for ( var i = 1; i <= tubularSegments; i ++ ) {
var a = ( tubularSegments + 1 ) * j + i - 1;
var b = ( tubularSegments + 1 ) * ( j - 1 ) + i - 1;
var c = ( tubularSegments + 1 ) * ( j - 1 ) + i;
var d = ( tubularSegments + 1 ) * j + i;
var face = new THREE.Face3( a, b, d, [ normals[ a ].clone(), normals[ b ].clone(), normals[ d ].clone() ] );
this.faces.push( face );
this.faceVertexUvs[ 0 ].push( [ uvs[ a ].clone(), uvs[ b ].clone(), uvs[ d ].clone() ] );
face = new THREE.Face3( b, c, d, [ normals[ b ].clone(), normals[ c ].clone(), normals[ d ].clone() ] );
this.faces.push( face );
this.faceVertexUvs[ 0 ].push( [ uvs[ b ].clone(), uvs[ c ].clone(), uvs[ d ].clone() ] );
}
}
this.computeFaceNormals(); //計算面的法線
};
/*************************************************
****下面是TorusGeometry對象的方法屬性定義,繼承自Geometry對象.
**************************************************/
THREE.TorusGeometry.prototype = Object.create( THREE.Geometry.prototype );
商域無疆 (http://blog.csdn.net/omni360/)
本文遵循“署名-非商業用途-保持一致”創作公用協議
轉載請保留此句:商域無疆 - 本博客專注於 敏捷開發及移動和物聯設備研究:數據可視化、GOLANG、Html5、WEBGL、THREE.JS,否則,出自本博客的文章拒絕轉載或再轉載,謝謝合作。
以下代碼是THREE.JS 源碼文件中extras/geometries/TorusGeometry.js文件的註釋.