Materials.html 4.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="utf-8" />
  5. <base href="../../" />
  6. <script src="list.js"></script>
  7. <script src="page.js"></script>
  8. <link type="text/css" rel="stylesheet" href="page.css" />
  9. </head>
  10. <body>
  11. <h1>Material Constants</h1>
  12. <div class="desc">
  13. These constants define properties common to all material types,
  14. with the exception of Texture Combine Operations which only apply to [page:MeshBasicMaterial.combine MeshBasicMaterial], [page:MeshLambertMaterial.combine MeshLambertMaterial] and [page:MeshPhongMaterial.combine MeshPhongMaterial].<br />
  15. </div>
  16. <h2>Side</h2>
  17. <code>
  18. THREE.FrontSide
  19. THREE.BackSide
  20. THREE.DoubleSide
  21. </code>
  22. <div>
  23. Defines which side of faces will be rendered - front, back or both.
  24. Default is [page:Constant FrontSide].
  25. </div>
  26. <h2>Shading</h2>
  27. <code>
  28. THREE.SmoothShading
  29. THREE.FlatShading
  30. </code>
  31. <div>
  32. [page:Constant SmoothShading] is the default and linearly interpolates color between vertices.<br />
  33. [page:Constant FlatShading] uses the color of the first vertex for every pixel in a face.
  34. </div>
  35. <h2>Colors</h2>
  36. <code>
  37. THREE.NoColors
  38. THREE.FaceColors
  39. THREE.VertexColors
  40. </code>
  41. <div>
  42. [page:Constant NoColors] is the default and applies the material's color to all faces.<br />
  43. [page:Constant FaceColors] colors faces according to each [page:Face3 Face3][property:Color color] value.<br />
  44. [page:Constant VertexColors] colors faces according to each [page:Face3 Face3][property:Array vertexColors] value. This is an array of three [page:Color Color]s, one for each vertex in the face.<br />
  45. See the [example:webgl_geometry_colors geometry / colors] example.
  46. </div>
  47. <h2>Blending Mode</h2>
  48. <code>
  49. THREE.NoBlending
  50. THREE.NormalBlending
  51. THREE.AdditiveBlending
  52. THREE.SubtractiveBlending
  53. THREE.MultiplyBlending
  54. THREE.CustomBlending
  55. </code>
  56. <div>
  57. These control the source and destination blending equations for the material's RGB and Alpha sent to the WebGLRenderer for use by WebGL.<br />
  58. [page:Constant NormalBlending] is the default.<br />
  59. Note that [page:Constant CustomBlending] must be set to use [page:CustomBlendingEquation Custom Blending Equations].<br />
  60. See the [example:webgl_materials_blending materials / blending] example.<br />
  61. </div>
  62. <h2>Depth Mode</h2>
  63. <code>
  64. THREE.NeverDepth
  65. THREE.AlwaysDepth
  66. THREE.LessDepth
  67. THREE.LessEqualDepth
  68. THREE.GreaterEqualDepth
  69. THREE.GreaterDepth
  70. THREE.NotEqualDepth
  71. </code>
  72. <div>
  73. Which depth function the material uses to compare incoming pixels Z-depth against the current Z-depth buffer value. If the result of the comparison is true, the pixel will be drawn.<br />
  74. [page:Materials NeverDepth] will never return true.<br />
  75. [page:Materials AlwaysDepth] will always return true.<br />
  76. [page:Materials LessDepth] will return true if the incoming pixel Z-depth is less than the current buffer Z-depth.<br />
  77. [page:Materials LessEqualDepth] is the default and will return true if the incoming pixel Z-depth is less than or equal to the current buffer Z-depth.<br />
  78. [page:Materials GreaterEqualDepth] will return true if the incoming pixel Z-depth is greater than or equal to the current buffer Z-depth.<br />
  79. [page:Materials GreaterDepth] will return true if the incoming pixel Z-depth is greater than the current buffer Z-depth.<br />
  80. [page:Materials NotEqualDepth] will return true if the incoming pixel Z-depth is equal to the current buffer Z-depth.<br />
  81. </div>
  82. <h2>Texture Combine Operations</h2>
  83. <code>
  84. THREE.MultiplyOperation
  85. THREE.MixOperation
  86. THREE.AddOperation
  87. </code>
  88. These define how the result of the surface's color is combined with the environment map (if present), for [page:MeshBasicMaterial.combine MeshBasicMaterial], [page:MeshLambertMaterial.combine MeshLambertMaterial] and [page:MeshPhongMaterial.combine MeshPhongMaterial]. <br />
  89. [page:Constant MultiplyOperation] is the default and multiplies the environment map color with the surface color.<br />
  90. [page:Constant MixOperation] uses reflectivity to blend between the two colors.<br />
  91. [page:Constant AddOperation] adds the two colors.
  92. <h2>Source</h2>
  93. [link:https://github.com/mrdoob/three.js/blob/master/src/constants.js src/constants.js]
  94. </body>
  95. </html>