CesiumInspectorViewModel.js 31 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947
  1. import defined from '../../Core/defined.js';
  2. import defineProperties from '../../Core/defineProperties.js';
  3. import destroyObject from '../../Core/destroyObject.js';
  4. import DeveloperError from '../../Core/DeveloperError.js';
  5. import Rectangle from '../../Core/Rectangle.js';
  6. import ScreenSpaceEventHandler from '../../Core/ScreenSpaceEventHandler.js';
  7. import ScreenSpaceEventType from '../../Core/ScreenSpaceEventType.js';
  8. import DebugModelMatrixPrimitive from '../../Scene/DebugModelMatrixPrimitive.js';
  9. import PerformanceDisplay from '../../Scene/PerformanceDisplay.js';
  10. import TileCoordinatesImageryProvider from '../../Scene/TileCoordinatesImageryProvider.js';
  11. import knockout from '../../ThirdParty/knockout.js';
  12. import createCommand from '../createCommand.js';
  13. function frustumStatisticsToString(statistics) {
  14. var str;
  15. if (defined(statistics)) {
  16. str = 'Command Statistics';
  17. var com = statistics.commandsInFrustums;
  18. for (var n in com) {
  19. if (com.hasOwnProperty(n)) {
  20. var num = parseInt(n, 10);
  21. var s;
  22. if (num === 7) {
  23. s = '1, 2 and 3';
  24. } else {
  25. var f = [];
  26. for (var i = 2; i >= 0; i--) {
  27. var p = Math.pow(2, i);
  28. if (num >= p) {
  29. f.push(i + 1);
  30. num -= p;
  31. }
  32. }
  33. s = f.reverse().join(' and ');
  34. }
  35. str += '<br>&nbsp;&nbsp;&nbsp;&nbsp;' + com[n] + ' in frustum ' + s;
  36. }
  37. }
  38. str += '<br>Total: ' + statistics.totalCommands;
  39. }
  40. return str;
  41. }
  42. function boundDepthFrustum(lower, upper, proposed) {
  43. var bounded = Math.min(proposed, upper);
  44. bounded = Math.max(bounded, lower);
  45. return bounded;
  46. }
  47. /**
  48. * The view model for {@link CesiumInspector}.
  49. * @alias CesiumInspectorViewModel
  50. * @constructor
  51. *
  52. * @param {Scene} scene The scene instance to use.
  53. * @param {PerformanceContainer} performanceContainer The instance to use for performance container.
  54. */
  55. function CesiumInspectorViewModel(scene, performanceContainer) {
  56. //>>includeStart('debug', pragmas.debug);
  57. if (!defined(scene)) {
  58. throw new DeveloperError('scene is required');
  59. }
  60. if (!defined(performanceContainer)) {
  61. throw new DeveloperError('performanceContainer is required');
  62. }
  63. //>>includeEnd('debug');
  64. var that = this;
  65. var canvas = scene.canvas;
  66. var eventHandler = new ScreenSpaceEventHandler(canvas);
  67. this._eventHandler = eventHandler;
  68. this._scene = scene;
  69. this._canvas = canvas;
  70. this._primitive = undefined;
  71. this._tile = undefined;
  72. this._modelMatrixPrimitive = undefined;
  73. this._performanceDisplay = undefined;
  74. this._performanceContainer = performanceContainer;
  75. var globe = this._scene.globe;
  76. globe.depthTestAgainstTerrain = true;
  77. /**
  78. * Gets or sets the show frustums state. This property is observable.
  79. * @type {Boolean}
  80. * @default false
  81. */
  82. this.frustums = false;
  83. /**
  84. * Gets or sets the show frustum planes state. This property is observable.
  85. * @type {Boolean}
  86. * @default false
  87. */
  88. this.frustumPlanes = false;
  89. /**
  90. * Gets or sets the show performance display state. This property is observable.
  91. * @type {Boolean}
  92. * @default false
  93. */
  94. this.performance = false;
  95. /**
  96. * Gets or sets the shader cache text. This property is observable.
  97. * @type {String}
  98. * @default ''
  99. */
  100. this.shaderCacheText = '';
  101. /**
  102. * Gets or sets the show primitive bounding sphere state. This property is observable.
  103. * @type {Boolean}
  104. * @default false
  105. */
  106. this.primitiveBoundingSphere = false;
  107. /**
  108. * Gets or sets the show primitive reference frame state. This property is observable.
  109. * @type {Boolean}
  110. * @default false
  111. */
  112. this.primitiveReferenceFrame = false;
  113. /**
  114. * Gets or sets the filter primitive state. This property is observable.
  115. * @type {Boolean}
  116. * @default false
  117. */
  118. this.filterPrimitive = false;
  119. /**
  120. * Gets or sets the show tile bounding sphere state. This property is observable.
  121. * @type {Boolean}
  122. * @default false
  123. */
  124. this.tileBoundingSphere = false;
  125. /**
  126. * Gets or sets the filter tile state. This property is observable.
  127. * @type {Boolean}
  128. * @default false
  129. */
  130. this.filterTile = false;
  131. /**
  132. * Gets or sets the show wireframe state. This property is observable.
  133. * @type {Boolean}
  134. * @default false
  135. */
  136. this.wireframe = false;
  137. /**
  138. * Gets or sets the show globe depth state. This property is observable.
  139. * @type {Boolean}
  140. * @default false
  141. */
  142. this.globeDepth = false;
  143. /**
  144. * Gets or sets the show pick depth state. This property is observable.
  145. * @type {Boolean}
  146. * @default false
  147. */
  148. this.pickDepth = false;
  149. /**
  150. * Gets or sets the index of the depth frustum to display. This property is observable.
  151. * @type {Number}
  152. * @default 1
  153. */
  154. this.depthFrustum = 1;
  155. this._numberOfFrustums = 1;
  156. /**
  157. * Gets or sets the suspend updates state. This property is observable.
  158. * @type {Boolean}
  159. * @default false
  160. */
  161. this.suspendUpdates = false;
  162. /**
  163. * Gets or sets the show tile coordinates state. This property is observable.
  164. * @type {Boolean}
  165. * @default false
  166. */
  167. this.tileCoordinates = false;
  168. /**
  169. * Gets or sets the frustum statistic text. This property is observable.
  170. * @type {String}
  171. * @default ''
  172. */
  173. this.frustumStatisticText = false;
  174. /**
  175. * Gets or sets the selected tile information text. This property is observable.
  176. * @type {String}
  177. * @default ''
  178. */
  179. this.tileText = '';
  180. /**
  181. * Gets if a primitive has been selected. This property is observable.
  182. * @type {Boolean}
  183. * @default false
  184. */
  185. this.hasPickedPrimitive = false;
  186. /**
  187. * Gets if a tile has been selected. This property is observable
  188. * @type {Boolean}
  189. * @default false
  190. */
  191. this.hasPickedTile = false;
  192. /**
  193. * Gets if the picking primitive command is active. This property is observable.
  194. * @type {Boolean}
  195. * @default false
  196. */
  197. this.pickPrimitiveActive = false;
  198. /**
  199. * Gets if the picking tile command is active. This property is observable.
  200. * @type {Boolean}
  201. * @default false
  202. */
  203. this.pickTileActive = false;
  204. /**
  205. * Gets or sets if the cesium inspector drop down is visible. This property is observable.
  206. * @type {Boolean}
  207. * @default true
  208. */
  209. this.dropDownVisible = true;
  210. /**
  211. * Gets or sets if the general section is visible. This property is observable.
  212. * @type {Boolean}
  213. * @default true
  214. */
  215. this.generalVisible = true;
  216. /**
  217. * Gets or sets if the primitive section is visible. This property is observable.
  218. * @type {Boolean}
  219. * @default false
  220. */
  221. this.primitivesVisible = false;
  222. /**
  223. * Gets or sets if the terrain section is visible. This property is observable.
  224. * @type {Boolean}
  225. * @default false
  226. */
  227. this.terrainVisible = false;
  228. /**
  229. * Gets or sets the index of the depth frustum text. This property is observable.
  230. * @type {String}
  231. * @default ''
  232. */
  233. this.depthFrustumText = '';
  234. knockout.track(this, [
  235. 'frustums',
  236. 'frustumPlanes',
  237. 'performance',
  238. 'shaderCacheText',
  239. 'primitiveBoundingSphere',
  240. 'primitiveReferenceFrame',
  241. 'filterPrimitive',
  242. 'tileBoundingSphere',
  243. 'filterTile',
  244. 'wireframe',
  245. 'globeDepth',
  246. 'pickDepth',
  247. 'depthFrustum',
  248. 'suspendUpdates',
  249. 'tileCoordinates',
  250. 'frustumStatisticText',
  251. 'tileText',
  252. 'hasPickedPrimitive',
  253. 'hasPickedTile',
  254. 'pickPrimitiveActive',
  255. 'pickTileActive',
  256. 'dropDownVisible',
  257. 'generalVisible',
  258. 'primitivesVisible',
  259. 'terrainVisible',
  260. 'depthFrustumText'
  261. ]);
  262. this._toggleDropDown = createCommand(function() {
  263. that.dropDownVisible = !that.dropDownVisible;
  264. });
  265. this._toggleGeneral = createCommand(function() {
  266. that.generalVisible = !that.generalVisible;
  267. });
  268. this._togglePrimitives = createCommand(function() {
  269. that.primitivesVisible = !that.primitivesVisible;
  270. });
  271. this._toggleTerrain = createCommand(function() {
  272. that.terrainVisible = !that.terrainVisible;
  273. });
  274. this._frustumsSubscription = knockout.getObservable(this, 'frustums').subscribe(function(val) {
  275. that._scene.debugShowFrustums = val;
  276. that._scene.requestRender();
  277. });
  278. this._frustumPlanesSubscription = knockout.getObservable(this, 'frustumPlanes').subscribe(function(val) {
  279. that._scene.debugShowFrustumPlanes = val;
  280. that._scene.requestRender();
  281. });
  282. this._performanceSubscription = knockout.getObservable(this, 'performance').subscribe(function(val) {
  283. if (val) {
  284. that._performanceDisplay = new PerformanceDisplay({
  285. container : that._performanceContainer
  286. });
  287. } else {
  288. that._performanceContainer.innerHTML = '';
  289. }
  290. });
  291. this._showPrimitiveBoundingSphere = createCommand(function() {
  292. that._primitive.debugShowBoundingVolume = that.primitiveBoundingSphere;
  293. that._scene.requestRender();
  294. return true;
  295. });
  296. this._primitiveBoundingSphereSubscription = knockout.getObservable(this, 'primitiveBoundingSphere').subscribe(function() {
  297. that._showPrimitiveBoundingSphere();
  298. });
  299. this._showPrimitiveReferenceFrame = createCommand(function() {
  300. if (that.primitiveReferenceFrame) {
  301. var modelMatrix = that._primitive.modelMatrix;
  302. that._modelMatrixPrimitive = new DebugModelMatrixPrimitive({
  303. modelMatrix : modelMatrix
  304. });
  305. that._scene.primitives.add(that._modelMatrixPrimitive);
  306. } else if (defined(that._modelMatrixPrimitive)) {
  307. that._scene.primitives.remove(that._modelMatrixPrimitive);
  308. that._modelMatrixPrimitive = undefined;
  309. }
  310. that._scene.requestRender();
  311. return true;
  312. });
  313. this._primitiveReferenceFrameSubscription = knockout.getObservable(this, 'primitiveReferenceFrame').subscribe(function() {
  314. that._showPrimitiveReferenceFrame();
  315. });
  316. this._doFilterPrimitive = createCommand(function() {
  317. if (that.filterPrimitive) {
  318. that._scene.debugCommandFilter = function(command) {
  319. if (defined(that._modelMatrixPrimitive) && command.owner === that._modelMatrixPrimitive._primitive) {
  320. return true;
  321. } else if (defined(that._primitive)) {
  322. return command.owner === that._primitive || command.owner === that._primitive._billboardCollection || command.owner.primitive === that._primitive;
  323. }
  324. return false;
  325. };
  326. } else {
  327. that._scene.debugCommandFilter = undefined;
  328. }
  329. return true;
  330. });
  331. this._filterPrimitiveSubscription = knockout.getObservable(this, 'filterPrimitive').subscribe(function() {
  332. that._doFilterPrimitive();
  333. that._scene.requestRender();
  334. });
  335. this._wireframeSubscription = knockout.getObservable(this, 'wireframe').subscribe(function(val) {
  336. globe._surface.tileProvider._debug.wireframe = val;
  337. that._scene.requestRender();
  338. });
  339. this._globeDepthSubscription = knockout.getObservable(this, 'globeDepth').subscribe(function(val) {
  340. that._scene.debugShowGlobeDepth = val;
  341. that._scene.requestRender();
  342. });
  343. this._pickDepthSubscription = knockout.getObservable(this, 'pickDepth').subscribe(function(val) {
  344. that._scene.debugShowPickDepth = val;
  345. that._scene.requestRender();
  346. });
  347. this._depthFrustumSubscription = knockout.getObservable(this, 'depthFrustum').subscribe(function(val) {
  348. that._scene.debugShowDepthFrustum = val;
  349. that._scene.requestRender();
  350. });
  351. this._incrementDepthFrustum = createCommand(function() {
  352. var next = that.depthFrustum + 1;
  353. that.depthFrustum = boundDepthFrustum(1, that._numberOfFrustums, next);
  354. that._scene.requestRender();
  355. return true;
  356. });
  357. this._decrementDepthFrustum = createCommand(function() {
  358. var next = that.depthFrustum - 1;
  359. that.depthFrustum = boundDepthFrustum(1, that._numberOfFrustums, next);
  360. that._scene.requestRender();
  361. return true;
  362. });
  363. this._suspendUpdatesSubscription = knockout.getObservable(this, 'suspendUpdates').subscribe(function(val) {
  364. globe._surface._debug.suspendLodUpdate = val;
  365. if (!val) {
  366. that.filterTile = false;
  367. }
  368. });
  369. var tileBoundariesLayer;
  370. this._showTileCoordinates = createCommand(function() {
  371. if (that.tileCoordinates && !defined(tileBoundariesLayer)) {
  372. tileBoundariesLayer = scene.imageryLayers.addImageryProvider(new TileCoordinatesImageryProvider({
  373. tilingScheme : scene.terrainProvider.tilingScheme
  374. }));
  375. } else if (!that.tileCoordinates && defined(tileBoundariesLayer)) {
  376. scene.imageryLayers.remove(tileBoundariesLayer);
  377. tileBoundariesLayer = undefined;
  378. }
  379. return true;
  380. });
  381. this._tileCoordinatesSubscription = knockout.getObservable(this, 'tileCoordinates').subscribe(function() {
  382. that._showTileCoordinates();
  383. that._scene.requestRender();
  384. });
  385. this._tileBoundingSphereSubscription = knockout.getObservable(this, 'tileBoundingSphere').subscribe(function() {
  386. that._showTileBoundingSphere();
  387. that._scene.requestRender();
  388. });
  389. this._showTileBoundingSphere = createCommand(function() {
  390. if (that.tileBoundingSphere) {
  391. globe._surface.tileProvider._debug.boundingSphereTile = that._tile;
  392. } else {
  393. globe._surface.tileProvider._debug.boundingSphereTile = undefined;
  394. }
  395. that._scene.requestRender();
  396. return true;
  397. });
  398. this._doFilterTile = createCommand(function() {
  399. if (!that.filterTile) {
  400. that.suspendUpdates = false;
  401. } else {
  402. that.suspendUpdates = true;
  403. globe._surface._tilesToRender = [];
  404. if (defined(that._tile) && that._tile.renderable) {
  405. globe._surface._tilesToRender.push(that._tile);
  406. }
  407. }
  408. return true;
  409. });
  410. this._filterTileSubscription = knockout.getObservable(this, 'filterTile').subscribe(function() {
  411. that.doFilterTile();
  412. that._scene.requestRender();
  413. });
  414. function pickPrimitive(e) {
  415. var newPick = that._scene.pick({
  416. x : e.position.x,
  417. y : e.position.y
  418. });
  419. if (defined(newPick)) {
  420. that.primitive = defined(newPick.collection) ? newPick.collection : newPick.primitive;
  421. }
  422. that._scene.requestRender();
  423. that.pickPrimitiveActive = false;
  424. }
  425. this._pickPrimitive = createCommand(function() {
  426. that.pickPrimitiveActive = !that.pickPrimitiveActive;
  427. });
  428. this._pickPrimitiveActiveSubscription = knockout.getObservable(this, 'pickPrimitiveActive').subscribe(function(val) {
  429. if (val) {
  430. eventHandler.setInputAction(pickPrimitive, ScreenSpaceEventType.LEFT_CLICK);
  431. } else {
  432. eventHandler.removeInputAction(ScreenSpaceEventType.LEFT_CLICK);
  433. }
  434. });
  435. function selectTile(e) {
  436. var selectedTile;
  437. var ellipsoid = globe.ellipsoid;
  438. var cartesian = that._scene.camera.pickEllipsoid({
  439. x : e.position.x,
  440. y : e.position.y
  441. }, ellipsoid);
  442. if (defined(cartesian)) {
  443. var cartographic = ellipsoid.cartesianToCartographic(cartesian);
  444. var tilesRendered = globe._surface.tileProvider._tilesToRenderByTextureCount;
  445. for (var textureCount = 0; !selectedTile && textureCount < tilesRendered.length; ++textureCount) {
  446. var tilesRenderedByTextureCount = tilesRendered[textureCount];
  447. if (!defined(tilesRenderedByTextureCount)) {
  448. continue;
  449. }
  450. for (var tileIndex = 0; !selectedTile && tileIndex < tilesRenderedByTextureCount.length; ++tileIndex) {
  451. var tile = tilesRenderedByTextureCount[tileIndex];
  452. if (Rectangle.contains(tile.rectangle, cartographic)) {
  453. selectedTile = tile;
  454. }
  455. }
  456. }
  457. }
  458. that.tile = selectedTile;
  459. that.pickTileActive = false;
  460. }
  461. this._pickTile = createCommand(function() {
  462. that.pickTileActive = !that.pickTileActive;
  463. });
  464. this._pickTileActiveSubscription = knockout.getObservable(this, 'pickTileActive').subscribe(function(val) {
  465. if (val) {
  466. eventHandler.setInputAction(selectTile, ScreenSpaceEventType.LEFT_CLICK);
  467. } else {
  468. eventHandler.removeInputAction(ScreenSpaceEventType.LEFT_CLICK);
  469. }
  470. });
  471. this._removePostRenderEvent = scene.postRender.addEventListener(function() {
  472. that._update();
  473. });
  474. }
  475. defineProperties(CesiumInspectorViewModel.prototype, {
  476. /**
  477. * Gets the scene to control.
  478. * @memberof CesiumInspectorViewModel.prototype
  479. *
  480. * @type {Scene}
  481. */
  482. scene : {
  483. get : function() {
  484. return this._scene;
  485. }
  486. },
  487. /**
  488. * Gets the container of the PerformanceDisplay
  489. * @memberof CesiumInspectorViewModel.prototype
  490. *
  491. * @type {Element}
  492. */
  493. performanceContainer : {
  494. get : function() {
  495. return this._performanceContainer;
  496. }
  497. },
  498. /**
  499. * Gets the command to toggle the visibility of the drop down.
  500. * @memberof CesiumInspectorViewModel.prototype
  501. *
  502. * @type {Command}
  503. */
  504. toggleDropDown : {
  505. get : function() {
  506. return this._toggleDropDown;
  507. }
  508. },
  509. /**
  510. * Gets the command to toggle the visibility of a BoundingSphere for a primitive
  511. * @memberof CesiumInspectorViewModel.prototype
  512. *
  513. * @type {Command}
  514. */
  515. showPrimitiveBoundingSphere : {
  516. get : function() {
  517. return this._showPrimitiveBoundingSphere;
  518. }
  519. },
  520. /**
  521. * Gets the command to toggle the visibility of a {@link DebugModelMatrixPrimitive} for the model matrix of a primitive
  522. * @memberof CesiumInspectorViewModel.prototype
  523. *
  524. * @type {Command}
  525. */
  526. showPrimitiveReferenceFrame : {
  527. get : function() {
  528. return this._showPrimitiveReferenceFrame;
  529. }
  530. },
  531. /**
  532. * Gets the command to toggle a filter that renders only a selected primitive
  533. * @memberof CesiumInspectorViewModel.prototype
  534. *
  535. * @type {Command}
  536. */
  537. doFilterPrimitive : {
  538. get : function() {
  539. return this._doFilterPrimitive;
  540. }
  541. },
  542. /**
  543. * Gets the command to increment the depth frustum index to be shown
  544. * @memberof CesiumInspectorViewModel.prototype
  545. *
  546. * @type {Command}
  547. */
  548. incrementDepthFrustum : {
  549. get : function() {
  550. return this._incrementDepthFrustum;
  551. }
  552. },
  553. /**
  554. * Gets the command to decrement the depth frustum index to be shown
  555. * @memberof CesiumInspectorViewModel.prototype
  556. *
  557. * @type {Command}
  558. */
  559. decrementDepthFrustum : {
  560. get : function() {
  561. return this._decrementDepthFrustum;
  562. }
  563. },
  564. /**
  565. * Gets the command to toggle the visibility of tile coordinates
  566. * @memberof CesiumInspectorViewModel.prototype
  567. *
  568. * @type {Command}
  569. */
  570. showTileCoordinates : {
  571. get : function() {
  572. return this._showTileCoordinates;
  573. }
  574. },
  575. /**
  576. * Gets the command to toggle the visibility of a BoundingSphere for a selected tile
  577. * @memberof CesiumInspectorViewModel.prototype
  578. *
  579. * @type {Command}
  580. */
  581. showTileBoundingSphere : {
  582. get : function() {
  583. return this._showTileBoundingSphere;
  584. }
  585. },
  586. /**
  587. * Gets the command to toggle a filter that renders only a selected tile
  588. * @memberof CesiumInspectorViewModel.prototype
  589. *
  590. * @type {Command}
  591. */
  592. doFilterTile : {
  593. get : function() {
  594. return this._doFilterTile;
  595. }
  596. },
  597. /**
  598. * Gets the command to expand and collapse the general section
  599. * @memberof CesiumInspectorViewModel.prototype
  600. *
  601. * @type {Command}
  602. */
  603. toggleGeneral : {
  604. get : function() {
  605. return this._toggleGeneral;
  606. }
  607. },
  608. /**
  609. * Gets the command to expand and collapse the primitives section
  610. * @memberof CesiumInspectorViewModel.prototype
  611. *
  612. * @type {Command}
  613. */
  614. togglePrimitives : {
  615. get : function() {
  616. return this._togglePrimitives;
  617. }
  618. },
  619. /**
  620. * Gets the command to expand and collapse the terrain section
  621. * @memberof CesiumInspectorViewModel.prototype
  622. *
  623. * @type {Command}
  624. */
  625. toggleTerrain : {
  626. get : function() {
  627. return this._toggleTerrain;
  628. }
  629. },
  630. /**
  631. * Gets the command to pick a primitive
  632. * @memberof CesiumInspectorViewModel.prototype
  633. *
  634. * @type {Command}
  635. */
  636. pickPrimitive : {
  637. get : function() {
  638. return this._pickPrimitive;
  639. }
  640. },
  641. /**
  642. * Gets the command to pick a tile
  643. * @memberof CesiumInspectorViewModel.prototype
  644. *
  645. * @type {Command}
  646. */
  647. pickTile : {
  648. get : function() {
  649. return this._pickTile;
  650. }
  651. },
  652. /**
  653. * Gets the command to pick a tile
  654. * @memberof CesiumInspectorViewModel.prototype
  655. *
  656. * @type {Command}
  657. */
  658. selectParent : {
  659. get : function() {
  660. var that = this;
  661. return createCommand(function() {
  662. that.tile = that.tile.parent;
  663. });
  664. }
  665. },
  666. /**
  667. * Gets the command to pick a tile
  668. * @memberof CesiumInspectorViewModel.prototype
  669. *
  670. * @type {Command}
  671. */
  672. selectNW : {
  673. get : function() {
  674. var that = this;
  675. return createCommand(function() {
  676. that.tile = that.tile.northwestChild;
  677. });
  678. }
  679. },
  680. /**
  681. * Gets the command to pick a tile
  682. * @memberof CesiumInspectorViewModel.prototype
  683. *
  684. * @type {Command}
  685. */
  686. selectNE : {
  687. get : function() {
  688. var that = this;
  689. return createCommand(function() {
  690. that.tile = that.tile.northeastChild;
  691. });
  692. }
  693. },
  694. /**
  695. * Gets the command to pick a tile
  696. * @memberof CesiumInspectorViewModel.prototype
  697. *
  698. * @type {Command}
  699. */
  700. selectSW : {
  701. get : function() {
  702. var that = this;
  703. return createCommand(function() {
  704. that.tile = that.tile.southwestChild;
  705. });
  706. }
  707. },
  708. /**
  709. * Gets the command to pick a tile
  710. * @memberof CesiumInspectorViewModel.prototype
  711. *
  712. * @type {Command}
  713. */
  714. selectSE : {
  715. get : function() {
  716. var that = this;
  717. return createCommand(function() {
  718. that.tile = that.tile.southeastChild;
  719. });
  720. }
  721. },
  722. /**
  723. * Gets or sets the current selected primitive
  724. * @memberof CesiumInspectorViewModel.prototype
  725. *
  726. * @type {Command}
  727. */
  728. primitive : {
  729. get : function() {
  730. return this._primitive;
  731. },
  732. set : function(newPrimitive) {
  733. var oldPrimitive = this._primitive;
  734. if (newPrimitive !== oldPrimitive) {
  735. this.hasPickedPrimitive = true;
  736. if (defined(oldPrimitive)) {
  737. oldPrimitive.debugShowBoundingVolume = false;
  738. }
  739. this._scene.debugCommandFilter = undefined;
  740. if (defined(this._modelMatrixPrimitive)) {
  741. this._scene.primitives.remove(this._modelMatrixPrimitive);
  742. this._modelMatrixPrimitive = undefined;
  743. }
  744. this._primitive = newPrimitive;
  745. newPrimitive.show = false;
  746. setTimeout(function() {
  747. newPrimitive.show = true;
  748. }, 50);
  749. this.showPrimitiveBoundingSphere();
  750. this.showPrimitiveReferenceFrame();
  751. this.doFilterPrimitive();
  752. }
  753. }
  754. },
  755. /**
  756. * Gets or sets the current selected tile
  757. * @memberof CesiumInspectorViewModel.prototype
  758. *
  759. * @type {Command}
  760. */
  761. tile : {
  762. get : function() {
  763. return this._tile;
  764. },
  765. set : function(newTile) {
  766. if (defined(newTile)) {
  767. this.hasPickedTile = true;
  768. var oldTile = this._tile;
  769. if (newTile !== oldTile) {
  770. this.tileText = 'L: ' + newTile.level + ' X: ' + newTile.x + ' Y: ' + newTile.y;
  771. this.tileText += '<br>SW corner: ' + newTile.rectangle.west + ', ' + newTile.rectangle.south;
  772. this.tileText += '<br>NE corner: ' + newTile.rectangle.east + ', ' + newTile.rectangle.north;
  773. var data = newTile.data;
  774. if (defined(data) && defined(data.tileBoundingRegion)) {
  775. this.tileText += '<br>Min: ' + data.tileBoundingRegion.minimumHeight + ' Max: ' + data.tileBoundingRegion.maximumHeight;
  776. } else {
  777. this.tileText += '<br>(Tile is not loaded)';
  778. }
  779. }
  780. this._tile = newTile;
  781. this.showTileBoundingSphere();
  782. this.doFilterTile();
  783. } else {
  784. this.hasPickedTile = false;
  785. this._tile = undefined;
  786. }
  787. }
  788. }
  789. });
  790. /**
  791. * Updates the view model
  792. * @private
  793. */
  794. CesiumInspectorViewModel.prototype._update = function() {
  795. if (this.frustums) {
  796. this.frustumStatisticText = frustumStatisticsToString(this._scene.debugFrustumStatistics);
  797. }
  798. // Determine the number of frustums being used.
  799. var numberOfFrustums = this._scene.numberOfFrustums;
  800. this._numberOfFrustums = numberOfFrustums;
  801. // Bound the frustum to be displayed.
  802. this.depthFrustum = boundDepthFrustum(1, numberOfFrustums, this.depthFrustum);
  803. // Update the displayed text.
  804. this.depthFrustumText = this.depthFrustum + ' of ' + numberOfFrustums;
  805. if (this.performance) {
  806. this._performanceDisplay.update();
  807. }
  808. if (this.primitiveReferenceFrame) {
  809. this._modelMatrixPrimitive.modelMatrix = this._primitive.modelMatrix;
  810. }
  811. this.shaderCacheText = 'Cached shaders: ' + this._scene.context.shaderCache.numberOfShaders;
  812. };
  813. /**
  814. * @returns {Boolean} true if the object has been destroyed, false otherwise.
  815. */
  816. CesiumInspectorViewModel.prototype.isDestroyed = function() {
  817. return false;
  818. };
  819. /**
  820. * Destroys the widget. Should be called if permanently
  821. * removing the widget from layout.
  822. */
  823. CesiumInspectorViewModel.prototype.destroy = function() {
  824. this._eventHandler.destroy();
  825. this._removePostRenderEvent();
  826. this._frustumsSubscription.dispose();
  827. this._frustumPlanesSubscription.dispose();
  828. this._performanceSubscription.dispose();
  829. this._primitiveBoundingSphereSubscription.dispose();
  830. this._primitiveReferenceFrameSubscription.dispose();
  831. this._filterPrimitiveSubscription.dispose();
  832. this._wireframeSubscription.dispose();
  833. this._globeDepthSubscription.dispose();
  834. this._pickDepthSubscription.dispose();
  835. this._depthFrustumSubscription.dispose();
  836. this._suspendUpdatesSubscription.dispose();
  837. this._tileCoordinatesSubscription.dispose();
  838. this._tileBoundingSphereSubscription.dispose();
  839. this._filterTileSubscription.dispose();
  840. this._pickPrimitiveActiveSubscription.dispose();
  841. this._pickTileActiveSubscription.dispose();
  842. return destroyObject(this);
  843. };
  844. export default CesiumInspectorViewModel;