diff options
Diffstat (limited to 'src/main/resources/pl/edu/mimuw/cloudatlas/client')
| -rw-r--r-- | src/main/resources/pl/edu/mimuw/cloudatlas/client/templates/attribChart.html | 31 |
1 files changed, 18 insertions, 13 deletions
diff --git a/src/main/resources/pl/edu/mimuw/cloudatlas/client/templates/attribChart.html b/src/main/resources/pl/edu/mimuw/cloudatlas/client/templates/attribChart.html index a476301..d1353ed 100644 --- a/src/main/resources/pl/edu/mimuw/cloudatlas/client/templates/attribChart.html +++ b/src/main/resources/pl/edu/mimuw/cloudatlas/client/templates/attribChart.html @@ -10,24 +10,29 @@ <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script> <script type="text/javascript"> google.charts.load('current', {'packages':['corechart']}); - google.charts.setOnLoadCallback(drawChart); + google.charts.setOnLoadCallback(refreshChart()); - function drawChart() { - var data = google.visualization.arrayToDataTable([ - ['Year', 'Sales', 'Expenses'], - ['2013', 1000, 400], - ['2014', 1170, 460], - ['2015', 660, 1120], - ['2016', 1030, 540] - ]); + function refreshChart() { + setInterval(getData, 5000); + } + + function getData(){ + $.getJSON("/attribNumValues", function(data, status){ + drawChart(data) + }); + } + + function drawChart(jsonData) { + var data = google.visualization.arrayToDataTable(jsonData); var options = { - title: 'Company Performance', - hAxis: {title: 'Year', titleTextStyle: {color: '#333'}}, - vAxis: {minValue: 0} + title: 'Attribute values', + hAxis: {title: 'Timestamp', titleTextStyle: {color: '#333'}}, + vAxis: {minValue: 0}, + interpolateNulls: true }; - var chart = new google.visualization.AreaChart(document.getElementById('chart_div')); + var chart = new google.visualization.LineChart(document.getElementById('chart_div')); chart.draw(data, options); } </script> |