mirror of
https://github.com/ail-project/ail-framework.git
synced 2024-11-10 08:38:28 +00:00
Added multiple terms plot in terms-plot-tool.
This commit is contained in:
parent
9f2d672ec8
commit
0eba419651
1 changed files with 31 additions and 6 deletions
|
@ -77,7 +77,8 @@
|
||||||
<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>
|
||||||
<input id="TermInput" class="form-control" placeholder="Term to plot" type="text" style="max-width: 400px;" data-init-plot="{{ term }}">
|
<input id="TermInput" class="form-control" placeholder="Term to plot" type="text" style="max-width: 400px;" data-init-plot="{{ term }}">
|
||||||
<button id="plot-btn" class="btn btn-info btn-interaction" style="margin-left: 10px;" data-section="followTerm" data-action="add"> Plot a term</button>
|
<button id="plot-btn" class="btn btn-info" style="margin-left: 10px;"><span class="fa fa-caret-down"> Plot a term</button>
|
||||||
|
<button id="plot-btn-add" class="btn btn-success" style="margin-left: 6px;"><span class="fa fa-plus"></span> Add the term to the chart</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
@ -143,6 +144,7 @@
|
||||||
" - " + new Date($( ".sliderRange" ).slider( "values", 1 )).toLocaleDateString() );
|
" - " + new Date($( ".sliderRange" ).slider( "values", 1 )).toLocaleDateString() );
|
||||||
|
|
||||||
$('#plot-btn').click(plotData);
|
$('#plot-btn').click(plotData);
|
||||||
|
$('#plot-btn-add').click(addData);
|
||||||
|
|
||||||
$("#TermInput").val($("#TermInput").attr("data-init-plot"));
|
$("#TermInput").val($("#TermInput").attr("data-init-plot"));
|
||||||
$("#plot-btn").click();
|
$("#plot-btn").click();
|
||||||
|
@ -158,6 +160,8 @@
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
var plot;
|
||||||
|
var graph_data = [];
|
||||||
var graph_options = {
|
var graph_options = {
|
||||||
series: {
|
series: {
|
||||||
lines: {
|
lines: {
|
||||||
|
@ -184,7 +188,28 @@ var graph_options = {
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
function plotData(){
|
function plotData() {
|
||||||
|
var curthis = $(this);
|
||||||
|
var term = $('#TermInput').val();
|
||||||
|
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){
|
||||||
|
graph_data = [];
|
||||||
|
var to_plot = [];
|
||||||
|
var curr_data = [];
|
||||||
|
for(i=0; i<data.length; i++) {
|
||||||
|
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});
|
||||||
|
plot = $.plot($("#graph"), to_plot, graph_options);
|
||||||
|
$("#TermInput").val("");
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
function addData() {
|
||||||
var curthis = $(this);
|
var curthis = $(this);
|
||||||
var term = $('#TermInput').val();
|
var term = $('#TermInput').val();
|
||||||
var range_start = new Date($( ".sliderRange" ).slider( "values", 0 )).getTime() / 1000;
|
var range_start = new Date($( ".sliderRange" ).slider( "values", 0 )).getTime() / 1000;
|
||||||
|
@ -192,17 +217,17 @@ function plotData(){
|
||||||
|
|
||||||
$.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 to_plot = [];
|
||||||
console.log(data);
|
|
||||||
var curr_data = [];
|
var curr_data = [];
|
||||||
for(i=0; i<data.length; i++) {
|
for(i=0; 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});
|
||||||
var plot = $.plot($("#graph"), to_plot, graph_options);
|
graph_data.push({ data: curr_data, label: term});
|
||||||
|
plot = $.plot($("#graph"), graph_data, graph_options);
|
||||||
|
$("#TermInput").val("");
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue