48 lines
1.7 KiB
HTML
48 lines
1.7 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<title>Gantt Chart Example 1</title>
|
|
<link type="text/css" href="http://mbostock.github.io/d3/style.css" rel="stylesheet" />
|
|
<link type="text/css" href="{{ url_for('static', filename= 'css/style.css') }}" rel="stylesheet" />
|
|
</head>
|
|
<body>
|
|
<a id="forkme_banner" href="http://dk8996.github.io/Gantt-Chart/" target="_blank">View on GitHub</a>
|
|
<script type="text/javascript" src="http://d3js.org/d3.v3.min.js"></script>
|
|
<script type="text/javascript" src="http://static.mentful.com/gantt-chart-d3v2.js"></script>
|
|
<script>var tasks = [];
|
|
{% for b in test2 %}
|
|
tasks.push({"startDate":new Date("{{ b[1].getStartTime() }}"),"endDate":new Date("{{ b[1].getEndTime() }}"),"taskName":"{{ b[0].name }}","status":"SUCCEEDED"})
|
|
{% endfor %}
|
|
|
|
|
|
var taskStatus = {
|
|
"SUCCEEDED" : "bar",
|
|
"FAILED" : "bar-failed",
|
|
"RUNNING" : "bar-running",
|
|
"KILLED" : "bar-killed"
|
|
};
|
|
|
|
var taskNames = [ "D Job", "P Job", "E Job", "A Job", "N Job" ];
|
|
|
|
taskNames=[]
|
|
{% for a in test2 %}
|
|
taskNames.push("{{ a[0].name }}" )
|
|
{% endfor %}
|
|
|
|
|
|
tasks.sort(function(a, b) {
|
|
return a.endDate - b.endDate;
|
|
});
|
|
var maxDate = tasks[tasks.length - 1].endDate;
|
|
tasks.sort(function(a, b) {
|
|
return a.startDate - b.startDate;
|
|
});
|
|
var minDate = tasks[0].startDate;
|
|
|
|
var format = "%H:%M";
|
|
|
|
var gantt = d3.gantt().taskTypes(taskNames).taskStatus(taskStatus).tickFormat(format);
|
|
gantt(tasks);
|
|
</script>
|
|
</body>
|
|
</html> |