AIL/ail-framework
7
0
Fork 0
mirror of https://github.com/ail-project/ail-framework.git synced 2024-11-14 02:28:23 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Started plotting same data with different dates

Browse source
This commit is contained in:
Mokaddem 2016-11-25 16:42:22 +01:00
parent 5d269ea1ee
commit 84dcd5586f
2 changed files with 31 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
var/www/Flask_server.py
View file

@ -771,6 +771,7 @@ def terms_plot_tool_data():
value = r_serv_term.hget(timestamp, term) value = r_serv_term.hget(timestamp, term)
curr_value_range = int(value) if value is not None else 0 curr_value_range = int(value) if value is not None else 0
value_range.append([timestamp, curr_value_range]) value_range.append([timestamp, curr_value_range])
value_range.insert(0,term)
return jsonify(value_range) return jsonify(value_range)

36
var/www/templates/terms_plot_tool.html
View file

@ -72,7 +72,7 @@
</div> </div>
<div class="panel-body"> <div class="panel-body">
<div aria-disabled="false" class="slider sliderRange sliderBlue ui-slider ui-slider-horizontal ui-widget ui-widget-content ui-corner-all" style="margin-bottom: 5px;"></div> <div aria-disabled="false" class="slider sliderRange sliderBlue ui-slider ui-slider-horizontal ui-widget ui-widget-content ui-corner-all" style="margin-bottom: 5px;"></div>
<strong>Date:</strong> <input type="text" id="amount" readonly style="border:0; color:#f6931f; font-weight:bold;"> <strong>Date:</strong> <input type="text" id="amount" readonly style="border:0; color:#f6931f; font-weight:bold;"> <button id="plot-month" onclick="replot(100);" class="btn btn-info" style="float: right;">Plot current terms for a month</button>
<div class="form-group input-group" style="margin-top: 30px;"> <div class="form-group input-group" style="margin-top: 30px;">
<span class="input-group-addon"><span class="glyphicon glyphicon-stats"></span></span> <span class="input-group-addon"><span class="glyphicon glyphicon-stats"></span></span>
@ -168,6 +168,7 @@
<script> <script>
var plot; var plot;
var graph_data = []; var graph_data = [];
var plotted_terms = [];
var graph_options = { var graph_options = {
series: { series: {
lines: { lines: {
@ -198,6 +199,7 @@ function plotData() {
$('#plot-btn-add').show("fast"); $('#plot-btn-add').show("fast");
var curthis = $(this); var curthis = $(this);
var term = $('#TermInput').val(); var term = $('#TermInput').val();
plotted_terms = [term]
var range_start = new Date($( ".sliderRange" ).slider( "values", 0 )).getTime() / 1000; var range_start = new Date($( ".sliderRange" ).slider( "values", 0 )).getTime() / 1000;
var range_end = new Date($( ".sliderRange" ).slider( "values", 1 )).getTime() / 1000; var range_end = new Date($( ".sliderRange" ).slider( "values", 1 )).getTime() / 1000;
@ -205,8 +207,8 @@ function plotData() {
graph_data = []; graph_data = [];
var to_plot = []; var to_plot = [];
var curr_data = []; var curr_data = [];
for(i=0; i<data.length; i++) { for(i=1; i<data.length; i++) {
curr_data.push([data[i][0]*1000, data[i][1]]); curr_data.push([data[i][0]*1000, data[i][1]]);
} }
to_plot.push({ data: curr_data, label: term}); to_plot.push({ data: curr_data, label: term});
graph_data.push({ data: curr_data, label: term}); graph_data.push({ data: curr_data, label: term});
@ -234,22 +236,44 @@ function plotData() {
function addData() { function addData() {
var curthis = $(this); var curthis = $(this);
var term = $('#TermInput').val(); var term = $('#TermInput').val();
plotted_terms.push(term)
var range_start = new Date($( ".sliderRange" ).slider( "values", 0 )).getTime() / 1000; var range_start = new Date($( ".sliderRange" ).slider( "values", 0 )).getTime() / 1000;
var range_end = new Date($( ".sliderRange" ).slider( "values", 1 )).getTime() / 1000; var range_end = new Date($( ".sliderRange" ).slider( "values", 1 )).getTime() / 1000;
$.getJSON("{{ url_for('terms_plot_tool_data') }}", { range_start: range_start, range_end: range_end, term: term }, function(data, status){ $.getJSON("{{ url_for('terms_plot_tool_data') }}", { range_start: range_start, range_end: range_end, term: term }, function(data, status){
var to_plot = [];
var curr_data = []; var curr_data = [];
for(i=0; i<data.length; i++) { for(i=1; i<data.length; i++) {
curr_data.push([data[i][0]*1000, data[i][1]]); curr_data.push([data[i][0]*1000, data[i][1]]);
} }
to_plot.push({ data: curr_data, label: term});
graph_data.push({ data: curr_data, label: term}); graph_data.push({ data: curr_data, label: term});
plot = $.plot($("#graph"), graph_data, graph_options); plot = $.plot($("#graph"), graph_data, graph_options);
$("#TermInput").val(""); $("#TermInput").val("");
}) })
} }
function replot(duration) {
console.log(plotted_terms);
graph_data = [];
for(i=0; i<plotted_terms.length; i++) {
var term = plotted_terms[i];
var range_start = new Date($( ".sliderRange" ).slider( "values", 0 )).getTime() / 1000;
var range_end = new Date($( ".sliderRange" ).slider( "values", 1 )).getTime() / 1000;
$.getJSON("{{ url_for('terms_plot_tool_data') }}", { range_start: range_start, range_end: range_end, term: term }, function(data, status){
var curr_data = [];
for(i=1; i<data.length; i++) {
curr_data.push([data[i][0]*1000, data[i][1]]);
}
graph_data.push({ data: curr_data, label: data[0]});
$("#TermInput").val("");
})
}
setTimeout(function() {
plot = $.plot($("#graph"), graph_data, graph_options);
}, 500);
}
</script> </script>