AIL/ail-framework
7
0
Fork 0
mirror of https://github.com/ail-project/ail-framework.git synced 2024-09-20 07:58:29 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

Added show/hide curve with legend in terms-top-set.

Browse source
This commit is contained in:
Mokaddem 2016-08-23 15:39:13 +02:00
parent e56187eb7e
commit e12244fb53
1 changed files with 28 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

27
var/www/templates/terms_plot_top.html
View file

@ -304,7 +304,10 @@ var graph_options = {
}, },
legend: { show: true, legend: { show: true,
noColumns: 1, noColumns: 1,
position: "nw" position: "nw",
labelFormatter: function(label, series) {
return "<a href=\"#\" onClick=\"hide_or_show2("+series.idx+", "+series.graphNum+"); return false;\" >" + label + "</a>";
}
}, },
xaxis: { xaxis: {
mode: "time", mode: "time",
@ -353,12 +356,13 @@ promises.push($.getJSON("{{ url_for('terms_plot_top_data') }}", { set: set_today
if (i>=default_num_curves) { if (i>=default_num_curves) {
unchecked_label.push(data[i][0]); unchecked_label.push(data[i][0]);
} }
to_plot.push({ data: curr_data, label: data[i][0]}); to_plot.push({ data: curr_data, label: data[i][0], idx: i});
if ( i < (data.length/2)) if ( i < (data.length/2))
table_today.append("<tr"+highlight+"><td>"+data[i][0]+"</td><td>"+data[i][2]+"</td><td>"+addbuttons(data[i][0])+"</td><td>"+addcheckbox("today", data[i][0], i<default_num_curves)+"</td><td>"+data[i][3].week+", "+data[i][3].month+"</td></tr>"); table_today.append("<tr"+highlight+"><td>"+data[i][0]+"</td><td>"+data[i][2]+"</td><td>"+addbuttons(data[i][0])+"</td><td>"+addcheckbox("today", data[i][0], i<default_num_curves)+"</td><td>"+data[i][3].week+", "+data[i][3].month+"</td></tr>");
else else
table_today2.append("<tr"+highlight+"><td>"+data[i][0]+"</td><td>"+data[i][2]+"</td><td>"+addbuttons(data[i][0])+"</td><td>"+addcheckbox("today", data[i][0], i<default_num_curves)+"</td><td>"+data[i][3].week+", "+data[i][3].month+"</td></tr>"); table_today2.append("<tr"+highlight+"><td>"+data[i][0]+"</td><td>"+data[i][2]+"</td><td>"+addbuttons(data[i][0])+"</td><td>"+addcheckbox("today", data[i][0], i<default_num_curves)+"</td><td>"+data[i][3].week+", "+data[i][3].month+"</td></tr>");
} }
graph_options.series.graphNum=1;
plot_today = $.plot($("#graph-today"), to_plot, graph_options); plot_today = $.plot($("#graph-today"), to_plot, graph_options);
hide_unchecked_curves(plot_today, unchecked_label); hide_unchecked_curves(plot_today, unchecked_label);
$("#graph-today").bind("plothover", function (event, pos, item) { $("#graph-today").bind("plothover", function (event, pos, item) {
@ -393,12 +397,13 @@ promises.push($.getJSON("{{ url_for('terms_plot_top_data') }}", { set: set_week,
if (i>=default_num_curves) { if (i>=default_num_curves) {
unchecked_label.push(data[i][0]); unchecked_label.push(data[i][0]);
} }
to_plot.push({ data: curr_data, label: data[i][0]}); to_plot.push({ data: curr_data, label: data[i][0], idx: i});
if ( i < (data.length/2)) if ( i < (data.length/2))
table.append("<tr"+highlight+"><td>"+data[i][0]+"</td><td>"+data[i][2]+"</td><td>"+addbuttons(data[i][0])+"</td><td>"+addcheckbox("week", data[i][0], i<default_num_curves)+"</td><td><strong>"+data[i][3].day+"</strong>, "+data[i][3].month+"</td></tr>"); table.append("<tr"+highlight+"><td>"+data[i][0]+"</td><td>"+data[i][2]+"</td><td>"+addbuttons(data[i][0])+"</td><td>"+addcheckbox("week", data[i][0], i<default_num_curves)+"</td><td><strong>"+data[i][3].day+"</strong>, "+data[i][3].month+"</td></tr>");
else else
table2.append("<tr"+highlight+"><td>"+data[i][0]+"</td><td>"+data[i][2]+"</td><td>"+addbuttons(data[i][0])+"</td><td>"+addcheckbox("week", data[i][0], i<default_num_curves)+"</td><td><strong>"+data[i][3].day+"</strong>, "+data[i][3].month+"</td></tr>"); table2.append("<tr"+highlight+"><td>"+data[i][0]+"</td><td>"+data[i][2]+"</td><td>"+addbuttons(data[i][0])+"</td><td>"+addcheckbox("week", data[i][0], i<default_num_curves)+"</td><td><strong>"+data[i][3].day+"</strong>, "+data[i][3].month+"</td></tr>");
} }
graph_options.series.graphNum=2;
plot_week = $.plot($("#graph-week"), to_plot, graph_options); plot_week = $.plot($("#graph-week"), to_plot, graph_options);
hide_unchecked_curves(plot_week, unchecked_label); hide_unchecked_curves(plot_week, unchecked_label);
$("#graph-week").bind("plothover", function (event, pos, item) { $("#graph-week").bind("plothover", function (event, pos, item) {
@ -432,12 +437,13 @@ promises.push($.getJSON("{{ url_for('terms_plot_top_data') }}", { set: set_month
if (i>=default_num_curves) { if (i>=default_num_curves) {
unchecked_label.push(data[i][0]); unchecked_label.push(data[i][0]);
} }
to_plot.push({ data: curr_data, label: data[i][0]}); to_plot.push({ data: curr_data, label: data[i][0], idx: i});
if ( i < (data.length/2)) if ( i < (data.length/2))
table.append("<tr"+highlight+"><td>"+data[i][0]+"</td><td>"+data[i][2]+"</td><td>"+addbuttons(data[i][0])+"</td><td>"+addcheckbox("month", data[i][0], i<default_num_curves)+"</td><td><strong>"+data[i][3].day+"</strong>, "+data[i][3].week+"</td></tr>"); table.append("<tr"+highlight+"><td>"+data[i][0]+"</td><td>"+data[i][2]+"</td><td>"+addbuttons(data[i][0])+"</td><td>"+addcheckbox("month", data[i][0], i<default_num_curves)+"</td><td><strong>"+data[i][3].day+"</strong>, "+data[i][3].week+"</td></tr>");
else else
table2.append("<tr"+highlight+"><td>"+data[i][0]+"</td><td>"+data[i][2]+"</td><td>"+addbuttons(data[i][0])+"</td><td>"+addcheckbox("month", data[i][0], i<default_num_curves)+"</td><td><strong>"+data[i][3].day+"</strong>, "+data[i][3].week+"</td></tr>"); table2.append("<tr"+highlight+"><td>"+data[i][0]+"</td><td>"+data[i][2]+"</td><td>"+addbuttons(data[i][0])+"</td><td>"+addcheckbox("month", data[i][0], i<default_num_curves)+"</td><td><strong>"+data[i][3].day+"</strong>, "+data[i][3].week+"</td></tr>");
} }
graph_options.series.graphNum=3;
plot_month = $.plot($("#graph-month"), to_plot, graph_options); plot_month = $.plot($("#graph-month"), to_plot, graph_options);
hide_unchecked_curves(plot_month, unchecked_label); hide_unchecked_curves(plot_month, unchecked_label);
$("#graph-month").bind("plothover", function (event, pos, item) { $("#graph-month").bind("plothover", function (event, pos, item) {
@ -551,6 +557,19 @@ function hide_or_show() {
// graph, hide curve // graph, hide curve
} }
function hide_or_show2(index, graphNum) {
if (graphNum == 1)
var plot = plot_today;
else if (graphNum == 2)
var plot = plot_week;
else if (graphNum == 3)
var plot = plot_month;
var graphData = plot.getData();
graphData[index].lines.show = !graphData[index].lines.show;
plot.setData(graphData);
plot.draw();
}
</script> </script>
</body> </body>