Three. js source code annotation (12th) extras/geometries/RingGeometry. js, three. jsgeometries

Source: Internet
Author: User

Three. js source code annotation (12th) extras/geometries/RingGeometry. js, three. jsgeometries

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 extras/geometries/RingGeometry. JS file in the THREE. js source code file.

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


/*** @ Author Kaleb Murphy * // RingGeometry is used to create a two-dimensional ring surface object in a three-dimensional space. //// usage: var geometry = new THREE. ringGeometry (1, 5, 32); // var material = new THREE. meshBasicMaterial ({color: 0x00ff00}); // var Ring = new THREE. mesh (geometry, material); // scene. add (Ring); * // <summary> TorusGeometry </summary> // <param name = "innerRadius" type = "float"> inner circle radius of the Ring, the default value is 0 </param> /// <param name = "outerRadius" type = "float "> The radius of the outer circle of the ring surface. The default value is 50 </param> /// <param name =" thetaSegments "type =" int "> Number of segments on the circumference of the ring surface, represents the circle's roundness, the lowest is 3. The default value is 8 </param> /// <param name = "phiSegments" type = "int"> the number of segments from the incircle to the excircle. The lowest value is 1. The default value is 8 </param> /// <param name = "thetaStart" type = "float">, the default value is 0 </param> /// <param name = "thetaLength" type = "float"> the circular arc length of the ring. The default value is Math. PI * 2 </param> THREE. ringGeometry = function (innerRadius, outerRadius, thetaSegments, phiSegments, thetaStart, thetaLength) {THREE. geometry. call (this); // call the call method of the Geometry object and hand over the method originally belonging to the Geometry to the current object RingGeometry for use. innerRadius = innerRadius | 0; // The inner radius of the ring. The default value is Convert to 0 outerRadius = outerRadius | 50; // the radius of the outer circle of the ring surface. The default value is 50 thetaStart = thetaStart! = Undefined? ThetaStart: 0; // The starting angle of the ring. The default value is 0 thetaLength = thetaLength! = Undefined? ThetaLength: Math. PI * 2; // The circumference arc length of the ring surface. The default value is Math. PI * 2 thetaSegments = thetaSegments! = Undefined? Math. max (3, thetaSegments): 8; // number of segments on the circumference of the ring surface, representing the circle's roundness. The lowest value is 3. The default value is 8 phiSegments = phiSegments! = Undefined? Math. max (1, phiSegments): 8; // number of segments from the inner circle of the ring to the external circle. The lowest value is 1. The default value is 8var I, o, uvs = [], radius = innerRadius, radiusStep = (outerRadius-innerRadius)/phiSegments); // calculate vertex data and press it into the vertices array. for (I = 0; I <phiSegments + 1; I ++) {// concentric circles inside ringfor (o = 0; o <thetaSegments + 1; o ++) {// number of segments per circle number var vertex = new THREE. vector3 (); var segment = thetaStart + o/thetaSegments * thetaLength; vertex. x = radius * Math. cos (segment); vertex. y = radius * Math. sin (segment); this. vertices. push (vertex); uvs. push (new THREE. vector2 (vertex. x/outerRadius + 1)/2, (vertex. y/outerRadius + 1)/2);} radius + = radiusStep;} var n = new THREE. vector3 (0, 0, 1); // calculate the triangle surface and texture uv. for (I = 0; I <phiSegments; I ++) {// concentric circles inside ringvar thetaSegment = I * (thetaSegments + 1); for (o = 0; o <thetaSegments; o ++) {// number of segments per the number of segments in the circle var segment = o + thetaSegment; var v1 = segment; var v2 = segment + thetaSegments + 1; var v3 = segment + thetaSegments + 2; this. faces. push (new THREE. face3 (v1, v2, v3, [n. clone (), n. clone (), n. clone ()]); this. faceVertexUvs [0]. push ([uvs [v1]. clone (), uvs [v2]. clone (), uvs [v3]. clone ()]); v1 = segment; v2 = segment + thetaSegments + 2; v3 = segment + 1; this. faces. push (new THREE. face3 (v1, v2, v3, [n. clone (), n. clone (), n. clone ()]); this. faceVertexUvs [0]. push ([uvs [v1]. clone (), uvs [v2]. clone (), uvs [v3]. clone ()]) ;}} this. computeFaceNormals (); // calculate the surface normal this. boundingSphere = new THREE. sphere (new THREE. vector3 (), radius); // calculate the sphere boundary }; /*************************************** * ************ the method attribute definition of the RingGeometry object is as follows, it inherits from the Geometry object. **************************************** * *********/THREE. ringGeometry. prototype = Object. create (THREE. geometry. prototype );


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 extras/geometries/RingGeometry. JS file in the THREE. js source code file.

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

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.