xref: /OK3568_Linux_fs/yocto/scripts/lib/build_perf/html/measurement_chart.html (revision 4882a59341e53eb6f0b4789bf948001014eff981)
1*4882a593Smuzhiyun<script type="text/javascript">
2*4882a593Smuzhiyun  chartsDrawing += 1;
3*4882a593Smuzhiyun  google.charts.setOnLoadCallback(drawChart_{{ chart_elem_id }});
4*4882a593Smuzhiyun  function drawChart_{{ chart_elem_id }}() {
5*4882a593Smuzhiyun    var data = new google.visualization.DataTable();
6*4882a593Smuzhiyun
7*4882a593Smuzhiyun    // Chart options
8*4882a593Smuzhiyun    var options = {
9*4882a593Smuzhiyun      theme : 'material',
10*4882a593Smuzhiyun      legend: 'none',
11*4882a593Smuzhiyun      hAxis: { format: '', title: 'Commit number',
12*4882a593Smuzhiyun               minValue: {{ chart_opts.haxis.min }},
13*4882a593Smuzhiyun               maxValue: {{ chart_opts.haxis.max }} },
14*4882a593Smuzhiyun      {% if measurement.type == 'time' %}
15*4882a593Smuzhiyun      vAxis: { format: 'h:mm:ss' },
16*4882a593Smuzhiyun      {% else %}
17*4882a593Smuzhiyun      vAxis: { format: '' },
18*4882a593Smuzhiyun      {% endif %}
19*4882a593Smuzhiyun      pointSize: 5,
20*4882a593Smuzhiyun      chartArea: { left: 80, right: 15 },
21*4882a593Smuzhiyun    };
22*4882a593Smuzhiyun
23*4882a593Smuzhiyun    // Define data columns
24*4882a593Smuzhiyun    data.addColumn('number', 'Commit');
25*4882a593Smuzhiyun    data.addColumn('{{ measurement.value_type.gv_data_type }}',
26*4882a593Smuzhiyun                   '{{ measurement.value_type.quantity }}');
27*4882a593Smuzhiyun    // Add data rows
28*4882a593Smuzhiyun    data.addRows([
29*4882a593Smuzhiyun      {% for sample in measurement.samples %}
30*4882a593Smuzhiyun        [{{ sample.commit_num }}, {{ sample.mean.gv_value() }}],
31*4882a593Smuzhiyun      {% endfor %}
32*4882a593Smuzhiyun    ]);
33*4882a593Smuzhiyun
34*4882a593Smuzhiyun    // Finally, draw the chart
35*4882a593Smuzhiyun    chart_div = document.getElementById('{{ chart_elem_id }}');
36*4882a593Smuzhiyun    var chart = new google.visualization.LineChart(chart_div);
37*4882a593Smuzhiyun    google.visualization.events.addListener(chart, 'ready', function () {
38*4882a593Smuzhiyun      //chart_div = document.getElementById('{{ chart_elem_id }}');
39*4882a593Smuzhiyun      //chart_div.innerHTML = '<img src="' + chart.getImageURI() + '">';
40*4882a593Smuzhiyun      png_div = document.getElementById('{{ chart_elem_id }}_png');
41*4882a593Smuzhiyun      png_div.outerHTML = '<a id="{{ chart_elem_id }}_png" href="' + chart.getImageURI() + '">PNG</a>';
42*4882a593Smuzhiyun      console.log("CHART READY: {{ chart_elem_id }}");
43*4882a593Smuzhiyun      chartsDrawing -= 1;
44*4882a593Smuzhiyun      if (chartsDrawing == 0)
45*4882a593Smuzhiyun        console.log("ALL CHARTS READY");
46*4882a593Smuzhiyun    });
47*4882a593Smuzhiyun    chart.draw(data, options);
48*4882a593Smuzhiyun}
49*4882a593Smuzhiyun</script>
50*4882a593Smuzhiyun
51