ModelGraphics.js 19 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380
  1. import defaultValue from '../Core/defaultValue.js';
  2. import defined from '../Core/defined.js';
  3. import defineProperties from '../Core/defineProperties.js';
  4. import DeveloperError from '../Core/DeveloperError.js';
  5. import Event from '../Core/Event.js';
  6. import createPropertyDescriptor from './createPropertyDescriptor.js';
  7. import NodeTransformationProperty from './NodeTransformationProperty.js';
  8. import PropertyBag from './PropertyBag.js';
  9. function createNodeTransformationProperty(value) {
  10. return new NodeTransformationProperty(value);
  11. }
  12. function createNodeTransformationPropertyBag(value) {
  13. return new PropertyBag(value, createNodeTransformationProperty);
  14. }
  15. function createArticulationStagePropertyBag(value) {
  16. return new PropertyBag(value);
  17. }
  18. /**
  19. * A 3D model based on {@link https://github.com/KhronosGroup/glTF|glTF}, the runtime asset format for WebGL, OpenGL ES, and OpenGL.
  20. * The position and orientation of the model is determined by the containing {@link Entity}.
  21. * <p>
  22. * Cesium includes support for glTF geometry, materials, animations, and skinning.
  23. * Cameras and lights are not currently supported.
  24. * </p>
  25. *
  26. * @alias ModelGraphics
  27. * @constructor
  28. *
  29. * @param {Object} [options] Object with the following properties:
  30. * @param {Property} [options.show=true] A boolean Property specifying the visibility of the model.
  31. * @param {Property} [options.uri] A string or Resource Property specifying the URI of the glTF asset.
  32. * @param {Property} [options.scale=1.0] A numeric Property specifying a uniform linear scale.
  33. * @param {Property} [options.minimumPixelSize=0.0] A numeric Property specifying the approximate minimum pixel size of the model regardless of zoom.
  34. * @param {Property} [options.maximumScale] The maximum scale size of a model. An upper limit for minimumPixelSize.
  35. * @param {Property} [options.incrementallyLoadTextures=true] Determine if textures may continue to stream in after the model is loaded.
  36. * @param {Property} [options.runAnimations=true] A boolean Property specifying if glTF animations specified in the model should be started.
  37. * @param {Property} [options.clampAnimations=true] A boolean Property specifying if glTF animations should hold the last pose for time durations with no keyframes.
  38. * @param {Property} [options.shadows=ShadowMode.ENABLED] An enum Property specifying whether the model casts or receives shadows from each light source.
  39. * @param {Property} [options.heightReference=HeightReference.NONE] A Property specifying what the height is relative to.
  40. * @param {Property} [options.silhouetteColor=Color.RED] A Property specifying the {@link Color} of the silhouette.
  41. * @param {Property} [options.silhouetteSize=0.0] A numeric Property specifying the size of the silhouette in pixels.
  42. * @param {Property} [options.color=Color.WHITE] A Property specifying the {@link Color} that blends with the model's rendered color.
  43. * @param {Property} [options.colorBlendMode=ColorBlendMode.HIGHLIGHT] An enum Property specifying how the color blends with the model.
  44. * @param {Property} [options.colorBlendAmount=0.5] A numeric Property specifying the color strength when the <code>colorBlendMode</code> is <code>MIX</code>. A value of 0.0 results in the model's rendered color while a value of 1.0 results in a solid color, with any value in-between resulting in a mix of the two.
  45. * @param {Property} [options.imageBasedLightingFactor=new Cartesian2(1.0, 1.0)] A property specifying the contribution from diffuse and specular image-based lighting.
  46. * @param {Property} [options.lightColor] A property specifying the light color to use when shading the model. The default sun light color will be used when <code>undefined</code>.
  47. * @param {Property} [options.distanceDisplayCondition] A Property specifying at what distance from the camera that this model will be displayed.
  48. * @param {PropertyBag} [options.nodeTransformations] An object, where keys are names of nodes, and values are {@link TranslationRotationScale} Properties describing the transformation to apply to that node. The transformation is applied after the node's existing transformation as specified in the glTF, and does not replace the node's existing transformation.
  49. * @param {PropertyBag} [options.articulations] An object, where keys are composed of an articulation name, a single space, and a stage name, and the values are numeric properties.
  50. * @param {Property} [options.clippingPlanes] A property specifying the {@link ClippingPlaneCollection} used to selectively disable rendering the model.
  51. *
  52. * @see {@link https://cesium.com/docs/tutorials/3d-models/|3D Models Tutorial}
  53. * @demo {@link https://sandcastle.cesium.com/index.html?src=3D%20Models.html|Cesium Sandcastle 3D Models Demo}
  54. */
  55. function ModelGraphics(options) {
  56. this._definitionChanged = new Event();
  57. this._show = undefined;
  58. this._showSubscription = undefined;
  59. this._uri = undefined;
  60. this._uriSubscription = undefined;
  61. this._scale = undefined;
  62. this._scaleSubscription = undefined;
  63. this._minimumPixelSize = undefined;
  64. this._minimumPixelSizeSubscription = undefined;
  65. this._maximumScale = undefined;
  66. this._maximumScaleSubscription = undefined;
  67. this._incrementallyLoadTextures = undefined;
  68. this._incrementallyLoadTexturesSubscription = undefined;
  69. this._runAnimations = undefined;
  70. this._runAnimationsSubscription = undefined;
  71. this._clampAnimations = undefined;
  72. this._clampAnimationsSubscription = undefined;
  73. this._shadows = undefined;
  74. this._shadowsSubscription = undefined;
  75. this._heightReference = undefined;
  76. this._heightReferenceSubscription = undefined;
  77. this._silhouetteColor = undefined;
  78. this._silhouetteColorSubscription = undefined;
  79. this._silhouetteSize = undefined;
  80. this._silhouetteSizeSubscription = undefined;
  81. this._color = undefined;
  82. this._colorSubscription = undefined;
  83. this._colorBlendMode = undefined;
  84. this._colorBlendModeSubscription = undefined;
  85. this._colorBlendAmount = undefined;
  86. this._colorBlendAmountSubscription = undefined;
  87. this._imageBasedLightingFactor = undefined;
  88. this._imageBasedLightingFactorSubscription = undefined;
  89. this._lightColor = undefined;
  90. this._lightColorSubscription = undefined;
  91. this._distanceDisplayCondition = undefined;
  92. this._distanceDisplayConditionSubscription = undefined;
  93. this._nodeTransformations = undefined;
  94. this._nodeTransformationsSubscription = undefined;
  95. this._articulations = undefined;
  96. this._articulationsSubscription = undefined;
  97. this._clippingPlanes = undefined;
  98. this._clippingPlanesSubscription = undefined;
  99. this.merge(defaultValue(options, defaultValue.EMPTY_OBJECT));
  100. }
  101. defineProperties(ModelGraphics.prototype, {
  102. /**
  103. * Gets the event that is raised whenever a property or sub-property is changed or modified.
  104. * @memberof ModelGraphics.prototype
  105. * @type {Event}
  106. * @readonly
  107. */
  108. definitionChanged : {
  109. get : function() {
  110. return this._definitionChanged;
  111. }
  112. },
  113. /**
  114. * Gets or sets the boolean Property specifying the visibility of the model.
  115. * @memberof ModelGraphics.prototype
  116. * @type {Property}
  117. * @default true
  118. */
  119. show : createPropertyDescriptor('show'),
  120. /**
  121. * Gets or sets the string Property specifying the URI of the glTF asset.
  122. * @memberof ModelGraphics.prototype
  123. * @type {Property}
  124. */
  125. uri : createPropertyDescriptor('uri'),
  126. /**
  127. * Gets or sets the numeric Property specifying a uniform linear scale
  128. * for this model. Values greater than 1.0 increase the size of the model while
  129. * values less than 1.0 decrease it.
  130. * @memberof ModelGraphics.prototype
  131. * @type {Property}
  132. * @default 1.0
  133. */
  134. scale : createPropertyDescriptor('scale'),
  135. /**
  136. * Gets or sets the numeric Property specifying the approximate minimum
  137. * pixel size of the model regardless of zoom. This can be used to ensure that
  138. * a model is visible even when the viewer zooms out. When <code>0.0</code>,
  139. * no minimum size is enforced.
  140. * @memberof ModelGraphics.prototype
  141. * @type {Property}
  142. * @default 0.0
  143. */
  144. minimumPixelSize : createPropertyDescriptor('minimumPixelSize'),
  145. /**
  146. * Gets or sets the numeric Property specifying the maximum scale
  147. * size of a model. This property is used as an upper limit for
  148. * {@link ModelGraphics#minimumPixelSize}.
  149. * @memberof ModelGraphics.prototype
  150. * @type {Property}
  151. */
  152. maximumScale : createPropertyDescriptor('maximumScale'),
  153. /**
  154. * Get or sets the boolean Property specifying whether textures
  155. * may continue to stream in after the model is loaded.
  156. * @memberof ModelGraphics.prototype
  157. * @type {Property}
  158. */
  159. incrementallyLoadTextures : createPropertyDescriptor('incrementallyLoadTextures'),
  160. /**
  161. * Gets or sets the boolean Property specifying if glTF animations should be run.
  162. * @memberof ModelGraphics.prototype
  163. * @type {Property}
  164. * @default true
  165. */
  166. runAnimations : createPropertyDescriptor('runAnimations'),
  167. /**
  168. * Gets or sets the boolean Property specifying if glTF animations should hold the last pose for time durations with no keyframes.
  169. * @memberof ModelGraphics.prototype
  170. * @type {Property}
  171. * @default true
  172. */
  173. clampAnimations : createPropertyDescriptor('clampAnimations'),
  174. /**
  175. * Get or sets the enum Property specifying whether the model
  176. * casts or receives shadows from each light source.
  177. * @memberof ModelGraphics.prototype
  178. * @type {Property}
  179. * @default ShadowMode.ENABLED
  180. */
  181. shadows : createPropertyDescriptor('shadows'),
  182. /**
  183. * Gets or sets the Property specifying the {@link HeightReference}.
  184. * @memberof ModelGraphics.prototype
  185. * @type {Property}
  186. * @default HeightReference.NONE
  187. */
  188. heightReference : createPropertyDescriptor('heightReference'),
  189. /**
  190. * Gets or sets the Property specifying the {@link Color} of the silhouette.
  191. * @memberof ModelGraphics.prototype
  192. * @type {Property}
  193. * @default Color.RED
  194. */
  195. silhouetteColor: createPropertyDescriptor('silhouetteColor'),
  196. /**
  197. * Gets or sets the numeric Property specifying the size of the silhouette in pixels.
  198. * @memberof ModelGraphics.prototype
  199. * @type {Property}
  200. * @default 0.0
  201. */
  202. silhouetteSize : createPropertyDescriptor('silhouetteSize'),
  203. /**
  204. * Gets or sets the Property specifying the {@link Color} that blends with the model's rendered color.
  205. * @memberof ModelGraphics.prototype
  206. * @type {Property}
  207. * @default Color.WHITE
  208. */
  209. color : createPropertyDescriptor('color'),
  210. /**
  211. * Gets or sets the enum Property specifying how the color blends with the model.
  212. * @memberof ModelGraphics.prototype
  213. * @type {Property}
  214. * @default ColorBlendMode.HIGHLIGHT
  215. */
  216. colorBlendMode : createPropertyDescriptor('colorBlendMode'),
  217. /**
  218. * A numeric Property specifying the color strength when the <code>colorBlendMode</code> is MIX.
  219. * A value of 0.0 results in the model's rendered color while a value of 1.0 results in a solid color, with
  220. * any value in-between resulting in a mix of the two.
  221. * @memberof ModelGraphics.prototype
  222. * @type {Property}
  223. * @default 0.5
  224. */
  225. colorBlendAmount : createPropertyDescriptor('colorBlendAmount'),
  226. /**
  227. * A property specifying the {@link Cartesian2} used to scale the diffuse and specular image-based lighting contribution to the final color.
  228. * @memberof ModelGraphics.prototype
  229. * @type {Property}
  230. */
  231. imageBasedLightingFactor : createPropertyDescriptor('imageBasedLightingFactor'),
  232. /**
  233. * A property specifying the {@link Cartesian3} color of the light source when shading the model.
  234. * @memberOf ModelGraphics.prototype
  235. * @type {Property}
  236. */
  237. lightColor : createPropertyDescriptor('lightColor'),
  238. /**
  239. * Gets or sets the {@link DistanceDisplayCondition} Property specifying at what distance from the camera that this model will be displayed.
  240. * @memberof ModelGraphics.prototype
  241. * @type {Property}
  242. */
  243. distanceDisplayCondition : createPropertyDescriptor('distanceDisplayCondition'),
  244. /**
  245. * Gets or sets the set of node transformations to apply to this model. This is represented as an {@link PropertyBag}, where keys are
  246. * names of nodes, and values are {@link TranslationRotationScale} Properties describing the transformation to apply to that node.
  247. * The transformation is applied after the node's existing transformation as specified in the glTF, and does not replace the node's existing transformation.
  248. * @memberof ModelGraphics.prototype
  249. * @type {PropertyBag}
  250. */
  251. nodeTransformations : createPropertyDescriptor('nodeTransformations', undefined, createNodeTransformationPropertyBag),
  252. /**
  253. * Gets or sets the set of articulation values to apply to this model. This is represented as an {@link PropertyBag}, where keys are
  254. * composed as the name of the articulation, a single space, and the name of the stage.
  255. * @memberof ModelGraphics.prototype
  256. * @type {PropertyBag}
  257. */
  258. articulations : createPropertyDescriptor('articulations', undefined, createArticulationStagePropertyBag),
  259. /**
  260. * A property specifying the {@link ClippingPlaneCollection} used to selectively disable rendering the model.
  261. * @memberof ModelGraphics.prototype
  262. * @type {Property}
  263. */
  264. clippingPlanes : createPropertyDescriptor('clippingPlanes')
  265. });
  266. /**
  267. * Duplicates this instance.
  268. *
  269. * @param {ModelGraphics} [result] The object onto which to store the result.
  270. * @returns {ModelGraphics} The modified result parameter or a new instance if one was not provided.
  271. */
  272. ModelGraphics.prototype.clone = function(result) {
  273. if (!defined(result)) {
  274. return new ModelGraphics(this);
  275. }
  276. result.show = this.show;
  277. result.uri = this.uri;
  278. result.scale = this.scale;
  279. result.minimumPixelSize = this.minimumPixelSize;
  280. result.maximumScale = this.maximumScale;
  281. result.incrementallyLoadTextures = this.incrementallyLoadTextures;
  282. result.runAnimations = this.runAnimations;
  283. result.clampAnimations = this.clampAnimations;
  284. result.heightReference = this._heightReference;
  285. result.silhouetteColor = this.silhouetteColor;
  286. result.silhouetteSize = this.silhouetteSize;
  287. result.color = this.color;
  288. result.colorBlendMode = this.colorBlendMode;
  289. result.colorBlendAmount = this.colorBlendAmount;
  290. result.imageBasedLightingFactor = this.imageBasedLightingFactor;
  291. result.lightColor = this.lightColor;
  292. result.distanceDisplayCondition = this.distanceDisplayCondition;
  293. result.nodeTransformations = this.nodeTransformations;
  294. result.articulations = this.articulations;
  295. result.clippingPlanes = this.clippingPlanes;
  296. return result;
  297. };
  298. /**
  299. * Assigns each unassigned property on this object to the value
  300. * of the same property on the provided source object.
  301. *
  302. * @param {ModelGraphics} source The object to be merged into this object.
  303. */
  304. ModelGraphics.prototype.merge = function(source) {
  305. //>>includeStart('debug', pragmas.debug);
  306. if (!defined(source)) {
  307. throw new DeveloperError('source is required.');
  308. }
  309. //>>includeEnd('debug');
  310. this.show = defaultValue(this.show, source.show);
  311. this.uri = defaultValue(this.uri, source.uri);
  312. this.scale = defaultValue(this.scale, source.scale);
  313. this.minimumPixelSize = defaultValue(this.minimumPixelSize, source.minimumPixelSize);
  314. this.maximumScale = defaultValue(this.maximumScale, source.maximumScale);
  315. this.incrementallyLoadTextures = defaultValue(this.incrementallyLoadTextures, source.incrementallyLoadTextures);
  316. this.runAnimations = defaultValue(this.runAnimations, source.runAnimations);
  317. this.clampAnimations = defaultValue(this.clampAnimations, source.clampAnimations);
  318. this.shadows = defaultValue(this.shadows, source.shadows);
  319. this.heightReference = defaultValue(this.heightReference, source.heightReference);
  320. this.silhouetteColor = defaultValue(this.silhouetteColor, source.silhouetteColor);
  321. this.silhouetteSize = defaultValue(this.silhouetteSize, source.silhouetteSize);
  322. this.color = defaultValue(this.color, source.color);
  323. this.colorBlendMode = defaultValue(this.colorBlendMode, source.colorBlendMode);
  324. this.colorBlendAmount = defaultValue(this.colorBlendAmount, source.colorBlendAmount);
  325. this.imageBasedLightingFactor = defaultValue(this.imageBasedLightingFactor, source.imageBasedLightingFactor);
  326. this.lightColor = defaultValue(this.lightColor, source.lightColor);
  327. this.distanceDisplayCondition = defaultValue(this.distanceDisplayCondition, source.distanceDisplayCondition);
  328. this.clippingPlanes = defaultValue(this.clippingPlanes, source.clippingPlanes);
  329. var sourceNodeTransformations = source.nodeTransformations;
  330. if (defined(sourceNodeTransformations)) {
  331. var targetNodeTransformations = this.nodeTransformations;
  332. if (defined(targetNodeTransformations)) {
  333. targetNodeTransformations.merge(sourceNodeTransformations);
  334. } else {
  335. this.nodeTransformations = new PropertyBag(sourceNodeTransformations, createNodeTransformationProperty);
  336. }
  337. }
  338. var sourceArticulations = source.articulations;
  339. if (defined(sourceArticulations)) {
  340. var targetArticulations = this.articulations;
  341. if (defined(targetArticulations)) {
  342. targetArticulations.merge(sourceArticulations);
  343. } else {
  344. this.articulations = new PropertyBag(sourceArticulations);
  345. }
  346. }
  347. };
  348. export default ModelGraphics;