123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115 |
- /*global define*/
- define([
- '../Core/Color',
- '../Core/defaultValue',
- '../Core/defined',
- '../Core/destroyObject',
- '../Core/DeveloperError',
- '../Core/getTimestamp',
- '../Widgets/getElement'
- ], function(
- Color,
- defaultValue,
- defined,
- destroyObject,
- DeveloperError,
- getTimestamp,
- getElement) {
- "use strict";
- var defaultFpsColor = Color.fromCssColorString('#e52');
- var defaultFrameTimeColor = Color.fromCssColorString('#de3');
- var defaultBackgroundColor = Color.fromCssColorString('rgba(40, 40, 40, 0.7)');
- /**
- * @private
- */
- var PerformanceDisplay = function(options) {
- options = defaultValue(options, defaultValue.EMPTY_OBJECT);
- var container = getElement(options.container);
- if (!defined(container)) {
- throw new DeveloperError('container is required');
- }
- this._container = container;
- this._fpsColor = defaultValue(options.fpsColor, defaultFpsColor).toCssColorString();
- this._frameTimeColor = defaultValue(options.frameTimeColor, defaultFrameTimeColor).toCssColorString();
- this._backgroundColor = defaultValue(options.backgroundColor, defaultBackgroundColor).toCssColorString();
- this._font = defaultValue(options.font, 'bold 12px Helvetica,Arial,sans-serif');
- var display = document.createElement('div');
- var fpsElement = document.createElement('div');
- this._fpsText = document.createTextNode("");
- fpsElement.appendChild(this._fpsText);
- fpsElement.style.color = this._fpsColor;
- var msElement = document.createElement('div');
- this._msText = document.createTextNode("");
- msElement.style.color = this._frameTimeColor;
- msElement.appendChild(this._msText);
- display.appendChild(fpsElement);
- display.appendChild(msElement);
- display.style['z-index'] = 1;
- display.style['background-color'] = this._backgroundColor;
- display.style.font = this._font;
- display.style.padding = '7px';
- display.style['border-radius'] = '5px';
- display.style.border = '1px solid #444';
- this._container.appendChild(display);
- this._lastFpsSampleTime = undefined;
- this._frameCount = 0;
- this._time = undefined;
- this._fps = 0;
- this._frameTime = 0;
- };
- /**
- * Update the display. This function should only be called once per frame, because
- * each call records a frame in the internal buffer and redraws the display.
- */
- PerformanceDisplay.prototype.update = function() {
- if (!defined(this._time)) {
- //first update
- this._lastFpsSampleTime = getTimestamp();
- this._time = getTimestamp();
- return;
- }
- var previousTime = this._time;
- var time = getTimestamp();
- this._time = time;
- var frameTime = time - previousTime;
- this._frameCount++;
- var fps = this._fps;
- var fpsElapsedTime = time - this._lastFpsSampleTime;
- if (fpsElapsedTime > 1000) {
- fps = this._frameCount * 1000 / fpsElapsedTime | 0;
- this._lastFpsSampleTime = time;
- this._frameCount = 0;
- }
- if (fps !== this._fps) {
- this._fpsText.nodeValue = fps + ' FPS';
- this._fps = fps;
- }
- if (frameTime !== this._frameTime) {
- this._msText.nodeValue = frameTime.toFixed(2) + ' MS';
- this._frameTime = frameTime;
- }
- };
- /**
- * Destroys the WebGL resources held by this object.
- */
- PerformanceDisplay.prototype.destroy = function() {
- return destroyObject(this);
- };
- return PerformanceDisplay;
- });
|