three.js 源碼注釋（十一）Math/Box2.js

標籤：three.js   webgl   javascript   web3d   源碼   

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

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

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

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

以下代碼是THREE.JS 源碼檔案中Math/Box2.js檔案的注釋.

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

// File:src/math/Box2.js/** * @author bhouston / http://exocortex.com *//*///Box2對象的建構函式.用來在二維空間內建立一個二維矩形邊界邊界對象.Box2對象的功能函數採用///定義構造的函數原型對象來實現./// NOTE:如果沒有參數min,max將二維矩形邊界初始化為Infinity,無窮大//////用法: var min = new Vector2(0,0),max = new Vector2(1,1); var box = new Box2(min,max);///通過兩個Vector2(二維向量)min,max建立一個二維矩形邊界對象.*////<summary>Box2</summary>///<param name ="min" type="Vector2">邊界的最小座標值</param>///<param name ="max" type="Vector2">邊界的最大座標值</param>THREE.Box2 = function ( min, max ) {this.min = ( min !== undefined ) ? min : new THREE.Vector2( Infinity, Infinity );//Infinity 正無窮大 this.max = ( max !== undefined ) ? max : new THREE.Vector2( - Infinity, - Infinity );//- Infinity負無窮大};/********************************************下面是Box2對象提供的功能函數.****************************************/THREE.Box2.prototype = {constructor: THREE.Box2,//構造器,返回對建立此對象的Box2函數的引用/*///set方法用來從新設定二維矩形邊界的起始點,結束點,min,max座標值.並返回新的座標值的二維矩形邊界.*////<summary>set</summary>///<param name ="min" type="Vector2">邊界的最小座標值</param>///<param name ="max" type="Vector2">邊界的最大座標值</param>///<returns type="Box2">返回新座標值的二維矩形邊界</returns>set: function ( min, max ) {this.min.copy( min );this.max.copy( max );return this;//返回新座標值的二維矩形邊界},/*///setFromPoints方法通過Vector2對象組成的points數組重新設定二維矩形邊界的最小值,最大值,min,max座標值.並返回新的座標值的二維矩形邊界.*////<summary>setFromPoints</summary>///<param name ="points" type="Vector2Array">Vector2對象組成的points數組</param>///<returns type="Box2">返回新座標值的二維矩形邊界</returns>setFromPoints: function ( points ) {this.makeEmpty();//調用.makeEmpty()方法將二維矩形邊界min,max的x,y座標初始化為Infinity,無窮大for ( var i = 0, il = points.length; i < il; i ++ ) {this.expandByPoint( points[ i ] )//調用.expandByPoint()方法,獲得points數組中的最小,最大座標,然後擴充邊界.}return this;//返回新座標值的二維矩形邊界},/*///setFromCenterAndSize方法通過中心點,邊界尺寸方式重新設定二維矩形邊界的最小值,最大值,min,max座標值.並返回新的座標值的二維矩形邊界.*////<summary>setFromCenterAndSize</summary>///<param name ="center" type="Vector2">Vector2對象,中心點座標</param>///<param name ="size" type="Number">邊界尺寸</param>///<returns type="Box2">返回新座標值的二維矩形邊界</returns>setFromCenterAndSize: function () {var v1 = new THREE.Vector2();return function ( center, size ) {var halfSize = v1.copy( size ).multiplyScalar( 0.5 );this.min.copy( center ).sub( halfSize );this.max.copy( center ).add( halfSize );return this;//返回新座標值的二維矩形邊界};}(),/*///copy方法用來複製二維矩形邊界的最小值,最大值,min,max座標值.並返回新的座標值的二維矩形邊界.*////<summary>copy</summary>///<param name ="box" type="Box2">二維矩形邊界</param>///<returns type="Box2">返回新座標值的二維矩形邊界</returns>copy: function ( box ) {this.min.copy( box.min );this.max.copy( box.max );return this;//返回新座標值的二維矩形邊界},/*///makeEmpty方法用來將二維矩形邊界初始化為Infinity,無窮大*////<summary>makeEmpty</summary>///<returns type="Box2">返回新座標值的二維矩形邊界</returns>makeEmpty: function () {this.min.x = this.min.y = Infinity;//將二維矩形邊界初始化為Infinity,無窮大this.max.x = this.max.y = - Infinity;//將二維矩形邊界初始化為Infinity,無窮大return this;//返回新座標值的二維矩形邊界},/*///empty方法用來判斷二維矩形邊界的最大值的x,y是否小於最小值的x,y./// NOTE:如果此框包括零點在其邊界返回true。/// NOTE:一個box有最大,最小邊界,最大最小邊界分別用一個點表示,這個點被兩個邊界共用./// TODO:empty方法沒有弄明白.什麼時候用.*////<summary>empty</summary>///<returns type="Boolean">返回true 或者 false</returns>empty: function () {// this is a more robust check for empty than ( volume <= 0 ) because volume can get positive with two negative axesreturn ( this.max.x < this.min.x ) || ( this.max.y < this.min.y );},/*///center方法用來返回二維矩形邊界的中點*////<summary>makeEmpty</summary>///<param name ="optionalTarget" type="Vector2">選擇性參數,接收返回結果,邊界的中點</param>///<returns type="Vector2">返回二維矩形邊界的中點</returns>center: function ( optionalTarget ) {var result = optionalTarget || new THREE.Vector2();return result.addVectors( this.min, this.max ).multiplyScalar( 0.5 );//返回二維矩形邊界的中點},/*///center方法用來返回二維矩形邊界尺寸的向量*////<summary>makeEmpty</summary>///<param name ="optionalTarget" type="Vector2">選擇性參數,接收返回結果,邊界尺寸的向量</param>///<returns type="Vector2">返回二維矩形邊界尺寸的向量</returns>size: function ( optionalTarget ) {var result = optionalTarget || new THREE.Vector2();return result.subVectors( this.max, this.min );//返回二維矩形邊界尺寸的向量},/*///expandByPoint方法通過Vector2對象(point參數)擴充二維矩形邊界的最小值,最大值,min,max座標值.並返回新的座標值的二維矩形邊界./// NOTE:expandByPoint方法與expandByVector方法都傳遞一個Vector2對象,expandByPoint方法將當前邊界的最大值,最小值的x,y座標組比,獲得新的邊界,但是expandByVector方法將二維矩形邊界的最大值加上參數vector,最小值減去參數vector,*////<summary>expandByPoint</summary>///<param name ="points" type="Vector2">Vector2對象</param>///<returns type="Box2">返回新座標值的二維矩形邊界</returns>expandByPoint: function ( point ) {this.min.min( point );this.max.max( point );return this;//返回新座標值的二維矩形邊界},/*///expandByVector方法通過Vector2對象(vector參數)擴充二維矩形邊界的最小值,最大值,min,max座標值.並返回新的座標值的二維矩形邊界./// NOTE:expandByVector方法與expandByPoint方法都傳遞一個Vector2對象,expandByPoint方法將當前邊界的最大值,最小值的x,y座標組比,獲得新的邊界,但是expandByVector方法將二維矩形邊界的最大值加上參數vector,最小值減去參數vector,/// NOTE:expandByVector方法與expandByScalar方法不同的是expandByVector()接收一個向量,expandByScalar()方法接收一個標量.*////<summary>expandByVector</summary>///<param name ="vector" type="Vector2">Vector2對象</param>///<returns type="Box2">返回新座標值的二維矩形邊界</returns>expandByVector: function ( vector ) {this.min.sub( vector );this.max.add( vector );return this;//返回新座標值的二維矩形邊界},/*///expandByVector方法通過Vector2對象(vector參數)擴充二維矩形邊界的最小值,最大值,min,max座標值.並返回新的座標值的二維矩形邊界./// NOTE:expandByVector方法與expandByScalar方法不同的是expandByVector()接收一個向量,expandByScalar()方法接收一個標量.*////<summary>expandByVector</summary>///<param name ="scalar" type="Number">數值對象</param>///<returns type="Box2">返回新座標值的二維矩形邊界</returns>expandByScalar: function ( scalar ) {this.min.addScalar( - scalar );this.max.addScalar( scalar );return this;//返回新座標值的二維矩形邊界},/*///containsPoint方法用來獲得參數point(一個Vector2的二維點座標)是否在當前二維矩形邊界內.*////<summary>containsPoint</summary>///<param name ="point" type="Vector2">一個Vector2的二維點座標</param>///<returns type="Boolean">返回true 或者 false</returns>containsPoint: function ( point ) {if ( point.x < this.min.x || point.x > this.max.x ||     point.y < this.min.y || point.y > this.max.y ) {return false;//不在邊界內,返回false}return true;//在邊界內,返回true},/*///containsBox方法用來獲得參數box(一個Box2的二維矩形邊界)是否在當前二維矩形邊界內.*////<summary>containsBox</summary>///<param name ="box" type="Box2">一個Box2的二維矩形邊界</param>///<returns type="Boolean">返回true 或者 false</returns>containsBox: function ( box ) {if ( ( this.min.x <= box.min.x ) && ( box.max.x <= this.max.x ) &&     ( this.min.y <= box.min.y ) && ( box.max.y <= this.max.y ) ) {return true;//在邊界內,返回true}return false;//不在邊界內,返回false},/*///getParameter方法用來獲得參數point(一個Vector2的二維點座標)在當前二維矩形邊界的高寬比.///樣本: var point = new Vector2(3,2);/// var min= new Vector2(1,1),max = new Vector2(5,5);/// var box = new Box2(min,max); //一個4x4的邊界/// var ot = new Vector2();/// box.getParameter(point,ot);/// ot= 3/4,1/2*////<summary>containsBox</summary>///<param name ="box" type="Box2">一個Box2的二維矩形邊界</param>///<param name ="optionalTarget" type="Vector2">選擇性參數,接收返回結果,含高寬比的二維向量</param>///<returns type="Vector2">返回包含高寬比的二維向量.</returns>getParameter: function ( point, optionalTarget ) {// This can potentially have a divide by zero if the box// has a size dimension of 0.// NOTE:這裡可能會出現除數0.var result = optionalTarget || new THREE.Vector2();return result.set(( point.x - this.min.x ) / ( this.max.x - this.min.x ),( point.y - this.min.y ) / ( this.max.y - this.min.y ));//返回包含高寬比的二維向量},/*///containsBox方法用來獲得參數box(一個Box2的二維矩形邊界)是否與當前二維矩形邊界相交.*////<summary>containsBox</summary>///<param name ="box" type="Box2">一個Box2的二維矩形邊界</param>///<returns type="Boolean">返回true 或者 false</returns>isIntersectionBox: function ( box ) {// using 6 splitting planes to rule out intersections.if ( box.max.x < this.min.x || box.min.x > this.max.x ||     box.max.y < this.min.y || box.min.y > this.max.y ) {return false;//如果不相交,返回false}return true;//如果相交,返回true.},/*///clampPoint方法用來限制參數point在二維矩形邊界內.如果point小於min,返回min,如果大於max返回max,否則返回point*////<summary>clampPoint</summary>///<param name ="point" type="Vector2">一個Vector2的二維點座標</param>///<param name ="optionalTarget" type="Vector2">選擇性參數,接收返回結果,返回剪裁過的邊界點</param>///<returns type="Vector2">返回剪裁過的邊界點.</returns>clampPoint: function ( point, optionalTarget ) {var result = optionalTarget || new THREE.Vector2();return result.copy( point ).clamp( this.min, this.max );//返回剪裁過的邊界點},/*///distanceToPoint方法用來獲得邊界內一點到最小邊界,最大邊界的長度(box的四條邊的長度).*////<summary>distanceToPoint</summary>///<param name ="point" type="Vector2">一個邊界內的Vector2的二維點座標</param>///<returns type="Number">返回邊界內一點到最小邊界,最大邊界的長度(box的四條邊的長度).</returns>distanceToPoint: function () {var v1 = new THREE.Vector2();return function ( point ) {var clampedPoint = v1.copy( point ).clamp( this.min, this.max );return clampedPoint.sub( point ).length();//返回邊界內一點到最小邊界,最大邊界的長度(box的四條邊的長度).};}(),/*///intersect方法用來通過收縮當前二維矩形邊界,求當前二維矩形邊界和參數box的交集.*////<summary>intersect</summary>///<param name ="box" type="Box2">一個Box2的二維矩形邊界</param>///<returns type="Boolean">返回當前二維矩形邊界和參數box的交集</returns>intersect: function ( box ) {this.min.max( box.min );this.max.min( box.max );return this;//返回當前二維矩形邊界和參數box的交集},/*///intersect方法用來通過擴充當前二維矩形邊界,將參數box包圍進當前的二維矩形邊界內.就是取兩個邊界的並集*////<summary>intersect</summary>///<param name ="box" type="Box2">一個Box2的二維矩形邊界</param>///<returns type="Boolean">返回兩個邊界的並集</returns>union: function ( box ) {this.min.min( box.min );this.max.max( box.max );return this;//返回兩個邊界的並集},/*///translate方法用來通過參數offset,移動當前二維矩形邊界的位置.*////<summary>translate</summary>///<param name ="offset" type="Vector2">位移量</param>///<returns type="Boolean">返回新座標值的二維矩形邊界</returns>translate: function ( offset ) {this.min.add( offset );this.max.add( offset );return this;//返回新座標值的二維矩形邊界},/*///equals方法用來獲得參數box(一個Box2的二維矩形邊界)是否與當前二維矩形邊界完全相等.*////<summary>equals</summary>///<param name ="box" type="Box2">一個Box2的二維矩形邊界</param>///<returns type="Boolean">返回true 或者 false</returns>equals: function ( box ) {return box.min.equals( this.min ) && box.max.equals( this.max );//返回true 或者 false},/*clone方法///clone方法複製一個二維矩形邊界對象.*////<summary>clone</summary>///<returns type="Box2">返回二維矩形邊界對象</returns>clone: function () {return new THREE.Box2().copy( this );//返回二維矩形邊界對象}};

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

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

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

以下代碼是THREE.JS 源碼檔案中Math/Box2.js檔案的注釋.

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

three.js 源碼注釋（十一）Math/Box2.js