WARNING! Access to this system is limited to authorised users only.
Unauthorised users may be subject to prosecution.
Unauthorised access to this system is a criminal offence under Australian law (Federal Crimes Act 1914 Part VIA)
It is a criminal offence to:
(1) Obtain access to data without authority. -Penalty 2 years imprisonment.
(2) Damage, delete, alter or insert data without authority. -Penalty 10 years imprisonment.
User activity is monitored and recorded. Anyone using this system expressly consents to such monitoring and recording.

Commit 256bc940 authored by Zixian Cai's avatar Zixian Cai
Browse files

Implement boxplot and barplot properly

parent d806d35b
{% extends 'base.html' %}
{% macro responsive_header(elementID) -%}
(function () {
var d3 = Plotly.d3;
var WIDTH_IN_PERCENT_OF_PARENT = 100,
HEIGHT_IN_PERCENT_OF_PARENT = 100;
var gd3 = d3.select('#{{ elementID }}')
.style({
width: WIDTH_IN_PERCENT_OF_PARENT + '%',
'margin-left': (100 - WIDTH_IN_PERCENT_OF_PARENT) / 2 + '%',
height: HEIGHT_IN_PERCENT_OF_PARENT + 'vh',
'margin-top': (100 - HEIGHT_IN_PERCENT_OF_PARENT) / 2 + 'vh'
});
var gd = gd3.node();
window.addEventListener("resize", function () {Plotly.Plots.resize(gd);});
{%- endmacro %}
{% macro responsive_footer() -%}
})();
{%- endmacro %}
{% block body %}
<div class="panel panel-info">
<div class="panel-heading">Platform information</div>
......@@ -23,56 +45,68 @@
<code>{{ ts["callback"]["param"] }}</code>
</li>
</ul>
<div id="plot_ts_{{ ts["name"] }}"></div>
<div id="barplot_ts_{{ ts["name"] }}"></div>
<div id="boxplot_ts_{{ ts["name"] }}"></div>
</div>
</div>
<script>
(function () {
var d3 = Plotly.d3;
var WIDTH_IN_PERCENT_OF_PARENT = 100,
HEIGHT_IN_PERCENT_OF_PARENT = 100;
var gd3 = d3.select('#plot_ts_{{ ts["name"] }}')
.style({
width: WIDTH_IN_PERCENT_OF_PARENT + '%',
'margin-left': (100 - WIDTH_IN_PERCENT_OF_PARENT) / 2 + '%',
{{ responsive_header("barplot_ts_"+ts["name"]) }}
var data = [];
{% for metric in ts["metrics"] %}
var temp_x = [];
var temp_y = [];
var temp_yerr = [];
height: HEIGHT_IN_PERCENT_OF_PARENT + 'vh',
'margin-top': (100 - HEIGHT_IN_PERCENT_OF_PARENT) / 2 + 'vh'
});
var gd = gd3.node();
var data = [];
{% for metric in ts["metrics"] %}
var temp_x = [];
var temp_y = [];
var temp_yerr = [];
{% for task in ts["datapoints_grouped"] %}
temp_x.push("{{ task }}");
temp_y.push({{ ts["datapoints_grouped"][task][metric].mean }});
temp_yerr.push({{ ts["datapoints_grouped"][task][metric].std }});
{% endfor %}
var trace_{{ metric }} = {
x: temp_x,
y: temp_y,
name: '{{ metric }}',
error_y: {
type: 'data',
array: temp_yerr,
visible: true
},
type: 'bar'
};
data.push(trace_{{ metric }});
{% for task in ts["datapoints_grouped"] %}
temp_x.push("{{ task }}");
temp_y.push({{ ts["datapoints_grouped"][task][metric].mean }});
temp_yerr.push({{ ts["datapoints_grouped"][task][metric].std }});
{% endfor %}
var trace_{{ metric }} = {
x: temp_x,
y: temp_y,
name: '{{ metric }}',
error_y: {
type: 'data',
array: temp_yerr,
visible: true
},
type: 'bar'
};
data.push(trace_{{ metric }});
{% endfor %}
var layout = {barmode: 'group'};
Plotly.newPlot('barplot_ts_{{ ts["name"] }}', data, layout);
{{ responsive_footer() }}
</script>
<script>
{{ responsive_header("boxplot_ts_"+ts["name"]) }}
var data = [];
{% for metric in ts["metrics"] %}
var temp_x = [];
var temp_y = [];
{% for task in ts["datapoints_grouped"] %}
var rawArr = {{ ts["datapoints_grouped"][task][metric].raw }};
rawArr.forEach(
function (val) {
temp_x.push("{{ task }}");
temp_y.push(val);
}
);
{% endfor %}
var layout = {barmode: 'group'};
Plotly.newPlot('plot_ts_{{ ts["name"] }}', data, layout);
window.onresize = function () {
Plotly.Plots.resize(gd);
var trace_{{ metric }} = {
x: temp_x,
y: temp_y,
name: '{{ metric }}',
type: 'box'
};
})();
data.push(trace_{{ metric }});
{% endfor %}
var layout = {
boxmode: 'group'
};
Plotly.newPlot('boxplot_ts_{{ ts["name"] }}', data, layout);
{{ responsive_footer() }}
</script>
{% endfor %}
{% endblock %}
\ No newline at end of file
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment