Three. js Source Code Reading Notes-5

Source: Internet
Author: User

Core: Ray

This class is used to represent the "rays" in space and is mainly used for collision detection.

THREE.Ray =.origin = ( origin !== undefined ) ? origin : .direction = ( direction !== undefined ) ? direction : 

The constructor of the Ray class is quite simple. There are only two parameters, origin and ction, that is, the endpoint and direction.

Ray is mainly used for collision detection.

THREE.Ray.prototype = result = optionalTarget ||  result.copy( .direction ).multiplyScalar( t ).add( .origin.copy(   result = optionalTarget ||  directionDistance = result.dot(  result.copy( .direction ).multiplyScalar( directionDistance ).add(  directionDistance = THREE.Ray.__v1.subVectors( point, .origin ).dot( .direction ).multiplyScalar( directionDistance ).add(  ( .distanceToPoint( sphere.center ) <=         denominator = plane.normal.dot(  ( denominator !=          ( plane.distanceToPoint( .origin ) ==    denominator = plane.normal.dot(  ( denominator ==             ( plane.distanceToPoint( .origin ) ==               t = - ( .origin.dot( plane.normal ) + plane.constant ) / t = ( t === 

The Ray class has the following methods:

  • At (t, optionalTarget): returns the point at which the distance from the ray endpoint is t. If the optionalTarget parameter is input, the object is set to the returned vertex (the same below ).
  • ClosestPointToPoint: function (point, optionalTarget): transmits a vertex and returns the sag of the vertex directed to the ray.
  • DistanceToPoint: function (point): input a vertex and return the distance from the vertex to the ray.
  • DistanceToPlane: function (plane): transmits a plane and returns the distance from the plane to the ray (if the Ray is not parallel to the plane, the distance is 0 ).
  • IsIntersectionSphere: function (sphere): determines whether a Ray has an intersection with a sphere. The passed parameter sphere must have radius and center attributes (for example, it is useless to pass in sphereGeometry ).
  • IsIntersectionPlane: function (plane): determines whether a Ray has an intersection with a plane. The input parameter plane must have a normal attribute.
  • Recast (t): set Three. Ray. _ v1 (this variable) to the caller's at (t) position. (Three. Ray. _ v1 and Three. Ray. _ v2 are temporary variables defined on Three. Ray rather than its peototype, similar to static variables in C ++ ).
Material: MeshBasicMaterial

We have analyzed the Material class and LineBasicMaterial class before. Now let's look at the remaining Material classes. MeshBasicMaterial is a "Light Independent" material, that is, the material can still be displayed without light.

THREE.MeshBasicMaterial =.color =  THREE.Color(  );     .map = .lightMap = .specularMap = .envMap = .combine =.reflectivity = .refractionRatio = .fog = .shading =.wireframe = .wireframeLinewidth = .wireframeLinecap = .wireframeLinejoin = .vertexColors =.skinning = .morphTargets = 

MeshBasicMaterial includes the following attributes:

  • Color: color, a hexadecimal integer. If the color attribute is set, the entire material uses this color.
  • Map: ing, which can point to the Instance Object of Three. Texture. In fact, texture is a ing from a two-dimensional coordinate in the range of [0, 1] [0, 1] to a color value. The process is to take the color from the response position of the texture image. Of course, there are also textures that do not depend on images. For example, some simple combinations of trigonometric functions can convert coordinates into colors and become textures. This texture allows you to draw complex patterns on the surface.
  • LightMap, envMap, and specularMap: Light ing, spectral ing, and so on, which may be used to serve certain types of coloring devices in Three.
  • Wireframe: if it is set to true, the entire geometric shape is displayed as a grid (that is, only the edge is displayed, not the surface ).
  • WireframeLinecap, wireframeLinewidth, and wireframeLinejoin: controls the line segment endpoint, line segment width, and line segment intersection of the grid in wireframe mode.
  • Fog: shows whether the color of the material is affected by the global fog settings.
  • VertexColors: array. Each element is a Three. Color variable. If this variable is set, the first three or four elements (depending on the surface type) of the array are the color of the surface endpoint. The color of the face is interpolated by the color of the endpoint in the default Cell Coloring tool.
  • MorphTarget: if it is set to true, you can use the morphTarget mode (a method that uses the coloring tool to calculate the vertex position, which can efficiently generate a method similar to the Windows 98 deformation screensaver mode, in my previous demo source code reading notes, I will describe it in detail ).
  • MeshBasicMaterial has only one clone method (this method calls the clone method of Material). Other methods are inherited from the Material method.
Material: MeshLambertMaterial

MeshLambertMaterial is a Lamber surface material. The long plane is the same-sex reflection plane. The brightness of the reflection is irrelevant to the reflection angle when the light from any angle is shining. The following excerpt removes several attributes that are repeated with MeshBasicMaterial.

THREE.MeshLambertMaterial =.color =  THREE.Color(  );     .ambient =  THREE.Color( .emissive =  THREE.Color( .wrapAround = .wrapRGB =  THREE.Vector3( , , .combine =.reflectivity = .refractionRatio = 

Apart from attributes such as color and vertexColors in MeshBasicMaterial, The MeshLambertMaterial class also has several illumination-related attributes:

  • Color: main color. Of course, if you use ing or assign a color to each endpoint, it will be useless.
  • Ambient: environment color. The default color is white. If it is changed, the color of the material will be affected as a whole.
  • Emissive: Specifies the color of the emitted light. The default color is black, which is a part similar to the MeshBasicMaterial principle. By default, if there is no light and render's clearColor is set to Black (this is the case when light is taken into consideration), an object using MeshLambertMaterial will not be visible, if it is changed to another color, you can see it.
  • Combine: the combination of light and color. The default value is multiplication.
  • Reflectivity: reflectivity. The default value is 1, indicating all reflections.
  • RefractionRatio: Refractive Index (that is, the ratio of attenuation after a unit length of penetration object), which may be used for transparent objects.
Material: MeshPhongMaterial

MeshPhongMaterial, a side-by-side reflector, indicates a shiny object. In extreme cases, it is a mirror.

THREE.MeshPhongMaterial =.color =  THREE.Color(  );     .ambient =  THREE.Color( .emissive =  THREE.Color( .specular =  THREE.Color( .shininess = .metal = .perPixel = 
.bumpMap = .bumpScale = .normalMap = .normalScale = THREE.Vector2( ,

I haven't figured it out yet.

Material: MeshFaceMaterial

A material can be specified separately for each surface of a geometry. It is usually used to read data from a 3D model and construct a mesh.

THREE.MeshFaceMaterial =.materials = materials instanceof Array ?

You only need to input an array as the parameter. Each element of its materials array is a MeshXXXXMaterial, and then specify materialIndex for face when creating a surface in geometry.

Related Article

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.