| <html> |
| |
| <head> |
| <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script> |
| <script type="text/javascript"> |
| google.charts.load('current', { 'packages': ['corechart'] }); |
| google.charts.setOnLoadCallback(loaded); |
| |
| function drawChart() { |
| var useLogarithmic = document.getElementById('chartLog').checked; |
| try { |
| var benchmarkdata = JSON.parse(document.getElementById('jsondata').value); |
| } |
| catch (e) { |
| document.getElementById('chart_div').innerHTML = "BAD JSON #0!" + e.message; |
| return; |
| } |
| var data = new google.visualization.DataTable(); |
| data.addColumn('string', 'Phase'); |
| |
| var countBenchmarks = benchmarkdata.benchmarkers.length; |
| for (var i = 0; i < countBenchmarks; i++) { |
| data.addColumn('number', 'Run #' + (i + 1)); |
| } |
| |
| var phaseCount = benchmarkdata.benchmarkers[0].phases.length; |
| for (var i = 0; i < countBenchmarks; i++) { |
| if (benchmarkdata.benchmarkers[i].phases.length != phaseCount) { |
| document.getElementById('chart_div').innerHTML = "BAD JSON #1!"; |
| return; |
| } |
| } |
| |
| for (var j = 0; j < phaseCount; j++) { |
| var rowArray = []; |
| rowArray.push(benchmarkdata.benchmarkers[0].phases[j].phase); |
| for (var i = 0; i < countBenchmarks; i++) { |
| rowArray.push(benchmarkdata.benchmarkers[i].phases[j].runtime); |
| if (benchmarkdata.benchmarkers[i].phases[j].phase != rowArray[0]) { |
| document.getElementById('chart_div').innerHTML = "BAD JSON #2!"; |
| return; |
| } |
| } |
| data.addRow(rowArray); |
| } |
| |
| if (useLogarithmic) { |
| var options = { |
| vAxis: { |
| scaleType: 'log' |
| } |
| }; |
| } else { |
| var options = {}; |
| } |
| |
| var chart = new google.visualization.ColumnChart(document.getElementById('chart_div')); |
| chart.draw(data, options); |
| } |
| |
| function loaded() { |
| document.getElementById('chartitbutton').disabled = false; |
| } |
| </script> |
| </head> |
| |
| <body> |
| <textarea id="jsondata" rows="20" cols="80"></textarea> |
| <br /> |
| <input type="checkbox" id="chartLog"> |
| <label for="chartLog"> Use logarithmic scale</label> |
| <br /> |
| |
| <button id="chartitbutton" onclick="drawChart()" disabled>Chart it!</button> |
| <div id="chart_div" style="width:1200; height:900"></div> |
| </body> |
| |
| </html> |
