mirror of
https://github.com/ail-project/ail-framework.git
synced 2024-11-10 08:38:28 +00:00
Added show/hide curve with legend in terms-top-set.
This commit is contained in:
parent
e56187eb7e
commit
e12244fb53
1 changed files with 28 additions and 9 deletions
|
@ -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>
|
||||||
|
|
Loading…
Reference in a new issue