# Three. js source code annotation (11) Math/Box2.js, three. jsbox2.js

Source: Internet
Author: User

Three. js source code annotation (11) Math/Box2.js, three. jsbox2.js

Wuji (http://blog.csdn.net/omni360)

This article follows the "signature-non-commercial use-consistency" creation public agreement

Reprinted please keep this sentence: Wuji-this blog focuses on Agile development and mobile and IOT device research: data visualization, GOLANG, Html5, WEBGL, THREE. JS. Otherwise, the post from this blog will not be reprinted or reprinted. Thank you for your cooperation.

I also just started learning. Sorry for the errors in many places.

The following code is a comment on the Math/Box2.js file in the THREE. JS source code file.

More updates in: https://github.com/omni360/three.js.sourcecode/blob/master/Three.js

`// File: src/math/Box2.js/*** @ author bhouston/http://exocortex.com * // Box2 object constructor. it is used to create a two-dimensional rectangular boundary object in a two-dimensional space. the function functions of the Box2 object are implemented using the function prototype object constructed. /// NOTE: If min is not specified, max initializes the boundary of the Two-dimensional rectangle to Infinity, Infinity // usage: var min = new Vector2 ), max = new Vector2 (); var box = new Box2 (min, max); // create a two-dimensional rectangle boundary object by using two Vector2 (two-dimensional vector) min. * //// <summary> Box2 </summary> /// <param name = "min" type = "Vector2"> Minimum coordinate value of the boundary </param> /// <Param name = "max" type = "Vector2"> maximum coordinate value of the boundary </param> THREE. Box2 = function (min, max) {this. min = (min! = Undefined )? Min: new THREE. Vector2 (Infinity, Infinity); // Infinity is positive Infinity this. max = (max! = Undefined )? Max: new THREE. vector2 (-Infinity,-Infinity); //-Infinity negative Infinity }; /*************************************** * ***** the following are the functions provided by the Box2 object. **************************************** /THREE. box2.prototype = {constructor: THREE. box2, // constructor, returns a reference to the Box2 function that creates this object/* // set method used to set the starting point, ending point, min, and, max coordinate value. returns the two-dimensional rectangular boundary of the new coordinate value. * //// <summary> set </summary> /// <param name = "min" type = "Vector2"> Minimum coordinate value of the boundary </param> // /<param name = "ma X "type =" Vector2 "> maximum coordinate value of the boundary </param> // <returns type =" Box2 "> returns the two-dimensional rectangular boundary of the new coordinate value </returns> set: function (min, max) {this. min. copy (min); this. max. copy (max); return this; // returns the two-dimensional rectangular boundary of the new coordinate value }, /* // setFromPoints method: reset the minimum, maximum, min, and max coordinate values of the two-dimensional rectangle boundary through the points array consisting of Vector2 objects. returns the two-dimensional rectangular boundary of the new coordinate value. * //// <summary> setFromPoints </summary> // A points array composed of <param name = "points" type = "Vector2Array"> Vector2 objects </param>/ // <returns type = "Box2 "> Returns the two-dimensional rectangular boundary of the new coordinate value </returns> setFromPoints: function (points) {this. makeEmpty (); // call. the makeEmpty () method initializes the x and y coordinates of the Two-dimensional rectangle boundary min and max To Infinity and Infinity for (var I = 0, il = points. length; I <il; I ++) {this. expandByPoint (points [I]) // call. expandByPoint () method, obtain the minimum and maximum coordinates in the points array, and then extend the boundary .} return this; // return the two-dimensional rectangular boundary of the new coordinate value},/* // setFromCenterAndSize method reset the minimum, maximum, and min values of the two-dimensional rectangular boundary by using the center point and boundary size, max coordinate value. returns the two-dimensional rectangular boundary of the new coordinate value. * //// <summary> set FromCenterAndSize </summary> // <param name = "center" type = "Vector2"> Vector2 object, center Coordinate </param> /// <param name = "size" type = "Number"> boundary size </param> /// <returns type = "Box2"> return </returns> setFromCenterAndSize: function () {var v1 = new THREE. vector2 (); return function (center, size) {var halfSize = v1.copy (size ). multi plyscalar (0.5); this. min. copy (center ). sub (halfSize); this. max. copy (center). Add (halfSize); return this; // returns the two-dimensional rectangular boundary of the new coordinate value};} (), // The copy method is used to copy the minimum and maximum values of the two-dimensional rectangular boundary, min, max coordinate value. returns the two-dimensional rectangular boundary of the new coordinate value. * //// <summary> copy </summary> /// <param name = "box" type = "Box2"> two-dimensional rectangular boundary </param> // <returns type = "Box2"> returns the two-dimensional rectangular boundary of the new coordinate value </returns> copy: function (box) {this. min. copy (box. min); this. max. copy (box. max); return this; // returns the two-dimensional rectangle boundary of the new coordinate value}. The/* // makeEmpty method initializes the two-dimensional rectangle boundary to Infinity, infinity * // <summary> makeEmpty </s Ummary> // <returns type = "Box2"> returns the two-dimensional rectangular boundary of the new coordinate value </returns> makeEmpty: function () {this. min. x = this. min. y = Infinity; // initialize the boundary of a two-dimensional rectangle to Infinity or Infinity. max. x = this. max. y =-Infinity; // initialize the two-dimensional rectangle boundary to Infinity, Infinity return this; // return the two-dimensional rectangle boundary of the new coordinate value }, /* // The empty method is used to determine whether x and y of the maximum value of the two-dimensional rectangle boundary are smaller than x and y of the minimum value. /// NOTE: If this box contains zero points, return true at its boundary. /// NOTE: A box has the maximum and minimum boundary. the maximum and minimum boundary are represented by one vertex, which is shared by two boundary. /// TODO: The empty method is not clear. when to use. * //// <summary> empty </summary> /// <returns type = "Boolean"> returns true or 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 );}, /* // The center method is used to return the midpoint of the Two-dimensional rectangular boundary * // <summary> makeEmpty </summary> /// <param name = "optionalTarget" type =" vector2 "> optional parameters, receive the returned result. The midpoint of the boundary </param> // <returns type = "Vector2"> returns the midpoint of the Two-dimensional rectangle boundary </returns> center: function (optionalTarget) {var result = optionalTarget | new THREE. vector2 (); return result. addVectors (this. min, this. max ). multiplyScalar (0.5); // returns the midpoint of the Two-dimensional rectangular boundary }, /* // The center method is used to return the vector of the Two-dimensional rectangle boundary size * // <summary> makeEmpty </summary> /// <param name = "optionalTarget" type = "Vector2"> optional parameters, receive the returned result. The vector of the boundary size </param> // <returns type = "Vector2"> returns the vector of the Two-dimensional rectangle boundary size </returns> size: function (optionalTarget) {var result = optionalTarget | new THREE. vector2 (); return result. subVectors (this. max, this. min); // returns the vector of the Two-dimensional rectangle boundary size},/* // The expandByPoint method extends the minimum value, maximum value, min, of the two-dimensional rectangle boundary through the Vector2 object (point parameter, max coordinate value. returns the two-dimensional rectangular boundary of the new coordinate value. /// NOTE: Both the expandByPoint method and the expandByVector method pass a Vector2 object. The expandByPoint method compares the maximum and minimum values of the x and y coordinates of the current boundary to obtain the new boundary, however, the expandByVector method adds the maximum value of the two-dimensional rectangle boundary to the parameter vector, and the minimum value minus the parameter vector, * //// <summary> expandByPoint </summary> /// <param name = "points" type = "Vector2"> Vector2 object </param> /// <returns type = "Box2"> returns the two-dimensional rectangular boundary of the new coordinate value </returns> expandByPoint: function (point) {this. min. min (point); this. max. max (point); return this; // returns the two-dimensional rectangle boundary of the new coordinate value}. // The expandByVector method extends the minimum value of the two-dimensional rectangle boundary through the Vector2 object (vector parameter, maximum value, min, and max coordinate value. returns the two-dimensional rectangular boundary of the new coordinate value. /// NOTE: Both the expandByVector method and the expandByPoint method pass a Vector2 object. The expandByPoint method compares the maximum and minimum values of the x and y coordinates of the current boundary to obtain the new boundary, however, the expandByVector method adds the maximum value of the two-dimensional rectangle boundary with the parameter vector, and the minimum value minus the parameter vector. // NOTE: The expandByVector method differs from the expandByScalar method in that expandByVector () receives a vector, the expandByScalar () method receives a scalar. * //// <summary> expandByVector </summary> /// <param name = "vector" type = "Vector2"> Vector2 object </param> /// <returns type = "Box2"> returns the two-dimensional rectangular boundary of the new coordinate value </returns> expandByVector: function (vector) {this. min. sub (vector); this. max. add (vector); return this; // returns the two-dimensional rectangular boundary of the new coordinate value}. // The expandByVector method extends the minimum value of the two-dimensional rectangular boundary through the Vector2 object (vector parameter, maximum value, min, and max coordinate value. returns the two-dimensional rectangular boundary of the new coordinate value. /// NOTE: The expandByVector method is different from the expandByScalar method. expandByVector () receives a vector, and expandByScalar () method receives a scalar. * //// <summary> expandByVector </summary> /// <param name = "scalar" type = "Number"> value object </param> /// <returns type = "Box2"> returns the two-dimensional rectangular boundary of the new coordinate value </returns> expandByScalar: function (scalar) {this. min. addScalar (-scalar); this. max. addScalar (scalar); return this; // returns the two-dimensional rectangular boundary of the new coordinate value}, // The containsPoint method is used to obtain the parameter point (the two-dimensional coordinate of A Vector2) whether it is within the boundary of the current two-dimensional rectangle. * //// <summary> containsPoint </summary> // <param name = "point" type = "Vector2"> two-dimensional coordinate of Vector2 </param>/ // <returns type = "Boolean"> return true or 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; // returns false if it is not within the boundary} return true; // returns true if it is within the boundary }, // * // The containsBox method is used to obtain whether the parameter box (A Box2 two-dimensional rectangle boundary) is within the current two-dimensional rectangle boundary. * //// <summary> containsBox </summary> /// <param name = "box" type = "Box2"> Box2 two-dimensional rectangle </param>/ // <returns type = "Boolean"> return true or 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; // return true} return false within the boundary; // return false if not within the boundary }, // * // The getParameter method is used to obtain the aspect ratio of the parameter point (the two-dimensional coordinate of A Vector2) at the current two-dimensional rectangle boundary. /// example: var point = new Vector2 (); // var min = new Vector2 (), max = new Vector2 ); /// var box = new Box2 (min, max); // a 4x4 boundary // var ot = new Vector2 (); // box. getParameter (point, ot); // ot = 3/4, 1/2 * //// <summary> containsBox </summary> /// <param name = "box" type = "Box2"> Box2 two-dimensional rectangle </param> /// <param name = "optionalTarget" type = "Vector2"> optional parameter, returns a two-dimensional vector containing the aspect ratio. </param> // <returns type = "Vector2"> returns a two-dimensional vector containing the aspect ratio. </returns> getParameter: function (point, optionalTarget) {// This can potentially have a divide by zero if the box // has a size dimension of 0. // NOTE: the divisor 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); // returns a two-dimensional vector that contains the aspect ratio}. The/* // containsBox method is used to obtain the parameter box (A Box2 two-dimensional rectangle boundary) determines whether to interwork with the current two-dimensional rectangle boundary. * //// <summary> containsBox </summary> /// <param name = "box" type = "Box2"> Box2 two-dimensional rectangle </param>/ // <returns type = "Boolean"> return true or 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; // if the result is not intersecting, return false} return true; // if the result is intersecting, return true .}, /* // The clampPoint method is used to restrict the parameter point within the boundary of a two-dimensional rectangle. if the point is less than min, min is returned. If the point is greater than max, max is returned, otherwise, the two-dimensional coordinate of A Vector2 is returned. // <summary> clampPoint </summary> /// <param name = "point" type = "Vector2"> </ param> // <param name = "optionalTarget" type = "Vector2"> optional parameter, receive the returned result and return the cropped boundary point </param> // <returns type = "Vector2"> return the cropped boundary point. </returns> clampPoint: function (point, optionalTarget) {var result = optionalTarget | new THREE. vector2 (); return result. copy (point ). clamp (this. min, this. max); // return the cropped boundary point},/* // The distanceToPoint method is used to obtain the point to the minimum boundary within the boundary, the maximum boundary length (the length of the four sides of the box ). * //// <summary> distanceToPoint </summary> // <param name = "point" type = "Vector2"> two-dimensional coordinate of Vector2 within a boundary </ param> /// <returns type = "Number"> returns a point to the minimum boundary within the boundary, the maximum boundary length (the length of the four sides of the 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 (); // return the minimum to a point in the boundary. The maximum boundary length (the length of the four sides of the box ).};} (), // * // intersect is used to calculate the intersection between the current two-dimensional rectangle boundary and the parameter box by shrinking the current two-dimensional rectangle boundary. * //// <summary> intersect </summary> /// <param name = "box" type = "Box2"> Box2 two-dimensional rectangle </param>/ // <returns type = "Boolean"> returns the intersection of the current two-dimensional rectangle boundary and the parameter box </returns> intersect: function (box) {this. min. max (box. min); this. max. min (box. max); return this; // returns the intersection of the current two-dimensional rectangle boundary and the parameter box}. // The intersect method is used to expand the current two-dimensional rectangle boundary by extending the current two-dimensional rectangle boundary, enclose the parameter box in the boundary of the current two-dimensional rectangle. returns the union of two boundaries * /// <summary> intersect </summary> /// <param name = "box" type = "Box2"> A Box2 two-dimensional rectangle. boundary </param> /// <returns type = "Boolean"> returns the union of the two boundary </returns> union: function (box) {this. min. min (box. min); this. max. max (box. max); return this; // returns the union of the two boundary}. The/* // translate method is used to move the position of the current two-dimensional rectangle boundary through the offset parameter. * //// <summary> translate </summary> // <param name = "offset" type = "Vector2"> offset </param> // <returns type = "Boolean"> returns the two-dimensional rectangular boundary of the new coordinate value </returns> translate: function (offset) {this. min. add (offset); this. max. add (offset); return this; // returns the two-dimensional rectangle boundary of the new coordinate value}, and the/* // equals method is used to obtain the box parameter (A Box2 two-dimensional rectangle boundary) whether it is completely equal to the current two-dimensional rectangle boundary. * //// <summary> equals </summary> /// <param name = "box" type = "Box2"> Box2 two-dimensional rectangular boundary </param>/ // <returns type = "Boolean"> return true or false </returns> equals: function (box) {return box. min. equals (this. min) & box. max. equals (this. max); // return true or false},/* clone method // clone method to clone a two-dimensional rectangular boundary object. * //// <summary> clone </summary> /// <returns type = "Box2"> returns a two-dimensional rectangular boundary object. </returns> clone: function () {return new THREE. box2 (). copy (this); // returns a two-dimensional rectangular boundary object }};`

Wuji (http://blog.csdn.net/omni360)

This article follows the "signature-non-commercial use-consistency" creation public agreement

Reprinted please keep this sentence: Wuji-this blog focuses on Agile development and mobile and IOT device research: data visualization, GOLANG, Html5, WEBGL, THREE. JS. Otherwise, the post from this blog will not be reprinted or reprinted. Thank you for your cooperation.

The following code is a comment on the Math/Box2.js file in the THREE. JS source code file.

More updates in: https://github.com/omni360/three.js.sourcecode/blob/master/Three.js

Related Keywords:

### Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

## A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

• #### Sales Support

1 on 1 presale consultation

• #### After-Sales Support

24/7 Technical Support 6 Free Tickets per Quarter Faster Response

• Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.