|
|
Line 926: |
Line 926: |
| === CPU Load Measurements === | | === CPU Load Measurements === |
|
| |
|
| <html>
| |
| <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
| |
|
| |
|
| <style>
| |
| .button {
| |
| background-color: #008CBA;
| |
| border: none;
| |
| color: white;
| |
| padding: 15px 32px;
| |
| text-align: center;
| |
| text-decoration: none;
| |
| display: inline-block;
| |
| font-size: 16px;
| |
| margin: 4px 2px;
| |
| cursor: pointer;
| |
| }
| |
| </style>
| |
|
| |
| <div id="Buttons_Model_Onnxrt_Fps" style="margin: auto; width: 1300px; height: auto;">
| |
| <button class="button" id="show_inceptionv1_onnxrt_cpu">Show InceptionV1 </button>
| |
| <button class="button" id="show_inceptionv2_onnxrt_cpu">Show InceptionV2 </button>
| |
| <button class="button" id="show_inceptionv3_onnxrt_cpu">Show InceptionV3 </button>
| |
| <button class="button" id="show_inceptionv4_onnxrt_cpu">Show InceptionV4 </button>
| |
| <button class="button" id="show_tinyyolov2_onnxrt_cpu">Show TinyYoloV2 </button>
| |
| <button class="button" id="show_tinyyolov3_onnxrt_cpu">Show TinyYoloV3 </button>
| |
| </div>
| |
| <br><br>
| |
| <div id="chart_onnxrt_cpu" style="margin: auto; width: 800px; height: 500px;"></div>
| |
| <br><br>
| |
| <div id="Buttons_Backend" style="margin: auto; width: 600px; height: auto;">
| |
| <button class="button" id="show_onnxrt_cpu">Show ONNXRT </button>
| |
| </div>
| |
| <div id="chart_onnxrt1_cpu" style="margin: auto; width: 800px; height: 500px;"></div>
| |
| <br><br>
| |
|
| |
| <script>
| |
| google.charts.load('current', {'packages':['corechart', 'bar']});
| |
| google.charts.setOnLoadCallback(drawStuffFpsOnnxrt);
| |
|
| |
| function drawStuffFpsOnnxrt() {
| |
|
| |
| var onnxrt_chartDiv_cpu = document.getElementById('chart_onnxrt_cpu');
| |
| var onnxrt_chartDiv1_cpu = document.getElementById('chart_onnxrt1_cpu');
| |
|
| |
| var table_backend_platform_onnxrt_cpu = google.visualization.arrayToDataTable([
| |
| ['Platform', //Column 0
| |
| 'InceptionV1 \n ONNXRT', //Column 1
| |
| 'InceptionV2 \n ONNXRT', //Column 2
| |
| 'InceptionV3 \n ONNXRT', //Column 3
| |
| 'InceptionV4 \n ONNXRT', //Column 4
| |
| 'TinyYoloV2 \n ONNXRT', //Column 5
| |
| 'TinyYoloV3 \n ONNXRT'], //Column 6
| |
| ['x86', 94.6, 100, 95.2, 88.8, 94, 91.4]
| |
| ]);
| |
| var table_model_platform_onnxrt_cpu = google.visualization.arrayToDataTable([
| |
| ['Model', //Column 0
| |
| 'ONNXRT \n x86'], //Column 1
| |
| ['InceptionV1', 94.6], //row 1
| |
| ['InceptionV2', 100], //row 2
| |
| ['InceptionV3', 95.2], //row 3
| |
| ['InceptionV4', 88.8], //row 4
| |
| ['TinyYoloV2', 94], //row 5
| |
| ['TinyYoloV3', 91.4] //row 6
| |
| ]);
| |
| var onnxrt_materialOptions_cpu = {
| |
| width: 320,
| |
| chart: {
| |
| title: 'Backend Vs Platform per model',
| |
| },
| |
| series: {
| |
| },
| |
| axes: {
| |
| y: {
| |
| distance: {side: 'left',label: 'FPS'}, // Left y-axis.
| |
| }
| |
| }
| |
| };
| |
| var onnxrt_materialOptions1_cpu = {
| |
| width: 900,
| |
| chart: {
| |
| title: 'Model Vs Platform per backend',
| |
| },
| |
| series: {
| |
| },
| |
| axes: {
| |
| y: {
| |
| distance: {side: 'left',label: 'FPS'}, // Left y-axis.
| |
| }
| |
| }
| |
| };
| |
|
| |
| var materialChart_onnxrt_cpu = new google.charts.Bar(onnxrt_chartDiv_cpu);
| |
| var materialChart_onnxrt_cpu1 = new google.charts.Bar(onnxrt_chartDiv1_cpu);
| |
| view_onnxrt_cpu = new google.visualization.DataView(table_backend_platform_onnxrt_cpu);
| |
| view_onnxrt_cpu1 = new google.visualization.DataView(table_model_platform_onnxrt_cpu);
| |
|
| |
| function drawMaterialChart() {
| |
| var materialChart_onnxrt_cpu = new google.charts.Bar(onnxrt_chartDiv_cpu);
| |
| var materialChart_onnxrt_cpu1 = new google.charts.Bar(onnxrt_chartDiv1_cpu);
| |
| materialChart_onnxrt_cpu.draw(table_backend_platform_onnxrt_cpu, google.charts.Bar.convertOptions(onnxrt_materialOptions_cpu));
| |
| materialChart_onnxrt_cpu1.draw(table_model_platform_onnxrt_cpu, google.charts.Bar.convertOptions(onnxrt_materialOptions1_cpu));
| |
|
| |
| init_charts();
| |
| }
| |
| function init_charts(){
| |
| view_onnxrt_cpu.setColumns([0,1]);
| |
| view_onnxrt_cpu.hideColumns([2, 3, 4, 5, 6]);
| |
| materialChart_onnxrt_cpu.draw(view_onnxrt_cpu, onnxrt_materialOptions_cpu);
| |
| view_onnxrt_cpu1.setColumns([0,1]);
| |
| materialChart_onnxrt_fps1.draw(view_onnxrt_cpu1, onnxrt_materialOptions1_cpu);
| |
| }
| |
|
| |
| // REF_MODEL
| |
| /*Select the Model that you want to show in the chart*/
| |
| var show_inceptionv1_onnxrt_cpu = document.getElementById('show_inceptionv1_onnxrt_cpu');
| |
| show_inceptionv1_onnxrt_cpu.onclick = function () {
| |
| view_onnxrt_cpu.setColumns([0,1]);
| |
| view_onnxrt_cpu.hideColumns([2, 3, 4, 5, 6]);
| |
| materialChart_onnxrt_cpu.draw(view_onnxrt_cpu, onnxrt_materialOptions_cpu);
| |
| }
| |
| var show_inceptionv2_onnxrt_cpu = document.getElementById('show_inceptionv2_onnxrt_cpu');
| |
| show_inceptionv2_onnxrt_cpu.onclick = function () {
| |
| view_onnxrt_cpu.setColumns([0,2]);
| |
| view_onnxrt_cpu.hideColumns([1, 3, 4, 5, 6]);
| |
| materialChart_onnxrt_cpu.draw(view_onnxrt_cpu, onnxrt_materialOptions_cpu);
| |
| }
| |
| var show_inceptionv3_onnxrt_cpu = document.getElementById('show_inceptionv3_onnxrt_cpu');
| |
| show_inceptionv3_onnxrt_cpu.onclick = function () {
| |
| view_onnxrt_cpu.setColumns([0,3]);
| |
| view_onnxrt_cpu.hideColumns([1, 2, 4, 5, 6]);
| |
| materialChart_onnxrt_cpu.draw(view_onnxrt_cpu, onnxrt_materialOptions_cpu);
| |
| }
| |
| var show_inceptionv4_onnxrt_cpu = document.getElementById('show_inceptionv4_onnxrt_cpu');
| |
| show_inceptionv4_onnxrt_cpu.onclick = function () {
| |
| view_onnxrt_cpu.setColumns([0,4]);
| |
| view_onnxrt_cpu.hideColumns([1, 2, 3, 5, 6]);
| |
| materialChart_onnxrt_cpu.draw(view_onnxrt_cpu, onnxrt_materialOptions_cpu);
| |
| }
| |
| var show_tinyyolov2_onnxrt_cpu = document.getElementById('show_tinyyolov2_onnxrt_cpu');
| |
| show_tinyyolov2_onnxrt_cpu.onclick = function () {
| |
| view_onnxrt_cpu.setColumns([0,5]);
| |
| view_onnxrt_cpu.hideColumns([1, 2, 3, 4, 6]);
| |
| materialChart_onnxrt_cpu.draw(view_onnxrt_cpu, onnxrt_materialOptions_cpu);
| |
| }
| |
| var show_tinyyolov3_onnxrt_cpu = document.getElementById('show_tinyyolov3_onnxrt_cpu');
| |
| show_tinyyolov3_onnxrt_cpu.onclick = function () {
| |
| view_onnxrt_cpu.setColumns([0,6]);
| |
| view_onnxrt_cpu.hideColumns([1, 2, 3, 4, 5]);
| |
| materialChart_onnxrt_cpu.draw(view_onnxrt_cpu, onnxrt_materialOptions_cpu);
| |
| }
| |
|
| |
| drawMaterialChart();
| |
| };
| |
| </script>
| |
|
| |
| </html>
| |
|
| |
|
| === Test benchmark video === | | === Test benchmark video === |