| <html> |
| |
| <!-- |
| Copyright (c) 2012 The Chromium Authors. All rights reserved. |
| Use of this source code is governed by a BSD-style license that can be |
| found in the LICENSE file. |
| --> |
| |
| <!-- |
| Display platform comparison by channel and graph. |
| --> |
| |
| <head> |
| |
| <style type="text/css"> |
| body { |
| font-family: sans-serif; |
| } |
| div.plot { |
| cursor: pointer; |
| } |
| div.switcher * { |
| border: 1px solid black; |
| border-radius: 4px 4px 0 0; |
| padding-left: 0.5em; |
| padding-right: 0.5em; |
| } |
| div.switcher .select { |
| background: #ddd; |
| cursor: pointer; |
| } |
| canvas.plot { |
| border: 1px solid black; |
| cursor: pointer; |
| } |
| div.plot-coordinates { |
| font-family: monospace; |
| } |
| iframe.detail { |
| display: none; |
| width: 100%; |
| height: 100%; |
| border: none; |
| } |
| div.selector { |
| border: solid 1px black; |
| cursor: pointer; |
| padding-left: 0.3em; |
| background-color: white; |
| } |
| div.selector:hover { |
| background-color: rgb(200,200,250); |
| } |
| div.selected { |
| border-left: none; |
| } |
| div.selectors { |
| width: 80px; |
| display: none; |
| } |
| #explain { |
| font-size: 0.75em; |
| font-style: italic; |
| color: rgb(100,100,100); |
| } |
| </style> |
| |
| <title>Chrome Perf Platform Comparison</title> |
| <script src="chrome_config.js"></script> |
| <script src="ui/js/common.js"></script> |
| <script src="ui/js/plotter.js"></script> |
| <script src="ui/js/coordinates.js"></script> |
| <script src="ui/js/graph.js"></script> |
| |
| <script> |
| |
| var params = ParseParams(); |
| |
| function init() { |
| if (!params['test'] || !params['platforms'] || !params['channel'] || |
| !params['graph']) |
| return; |
| |
| // Fetch list of path to graphs.dat. |
| var testName = params['test']; |
| var platforms = params['platforms'].split(','); |
| var graphFiles = []; |
| var graphPaths = []; |
| for (var i = 0; i < platforms.length; i++) { |
| for (var system in ChromeConfig.systemTitles) { |
| if (platforms[i] == ChromeConfig.systemTitles[system]) { |
| var path = '../' + system + '/' + testName; |
| graphFiles.push(path + '/' + 'graphs.dat'); |
| var p = { |
| path: path, |
| machine: platforms[i], |
| } |
| graphPaths.push(p); |
| } |
| } |
| } |
| new FetchList(graphFiles, onGraphListReceived, graphPaths); |
| } |
| |
| function onGraphListReceived(data, graphPaths) { |
| // Select graph from graph list. |
| var toBeGraphedList = []; |
| for (var i = 0; i < data.length; i++) { |
| var graphList = JsonToJs(data[i]); |
| if (graphList) { |
| for (var j = 0; j < graphList.length; j++) { |
| if (graphList[j].name == params['graph']) { |
| var gList = graphList[j]; |
| gList.loc = graphPaths[i].path + '/' + params['graph'] + |
| '-summary.dat'; |
| gList.machine = cleanId(graphPaths[i].machine); |
| toBeGraphedList.push(gList); |
| break; |
| } |
| } |
| } |
| } |
| |
| var options = { |
| channels: [params['channel']], |
| showDetail: false, |
| showTabs: false, |
| orderDataByVersion: true, |
| enableMouseScroll: true, |
| }; |
| var graph = new Graph('output', toBeGraphedList, options) |
| graph.setTitle('<h3>' + ChromeConfig.testTitles[params['test']] + ': ' + |
| params['graph'] + '</h3>'); |
| graph.graph(); |
| } |
| |
| function cleanId(str) { |
| return str.replace(/\s/g, '_').toLowerCase(); |
| } |
| |
| function reportError(error) { |
| document.getElementById('output').innerHTML = "<p>" + error + "</p>"; |
| } |
| |
| window.addEventListener('load', init, false); |
| </script> |
| </head> |
| <body> |
| <br /> |
| <center> |
| <h2>Chrome Perf Platform Comparison</h2> |
| </center> |
| <div id="explain"> |
| The vertical axis is measured values, and the horizontal |
| axis is the version number for the build being tested. |
| Shift-click to place baseline. Shift-scroll to zoom slowly. |
| </div> |
| <p></p> |
| <div id="output"></div> |
| <pre id="log"></pre> |
| </body> |
| </html> |