68 lines
2.6 KiB
HTML
68 lines
2.6 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<title>FlaskBlog</title>
|
|
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
|
|
<script type="text/javascript">
|
|
google.charts.load('current', {'packages':['timeline']});
|
|
google.charts.setOnLoadCallback(drawChart);
|
|
function drawChart() {
|
|
var container = document.getElementById('chart_div');
|
|
var chart = new google.visualization.Timeline(container);
|
|
var data = new google.visualization.DataTable();
|
|
data.addColumn({ type: 'string', id: 'President' });
|
|
data.addColumn({ type: 'string', id: 'President2' });
|
|
data.addColumn({ type: 'date', id: 'Start' });
|
|
data.addColumn({ type: 'date', id: 'End' });
|
|
|
|
|
|
data.addRows([
|
|
{% set test = overblikDag.getKoerselsOverblikForDag(1) %}
|
|
{% for job in test %}
|
|
['{{ job.name }}','{{ job.name }}',new Date("{{ job.getMedianDag(0,30,2)[0] }}"),new Date("{{ job.getMedianDag(0,30,2)[1] }}")],
|
|
{% endfor %}
|
|
]);
|
|
var calHeight = data.getNumberOfRows() * 45
|
|
var options = {
|
|
height: calHeight,
|
|
timeline: { groupByRowLabel: true }
|
|
};
|
|
|
|
chart.draw(data, options);
|
|
}
|
|
</script>
|
|
<script type="text/javascript">
|
|
google.charts.load('current', {'packages':['timeline']});
|
|
google.charts.setOnLoadCallback(drawChart);
|
|
function drawChart() {
|
|
var container = document.getElementById('chart2_div');
|
|
var chart = new google.visualization.Timeline(container);
|
|
var data = new google.visualization.DataTable();
|
|
data.addColumn({ type: 'string', id: 'President' });
|
|
data.addColumn({ type: 'string', id: 'President2' });
|
|
data.addColumn({ type: 'date', id: 'Start' });
|
|
data.addColumn({ type: 'date', id: 'End' });
|
|
|
|
|
|
data.addRows([
|
|
{% set test = overblikDag.getKoerselsOverblikForDag(2) %}
|
|
{% for job in test %}
|
|
['{{ job.name }}','{{ job.name }}',new Date("{{ job.getMedianDag(0,30,2)[0] }}"),new Date("{{ job.getMedianDag(0,30,2)[1] }}")],
|
|
{% endfor %}
|
|
]);
|
|
var calHeight = data.getNumberOfRows() * 45
|
|
var options = {
|
|
height: calHeight,
|
|
timeline: { groupByRowLabel: true }
|
|
};
|
|
|
|
chart.draw(data, options);
|
|
}
|
|
</script>
|
|
</head>
|
|
<body>
|
|
<div id="chart_div"></div>
|
|
<div id="chart2_div"></div>
|
|
</body>
|
|
</html> |