MaterialAppearance.js 12 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308
  1. import defaultValue from '../Core/defaultValue.js';
  2. import defined from '../Core/defined.js';
  3. import defineProperties from '../Core/defineProperties.js';
  4. import freezeObject from '../Core/freezeObject.js';
  5. import VertexFormat from '../Core/VertexFormat.js';
  6. import AllMaterialAppearanceFS from '../Shaders/Appearances/AllMaterialAppearanceFS.js';
  7. import AllMaterialAppearanceVS from '../Shaders/Appearances/AllMaterialAppearanceVS.js';
  8. import BasicMaterialAppearanceFS from '../Shaders/Appearances/BasicMaterialAppearanceFS.js';
  9. import BasicMaterialAppearanceVS from '../Shaders/Appearances/BasicMaterialAppearanceVS.js';
  10. import TexturedMaterialAppearanceFS from '../Shaders/Appearances/TexturedMaterialAppearanceFS.js';
  11. import TexturedMaterialAppearanceVS from '../Shaders/Appearances/TexturedMaterialAppearanceVS.js';
  12. import Appearance from './Appearance.js';
  13. import Material from './Material.js';
  14. /**
  15. * An appearance for arbitrary geometry (as opposed to {@link EllipsoidSurfaceAppearance}, for example)
  16. * that supports shading with materials.
  17. *
  18. * @alias MaterialAppearance
  19. * @constructor
  20. *
  21. * @param {Object} [options] Object with the following properties:
  22. * @param {Boolean} [options.flat=false] When <code>true</code>, flat shading is used in the fragment shader, which means lighting is not taking into account.
  23. * @param {Boolean} [options.faceForward=!options.closed] When <code>true</code>, the fragment shader flips the surface normal as needed to ensure that the normal faces the viewer to avoid dark spots. This is useful when both sides of a geometry should be shaded like {@link WallGeometry}.
  24. * @param {Boolean} [options.translucent=true] When <code>true</code>, the geometry is expected to appear translucent so {@link MaterialAppearance#renderState} has alpha blending enabled.
  25. * @param {Boolean} [options.closed=false] When <code>true</code>, the geometry is expected to be closed so {@link MaterialAppearance#renderState} has backface culling enabled.
  26. * @param {MaterialAppearance.MaterialSupport} [options.materialSupport=MaterialAppearance.MaterialSupport.TEXTURED] The type of materials that will be supported.
  27. * @param {Material} [options.material=Material.ColorType] The material used to determine the fragment color.
  28. * @param {String} [options.vertexShaderSource] Optional GLSL vertex shader source to override the default vertex shader.
  29. * @param {String} [options.fragmentShaderSource] Optional GLSL fragment shader source to override the default fragment shader.
  30. * @param {RenderState} [options.renderState] Optional render state to override the default render state.
  31. *
  32. * @see {@link https://github.com/AnalyticalGraphicsInc/cesium/wiki/Fabric|Fabric}
  33. * @demo {@link https://sandcastle.cesium.com/index.html?src=Materials.html|Cesium Sandcastle Material Appearance Demo}
  34. *
  35. * @example
  36. * var primitive = new Cesium.Primitive({
  37. * geometryInstances : new Cesium.GeometryInstance({
  38. * geometry : new Cesium.WallGeometry({
  39. materialSupport : Cesium.MaterialAppearance.MaterialSupport.BASIC.vertexFormat,
  40. * // ...
  41. * })
  42. * }),
  43. * appearance : new Cesium.MaterialAppearance({
  44. * material : Cesium.Material.fromType('Color'),
  45. * faceForward : true
  46. * })
  47. *
  48. * });
  49. */
  50. function MaterialAppearance(options) {
  51. options = defaultValue(options, defaultValue.EMPTY_OBJECT);
  52. var translucent = defaultValue(options.translucent, true);
  53. var closed = defaultValue(options.closed, false);
  54. var materialSupport = defaultValue(options.materialSupport, MaterialAppearance.MaterialSupport.TEXTURED);
  55. /**
  56. * The material used to determine the fragment color. Unlike other {@link MaterialAppearance}
  57. * properties, this is not read-only, so an appearance's material can change on the fly.
  58. *
  59. * @type Material
  60. *
  61. * @default {@link Material.ColorType}
  62. *
  63. * @see {@link https://github.com/AnalyticalGraphicsInc/cesium/wiki/Fabric|Fabric}
  64. */
  65. this.material = (defined(options.material)) ? options.material : Material.fromType(Material.ColorType);
  66. /**
  67. * When <code>true</code>, the geometry is expected to appear translucent.
  68. *
  69. * @type {Boolean}
  70. *
  71. * @default true
  72. */
  73. this.translucent = translucent;
  74. this._vertexShaderSource = defaultValue(options.vertexShaderSource, materialSupport.vertexShaderSource);
  75. this._fragmentShaderSource = defaultValue(options.fragmentShaderSource, materialSupport.fragmentShaderSource);
  76. this._renderState = Appearance.getDefaultRenderState(translucent, closed, options.renderState);
  77. this._closed = closed;
  78. // Non-derived members
  79. this._materialSupport = materialSupport;
  80. this._vertexFormat = materialSupport.vertexFormat;
  81. this._flat = defaultValue(options.flat, false);
  82. this._faceForward = defaultValue(options.faceForward, !closed);
  83. }
  84. defineProperties(MaterialAppearance.prototype, {
  85. /**
  86. * The GLSL source code for the vertex shader.
  87. *
  88. * @memberof MaterialAppearance.prototype
  89. *
  90. * @type {String}
  91. * @readonly
  92. */
  93. vertexShaderSource : {
  94. get : function() {
  95. return this._vertexShaderSource;
  96. }
  97. },
  98. /**
  99. * The GLSL source code for the fragment shader. The full fragment shader
  100. * source is built procedurally taking into account {@link MaterialAppearance#material},
  101. * {@link MaterialAppearance#flat}, and {@link MaterialAppearance#faceForward}.
  102. * Use {@link MaterialAppearance#getFragmentShaderSource} to get the full source.
  103. *
  104. * @memberof MaterialAppearance.prototype
  105. *
  106. * @type {String}
  107. * @readonly
  108. */
  109. fragmentShaderSource : {
  110. get : function() {
  111. return this._fragmentShaderSource;
  112. }
  113. },
  114. /**
  115. * The WebGL fixed-function state to use when rendering the geometry.
  116. * <p>
  117. * The render state can be explicitly defined when constructing a {@link MaterialAppearance}
  118. * instance, or it is set implicitly via {@link MaterialAppearance#translucent}
  119. * and {@link MaterialAppearance#closed}.
  120. * </p>
  121. *
  122. * @memberof MaterialAppearance.prototype
  123. *
  124. * @type {Object}
  125. * @readonly
  126. */
  127. renderState : {
  128. get : function() {
  129. return this._renderState;
  130. }
  131. },
  132. /**
  133. * When <code>true</code>, the geometry is expected to be closed so
  134. * {@link MaterialAppearance#renderState} has backface culling enabled.
  135. * If the viewer enters the geometry, it will not be visible.
  136. *
  137. * @memberof MaterialAppearance.prototype
  138. *
  139. * @type {Boolean}
  140. * @readonly
  141. *
  142. * @default false
  143. */
  144. closed : {
  145. get : function() {
  146. return this._closed;
  147. }
  148. },
  149. /**
  150. * The type of materials supported by this instance. This impacts the required
  151. * {@link VertexFormat} and the complexity of the vertex and fragment shaders.
  152. *
  153. * @memberof MaterialAppearance.prototype
  154. *
  155. * @type {MaterialAppearance.MaterialSupport}
  156. * @readonly
  157. *
  158. * @default {@link MaterialAppearance.MaterialSupport.TEXTURED}
  159. */
  160. materialSupport : {
  161. get : function() {
  162. return this._materialSupport;
  163. }
  164. },
  165. /**
  166. * The {@link VertexFormat} that this appearance instance is compatible with.
  167. * A geometry can have more vertex attributes and still be compatible - at a
  168. * potential performance cost - but it can't have less.
  169. *
  170. * @memberof MaterialAppearance.prototype
  171. *
  172. * @type VertexFormat
  173. * @readonly
  174. *
  175. * @default {@link MaterialAppearance.MaterialSupport.TEXTURED.vertexFormat}
  176. */
  177. vertexFormat : {
  178. get : function() {
  179. return this._vertexFormat;
  180. }
  181. },
  182. /**
  183. * When <code>true</code>, flat shading is used in the fragment shader,
  184. * which means lighting is not taking into account.
  185. *
  186. * @memberof MaterialAppearance.prototype
  187. *
  188. * @type {Boolean}
  189. * @readonly
  190. *
  191. * @default false
  192. */
  193. flat : {
  194. get : function() {
  195. return this._flat;
  196. }
  197. },
  198. /**
  199. * When <code>true</code>, the fragment shader flips the surface normal
  200. * as needed to ensure that the normal faces the viewer to avoid
  201. * dark spots. This is useful when both sides of a geometry should be
  202. * shaded like {@link WallGeometry}.
  203. *
  204. * @memberof MaterialAppearance.prototype
  205. *
  206. * @type {Boolean}
  207. * @readonly
  208. *
  209. * @default true
  210. */
  211. faceForward : {
  212. get : function() {
  213. return this._faceForward;
  214. }
  215. }
  216. });
  217. /**
  218. * Procedurally creates the full GLSL fragment shader source. For {@link MaterialAppearance},
  219. * this is derived from {@link MaterialAppearance#fragmentShaderSource}, {@link MaterialAppearance#material},
  220. * {@link MaterialAppearance#flat}, and {@link MaterialAppearance#faceForward}.
  221. *
  222. * @function
  223. *
  224. * @returns {String} The full GLSL fragment shader source.
  225. */
  226. MaterialAppearance.prototype.getFragmentShaderSource = Appearance.prototype.getFragmentShaderSource;
  227. /**
  228. * Determines if the geometry is translucent based on {@link MaterialAppearance#translucent} and {@link Material#isTranslucent}.
  229. *
  230. * @function
  231. *
  232. * @returns {Boolean} <code>true</code> if the appearance is translucent.
  233. */
  234. MaterialAppearance.prototype.isTranslucent = Appearance.prototype.isTranslucent;
  235. /**
  236. * Creates a render state. This is not the final render state instance; instead,
  237. * it can contain a subset of render state properties identical to the render state
  238. * created in the context.
  239. *
  240. * @function
  241. *
  242. * @returns {Object} The render state.
  243. */
  244. MaterialAppearance.prototype.getRenderState = Appearance.prototype.getRenderState;
  245. /**
  246. * Determines the type of {@link Material} that is supported by a
  247. * {@link MaterialAppearance} instance. This is a trade-off between
  248. * flexibility (a wide array of materials) and memory/performance
  249. * (required vertex format and GLSL shader complexity.
  250. * @exports MaterialAppearance.MaterialSupport
  251. */
  252. MaterialAppearance.MaterialSupport = {
  253. /**
  254. * Only basic materials, which require just <code>position</code> and
  255. * <code>normal</code> vertex attributes, are supported.
  256. *
  257. * @constant
  258. */
  259. BASIC : freezeObject({
  260. vertexFormat : VertexFormat.POSITION_AND_NORMAL,
  261. vertexShaderSource : BasicMaterialAppearanceVS,
  262. fragmentShaderSource : BasicMaterialAppearanceFS
  263. }),
  264. /**
  265. * Materials with textures, which require <code>position</code>,
  266. * <code>normal</code>, and <code>st</code> vertex attributes,
  267. * are supported. The vast majority of materials fall into this category.
  268. *
  269. * @constant
  270. */
  271. TEXTURED : freezeObject({
  272. vertexFormat : VertexFormat.POSITION_NORMAL_AND_ST,
  273. vertexShaderSource : TexturedMaterialAppearanceVS,
  274. fragmentShaderSource : TexturedMaterialAppearanceFS
  275. }),
  276. /**
  277. * All materials, including those that work in tangent space, are supported.
  278. * This requires <code>position</code>, <code>normal</code>, <code>st</code>,
  279. * <code>tangent</code>, and <code>bitangent</code> vertex attributes.
  280. *
  281. * @constant
  282. */
  283. ALL : freezeObject({
  284. vertexFormat : VertexFormat.ALL,
  285. vertexShaderSource : AllMaterialAppearanceVS,
  286. fragmentShaderSource : AllMaterialAppearanceFS
  287. })
  288. };
  289. export default MaterialAppearance;