three.js 源碼注釋（七十六）extras/geometries/SphereGeometry.js

標籤：資料視覺效果   three.js   三維   webgl   web3d   

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

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

轉載請保留此句：商域無疆 -  本部落格專註於 敏捷開發及移動和物聯裝置研究：資料視覺效果、GOLANG、Html5、WEBGL、THREE.JS，否則，出自本部落格的文章拒絕轉載或再轉載，謝謝合作。

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

以下代碼是THREE.JS 源碼檔案中extras/geometries/SphereGeometry.js檔案的注釋.

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

/** * @author mrdoob / http://mrdoob.com/ *//*///SphereGeometry用來在三維空間內建立一個球體對象.//////用法: var geometry = new THREE.SphereGeometry(5,32,32);///   var material = new THREE.MeshBasicMaterial({color: 0x00ff00});///   var sphere = new THREE.Mesh(geometry,material);///   scene.add(sphere);*////<summary>SphereGeometry</summary>///<param name ="radius" type="float">球體體半徑</param>///<param name ="widthSegments" type="int">球體寬度細分線段數,應該是經線吧</param>///<param name ="heightSegments" type="int">球體高度細分線段數,應該是緯線吧</param>///<param name ="phiStart" type="float">球體赤道線的起始點弧度</param>///<param name ="phiLength" type="float">球體赤道線的弧長</param>///<param name ="thetaStart" type="float">球體經線起始點弧度</param>///<param name ="thetaLength" type="float">球體經線弧長</param>THREE.SphereGeometry = function ( radius, widthSegments, heightSegments, phiStart, phiLength, thetaStart, thetaLength ) {THREE.Geometry.call( this );this.parameters = {radius: radius,//球體體半徑widthSegments: widthSegments,//球體寬度細分線段數,應該是經線吧heightSegments: heightSegments,//球體高度細分線段數,應該是緯線吧phiStart: phiStart,//球體赤道線的起始點弧度phiLength: phiLength,//球體赤道線的弧長thetaStart: thetaStart, //球體經線起始點弧度thetaLength: thetaLength //球體經線弧長};radius = radius || 50;//球體體半徑,預設初始化為50.widthSegments = Math.max( 3, Math.floor( widthSegments ) || 8 );//球體寬度細分線段數,應該是經線吧,預設初始化為8heightSegments = Math.max( 2, Math.floor( heightSegments ) || 6 );//球體高度細分線段數,應該是緯線吧,預設初始化為6phiStart = phiStart !== undefined ? phiStart : 0;  //球體赤道線的起始點弧度,預設初始化為0phiLength = phiLength !== undefined ? phiLength : Math.PI * 2;//球體赤道線的弧長,預設初始化為2倍的PI,360度thetaStart = thetaStart !== undefined ? thetaStart : 0; //球體經線起始點弧度,預設初始化為0thetaLength = thetaLength !== undefined ? thetaLength : Math.PI; //球體經線弧長,預設初始化為PI,180度.var x, y, vertices = [], uvs = [];//計算頂點資料,壓入vertices數組.for ( y = 0; y <= heightSegments; y ++ ) {var verticesRow = [];var uvsRow = [];for ( x = 0; x <= widthSegments; x ++ ) {var u = x / widthSegments;var v = y / heightSegments;var vertex = new THREE.Vector3();vertex.x = - radius * Math.cos( phiStart + u * phiLength ) * Math.sin( thetaStart + v * thetaLength );vertex.y = radius * Math.cos( thetaStart + v * thetaLength );vertex.z = radius * Math.sin( phiStart + u * phiLength ) * Math.sin( thetaStart + v * thetaLength );this.vertices.push( vertex );verticesRow.push( this.vertices.length - 1 );uvsRow.push( new THREE.Vector2( u, 1 - v ) );}vertices.push( verticesRow );uvs.push( uvsRow );}//計算三角面,以及貼圖uv.for ( y = 0; y < heightSegments; y ++ ) {for ( x = 0; x < widthSegments; x ++ ) {var v1 = vertices[ y ][ x + 1 ];var v2 = vertices[ y ][ x ];var v3 = vertices[ y + 1 ][ x ];var v4 = vertices[ y + 1 ][ x + 1 ];var n1 = this.vertices[ v1 ].clone().normalize();var n2 = this.vertices[ v2 ].clone().normalize();var n3 = this.vertices[ v3 ].clone().normalize();var n4 = this.vertices[ v4 ].clone().normalize();var uv1 = uvs[ y ][ x + 1 ].clone();var uv2 = uvs[ y ][ x ].clone();var uv3 = uvs[ y + 1 ][ x ].clone();var uv4 = uvs[ y + 1 ][ x + 1 ].clone();if ( Math.abs( this.vertices[ v1 ].y ) === radius ) {uv1.x = ( uv1.x + uv2.x ) / 2;this.faces.push( new THREE.Face3( v1, v3, v4, [ n1, n3, n4 ] ) );this.faceVertexUvs[ 0 ].push( [ uv1, uv3, uv4 ] );} else if ( Math.abs( this.vertices[ v3 ].y ) === radius ) {uv3.x = ( uv3.x + uv4.x ) / 2;this.faces.push( new THREE.Face3( v1, v2, v3, [ n1, n2, n3 ] ) );this.faceVertexUvs[ 0 ].push( [ uv1, uv2, uv3 ] );} else {this.faces.push( new THREE.Face3( v1, v2, v4, [ n1, n2, n4 ] ) );this.faceVertexUvs[ 0 ].push( [ uv1, uv2, uv4 ] );this.faces.push( new THREE.Face3( v2, v3, v4, [ n2.clone(), n3, n4.clone() ] ) );this.faceVertexUvs[ 0 ].push( [ uv2.clone(), uv3, uv4.clone() ] );}}}this.computeFaceNormals();//計算面的法線.this.boundingSphere = new THREE.Sphere( new THREE.Vector3(), radius );//計算球體邊界.};/*****************************************************下面是SphereGeometry對象的方法屬性定義,繼承自Geometry對象.**************************************************/THREE.SphereGeometry.prototype = Object.create( THREE.Geometry.prototype );

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

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

轉載請保留此句：商域無疆 -  本部落格專註於 敏捷開發及移動和物聯裝置研究：資料視覺效果、GOLANG、Html5、WEBGL、THREE.JS，否則，出自本部落格的文章拒絕轉載或再轉載，謝謝合作。

以下代碼是THREE.JS 源碼檔案中extras/geometries/SphereGeometry.js檔案的注釋.

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

three.js 源碼注釋（七十六）extras/geometries/SphereGeometry.js