OLD | NEW |
(Empty) | |
| 1 <!DOCTYPE html> |
| 2 <!-- |
| 3 * Copyright (c) 2012 The Chromium Authors. All rights reserved. Use of this |
| 4 * source code is governed by a BSD-style license that can be found in the |
| 5 * LICENSE file. |
| 6 --> |
| 7 <html> |
| 8 <head> |
| 9 <title>Device Stats Monitor</title> |
| 10 <script type="text/javascript" src="http://www.google.com/jsapi"></script> |
| 11 <style> |
| 12 body { |
| 13 font-family: sans-serif |
| 14 } |
| 15 </style> |
| 16 </head> |
| 17 <body> |
| 18 <h2>Device Stats Monitor</h2> |
| 19 <ul> |
| 20 <li>Pass path to trace data via the <code>results</code> querystring param. |
| 21 <li>Combine charts with the <code>combine</code> querystring param (e.g. <code>&
combine=sectors_read,sectors_written</code>). |
| 22 <li>Use <code>stacked=true</code> to stack combined charts instead of overlaying
(default). |
| 23 </ul> |
| 24 </body> |
| 25 <script> |
| 26 google.load("visualization", "1", {packages:["corechart"]}); |
| 27 |
| 28 /** |
| 29 * @returns The querystring param value for |name| or an empty string. |
| 30 */ |
| 31 function getQuerystringParam(name) { |
| 32 name = name.replace(/[\[]/, "\\\[").replace(/[\]]/, "\\\]"); |
| 33 var regexS = "[\\?&]" + name + "=([^&#]*)"; |
| 34 var regex = new RegExp(regexS); |
| 35 var results = regex.exec(window.location.search); |
| 36 if (results == null) |
| 37 return ""; |
| 38 else |
| 39 return decodeURIComponent(results[1].replace(/\+/g, " ")); |
| 40 } |
| 41 |
| 42 /** |
| 43 * @returns An array of keys in |obj| sorted by value. |
| 44 */ |
| 45 function sortedKeys(obj) { |
| 46 var keys = []; |
| 47 for (var key in obj) { |
| 48 keys.push(key); |
| 49 } |
| 50 keys.sort(); |
| 51 return keys; |
| 52 } |
| 53 |
| 54 /** |
| 55 * Removes by value all params from array. |
| 56 */ |
| 57 Array.prototype.remove = function() { |
| 58 var what, a = arguments, l = a.length, ax; |
| 59 while (l && this.length) { |
| 60 what = a[--l]; |
| 61 while ((ax = this.indexOf(what)) != -1) { |
| 62 this.splice(ax, 1); |
| 63 } |
| 64 } |
| 65 return this; |
| 66 } |
| 67 |
| 68 /** |
| 69 * Displays a new chart. |
| 70 * |
| 71 * @param {Number} hz Number of sample per second of the data. |
| 72 * @param {String} name Name to display on top of chart. |
| 73 * @param {Number[][]} values Array of value arrays to display. |
| 74 * @param {Boolean} stacked Whether to display values as stacked. |
| 75 */ |
| 76 function displayChart(hz, name, values, units, stacked) { |
| 77 var data = new google.visualization.DataTable(); |
| 78 data.addColumn('number', 'ms'); |
| 79 var names = name.split(','); |
| 80 for (var i = 0; i < names.length; i++) { |
| 81 data.addColumn('number', names[i]); |
| 82 } |
| 83 |
| 84 var rows = []; |
| 85 var interval = 1000.0 / hz; |
| 86 for (var i = 0; i < values[0].length; i++) { |
| 87 var row = [i*interval]; |
| 88 for (var j = 0; j < values.length; j++) { |
| 89 row.push(values[j][i]); |
| 90 } |
| 91 rows.push(row); |
| 92 } |
| 93 data.addRows(rows); |
| 94 |
| 95 var options = { |
| 96 hAxis: {title: 'ms (' + hz + 'hz)'}, |
| 97 isStacked: stacked, |
| 98 legend: {position: 'top'}, |
| 99 vAxis: {title: units}, |
| 100 }; |
| 101 |
| 102 var elem = document.createElement('DIV'); |
| 103 elem.style = 'width:100%;height:500px'; |
| 104 document.body.appendChild(elem); |
| 105 var chart = new google.visualization.AreaChart(elem); |
| 106 chart.draw(data, options); |
| 107 } |
| 108 |
| 109 /** |
| 110 * Displays all charts. |
| 111 * |
| 112 * Invoked by the results script. JSONP is used to avoid security |
| 113 * restrictions on XHRs for file:// URLs. |
| 114 */ |
| 115 function display(hz, results, units) { |
| 116 var combine = getQuerystringParam('combine'); |
| 117 var keys = sortedKeys(results); |
| 118 for (var i = 0; i < keys.length; i++) { |
| 119 var key = keys[i]; |
| 120 var name = key; |
| 121 var values = [results[key]]; |
| 122 var unit = units[key]; |
| 123 if (combine.indexOf(key) >= 0) { |
| 124 i--; |
| 125 name = combine; |
| 126 values = []; |
| 127 var combined_keys = combine.split(','); |
| 128 for (var j = 0; j < combined_keys.length; j++) { |
| 129 values.push(results[combined_keys[j]]); |
| 130 keys.remove(combined_keys[j]); |
| 131 } |
| 132 } |
| 133 displayChart(hz, name, values, unit, !!getQuerystringParam('stacked')); |
| 134 } |
| 135 } |
| 136 |
| 137 var resultsPath = getQuerystringParam('results'); |
| 138 if (resultsPath) |
| 139 document.write("<script src='" + resultsPath + "'></"+"script>"); |
| 140 else |
| 141 document.write("Please specify results querystring param."); |
| 142 </script> |
| 143 </html> |
OLD | NEW |