PerformanceDisplay.js 4.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121
  1. import defaultValue from '../Core/defaultValue.js';
  2. import defined from '../Core/defined.js';
  3. import defineProperties from '../Core/defineProperties.js';
  4. import destroyObject from '../Core/destroyObject.js';
  5. import DeveloperError from '../Core/DeveloperError.js';
  6. import getTimestamp from '../Core/getTimestamp.js';
  7. import getElement from '../Widgets/getElement.js';
  8. /**
  9. * @private
  10. */
  11. function PerformanceDisplay(options) {
  12. options = defaultValue(options, defaultValue.EMPTY_OBJECT);
  13. var container = getElement(options.container);
  14. //>>includeStart('debug', pragmas.debug);
  15. if (!defined(container)) {
  16. throw new DeveloperError('container is required');
  17. }
  18. //>>includeEnd('debug');
  19. this._container = container;
  20. var display = document.createElement('div');
  21. display.className = 'cesium-performanceDisplay';
  22. var fpsElement = document.createElement('div');
  23. fpsElement.className = 'cesium-performanceDisplay-fps';
  24. this._fpsText = document.createTextNode('');
  25. fpsElement.appendChild(this._fpsText);
  26. var msElement = document.createElement('div');
  27. msElement.className = 'cesium-performanceDisplay-ms';
  28. this._msText = document.createTextNode('');
  29. msElement.appendChild(this._msText);
  30. display.appendChild(msElement);
  31. display.appendChild(fpsElement);
  32. this._container.appendChild(display);
  33. this._lastFpsSampleTime = getTimestamp();
  34. this._lastMsSampleTime = getTimestamp();
  35. this._fpsFrameCount = 0;
  36. this._msFrameCount = 0;
  37. this._throttled = false;
  38. var throttledElement = document.createElement('div');
  39. throttledElement.className = 'cesium-performanceDisplay-throttled';
  40. this._throttledText = document.createTextNode('');
  41. throttledElement.appendChild(this._throttledText);
  42. display.appendChild(throttledElement);
  43. }
  44. defineProperties(PerformanceDisplay.prototype, {
  45. /**
  46. * The display should indicate the FPS is being throttled.
  47. * @memberof PerformanceDisplay.prototype
  48. *
  49. * @type {Boolean}
  50. */
  51. throttled : {
  52. get : function() {
  53. return this._throttled;
  54. },
  55. set : function(value) {
  56. if (this._throttled === value) {
  57. return;
  58. }
  59. if (value) {
  60. this._throttledText.nodeValue = '(throttled)';
  61. } else {
  62. this._throttledText.nodeValue = '';
  63. }
  64. this._throttled = value;
  65. }
  66. }
  67. });
  68. /**
  69. * Update the display. This function should only be called once per frame, because
  70. * each call records a frame in the internal buffer and redraws the display.
  71. *
  72. * @param {Boolean} [renderedThisFrame=true] If provided, the FPS count will only update and display if true.
  73. */
  74. PerformanceDisplay.prototype.update = function(renderedThisFrame) {
  75. var time = getTimestamp();
  76. var updateDisplay = defaultValue(renderedThisFrame, true);
  77. this._fpsFrameCount++;
  78. var fpsElapsedTime = time - this._lastFpsSampleTime;
  79. if (fpsElapsedTime > 1000) {
  80. var fps = 'N/A';
  81. if (updateDisplay) {
  82. fps = this._fpsFrameCount * 1000 / fpsElapsedTime | 0;
  83. }
  84. this._fpsText.nodeValue = fps + ' FPS';
  85. this._lastFpsSampleTime = time;
  86. this._fpsFrameCount = 0;
  87. }
  88. this._msFrameCount++;
  89. var msElapsedTime = time - this._lastMsSampleTime;
  90. if (msElapsedTime > 200) {
  91. var ms = 'N/A';
  92. if (updateDisplay) {
  93. ms = (msElapsedTime / this._msFrameCount).toFixed(2);
  94. }
  95. this._msText.nodeValue = ms + ' MS';
  96. this._lastMsSampleTime = time;
  97. this._msFrameCount = 0;
  98. }
  99. };
  100. /**
  101. * Destroys the WebGL resources held by this object.
  102. */
  103. PerformanceDisplay.prototype.destroy = function() {
  104. return destroyObject(this);
  105. };
  106. export default PerformanceDisplay;