| OLD | NEW |
| (Empty) |
| 1 <html> | |
| 2 <!-- | |
| 3 Copyright (c) 2011 The WebRTC project authors. All Rights Reserved. | |
| 4 | |
| 5 Use of this source code is governed by a BSD-style license | |
| 6 that can be found in the LICENSE file in the root of the source | |
| 7 tree. An additional intellectual property rights grant can be found | |
| 8 in the file PATENTS. All contributing project authors may | |
| 9 be found in the AUTHORS file in the root of the source tree. | |
| 10 | |
| 11 Template file to be used to generate Charts for Video Quality Metrics. | |
| 12 --> | |
| 13 <head> | |
| 14 <link href="http://code.google.com/css/codesite.pack.04102009.css" | |
| 15 rel="stylesheet" type="text/css" /> | |
| 16 </head> | |
| 17 <script src="https://www.google.com/jsapi" type="text/javascript"></script> | |
| 18 <script> | |
| 19 google.load('visualization', '1', {packages:['table', 'corechart']}); | |
| 20 | |
| 21 google.setOnLoadCallback(drawTable); | |
| 22 function drawTable() { | |
| 23 /* Build data tables and views */ | |
| 24 var configurations_data_table = | |
| 25 new google.visualization.DataTable(%(json_configurations)s); | |
| 26 var ssim_data_table = | |
| 27 new google.visualization.DataTable(%(json_ssim_data)s); | |
| 28 var psnr_data_table = | |
| 29 new google.visualization.DataTable(%(json_psnr_data)s); | |
| 30 var packet_loss_data_table = | |
| 31 new google.visualization.DataTable(%(json_packet_loss_data)s); | |
| 32 var bit_rate_data_table = | |
| 33 new google.visualization.DataTable(%(json_bit_rate_data)s); | |
| 34 | |
| 35 /* Display tables and charts */ | |
| 36 var configurations_table = new google.visualization.Table( | |
| 37 document.getElementById('table_div_configurations')); | |
| 38 configurations_table.draw(configurations_data_table, { | |
| 39 height: 200 | |
| 40 }); | |
| 41 | |
| 42 var ssim_chart = new google.visualization.LineChart( | |
| 43 document.getElementById('table_div_ssim')); | |
| 44 ssim_chart.draw(ssim_data_table, { | |
| 45 colors: ['blue', 'red', 'lightblue', 'pink'], | |
| 46 vAxis: {title: 'SSIM'}, | |
| 47 hAxis: {title: 'Frame'}, | |
| 48 width: 1200, height: 300, | |
| 49 }); | |
| 50 | |
| 51 var psnr_chart = new google.visualization.LineChart( | |
| 52 document.getElementById('table_div_psnr')); | |
| 53 psnr_chart.draw(psnr_data_table, { | |
| 54 colors: ['blue', 'red', 'lightblue', 'pink'], | |
| 55 vAxis: {title: 'PSNR (dB)'}, | |
| 56 hAxis: {title: 'Frame'}, | |
| 57 width: 1200, height: 300, | |
| 58 }); | |
| 59 | |
| 60 var packet_loss_chart = new google.visualization.LineChart( | |
| 61 document.getElementById('table_div_packet_loss')); | |
| 62 packet_loss_chart.draw(packet_loss_data_table, { | |
| 63 colors: ['blue', 'red', 'lightblue', 'pink'], | |
| 64 vAxis: {title: 'Packets dropped'}, | |
| 65 hAxis: {title: 'Frame'}, | |
| 66 width: 1200, height: 300, | |
| 67 }); | |
| 68 | |
| 69 var bit_rate_chart = new google.visualization.LineChart( | |
| 70 document.getElementById('table_div_bit_rate')); | |
| 71 bit_rate_chart.draw(bit_rate_data_table, { | |
| 72 colors: ['blue', 'red', 'lightblue', 'pink', 'green'], | |
| 73 vAxis: {title: 'Bit rate'}, | |
| 74 hAxis: {title: 'Frame'}, | |
| 75 width: 1200, height: 300, | |
| 76 }); | |
| 77 } | |
| 78 </script> | |
| 79 <body> | |
| 80 <h3>Test Configurations:</h3> | |
| 81 <div id="table_div_configurations"></div> | |
| 82 <h3>Messages:</h3> | |
| 83 <pre>%(messages)s</pre> | |
| 84 <h3>Metrics measured per frame:</h3> | |
| 85 <div id="table_div_ssim"></div> | |
| 86 <div id="table_div_psnr"></div> | |
| 87 <div id="table_div_packet_loss"></div> | |
| 88 <div id="table_div_bit_rate"></div> | |
| 89 </body> | |
| 90 </html> | |
| OLD | NEW |