Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Modify #11

Open
wants to merge 5 commits into
base: master
Choose a base branch
from
+430 −259
Open

Modify #11

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
bf0eca6
refactoring, implementation of the principle DRY, add the the ability…
MicrowaveDev Apr 12, 2015
32603ef
adapting examples
MicrowaveDev Apr 12, 2015
14922bf
fix stuck blocks
MicrowaveDev Apr 12, 2015
d275ee1
new screenshots
MicrowaveDev Apr 12, 2015
e392538
edit readme
MicrowaveDev Apr 12, 2015
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
7 changes: 4 additions & 3 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,19 +12,20 @@ Create a array of all your data.

```javascript
var tasks = [

{
"startDate": new Date("Sun Dec 09 01:36:45 EST 2012"),
"endDate": new Date("Sun Dec 09 02:36:45 EST 2012"),
"taskName": "E Job",
"status": "FAILED"
"status": "FAILED",
"title": "Text content of task 1"
},

{
"startDate": new Date("Sun Dec 09 04:56:32 EST 2012"),
"endDate": new Date("Sun Dec 09 06:35:47 EST 2012"),
"taskName": "A Job",
"status": "RUNNING"
"status": "RUNNING",
"title": "Text content of task 2"
}];

```
Expand Down
1 change: 1 addition & 0 deletions examples/example.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,7 @@
<a id="forkme_banner" href="http://dk8996.github.io/Gantt-Chart/">View on GitHub</a>
<a id="twittme_banner"
href="https://twitter.com/intent/tweet?hashtags=d3&original_referer=http%3A%2F%2Fdk8996.github.io%2FGantt-Chart%2F&text=D3%20Gantt%20Chart&tw_p=tweetbutton&url=http%3A%2F%2Fdk8996.github.com%2FGantt-Chart&screen_name=dk8996" target="_blank">Share on Twitter</a>
<div id="svg-gantt"></div>
<script type="text/javascript" src="../lib/d3/d3.v3.min.js"></script>
<script type="text/javascript" src="../gantt-chart-d3.js"></script>
<script type="text/javascript" src="example.js"></script>
Expand Down
50 changes: 25 additions & 25 deletions examples/example.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,31 +3,31 @@ example();
function example() {

var tasks = [
{"startDate":new Date("Sun Dec 09 01:36:45 EST 2012"),"endDate":new Date("Sun Dec 09 02:36:45 EST 2012"),"taskName":"E Job","status":"RUNNING"},
{"startDate":new Date("Sun Dec 09 04:56:32 EST 2012"),"endDate":new Date("Sun Dec 09 06:35:47 EST 2012"),"taskName":"A Job","status":"RUNNING"},
{"startDate":new Date("Sun Dec 09 06:29:53 EST 2012"),"endDate":new Date("Sun Dec 09 06:34:04 EST 2012"),"taskName":"D Job","status":"RUNNING"},
{"startDate":new Date("Sun Dec 09 05:35:21 EST 2012"),"endDate":new Date("Sun Dec 09 06:21:22 EST 2012"),"taskName":"P Job","status":"RUNNING"},
{"startDate":new Date("Sun Dec 09 05:00:06 EST 2012"),"endDate":new Date("Sun Dec 09 05:05:07 EST 2012"),"taskName":"D Job","status":"RUNNING"},
{"startDate":new Date("Sun Dec 09 03:46:59 EST 2012"),"endDate":new Date("Sun Dec 09 04:54:19 EST 2012"),"taskName":"P Job","status":"RUNNING"},
{"startDate":new Date("Sun Dec 09 04:02:45 EST 2012"),"endDate":new Date("Sun Dec 09 04:48:56 EST 2012"),"taskName":"N Job","status":"RUNNING"},
{"startDate":new Date("Sun Dec 09 03:27:35 EST 2012"),"endDate":new Date("Sun Dec 09 03:58:43 EST 2012"),"taskName":"E Job","status":"SUCCEEDED"},
{"startDate":new Date("Sun Dec 09 01:40:11 EST 2012"),"endDate":new Date("Sun Dec 09 03:26:35 EST 2012"),"taskName":"A Job","status":"SUCCEEDED"},
{"startDate":new Date("Sun Dec 09 03:00:03 EST 2012"),"endDate":new Date("Sun Dec 09 03:09:51 EST 2012"),"taskName":"D Job","status":"SUCCEEDED"},
{"startDate":new Date("Sun Dec 09 01:21:00 EST 2012"),"endDate":new Date("Sun Dec 09 02:51:42 EST 2012"),"taskName":"P Job","status":"SUCCEEDED"},
{"startDate":new Date("Sun Dec 09 01:08:42 EST 2012"),"endDate":new Date("Sun Dec 09 01:33:42 EST 2012"),"taskName":"N Job","status":"FAILED"},
{"startDate":new Date("Sun Dec 09 00:27:15 EST 2012"),"endDate":new Date("Sun Dec 09 00:54:56 EST 2012"),"taskName":"E Job","status":"SUCCEEDED"},
{"startDate":new Date("Sun Dec 09 00:29:48 EST 2012"),"endDate":new Date("Sun Dec 09 00:44:50 EST 2012"),"taskName":"D Job","status":"SUCCEEDED"},
{"startDate":new Date("Sun Dec 09 07:39:21 EST 2012"),"endDate":new Date("Sun Dec 09 07:43:22 EST 2012"),"taskName":"P Job","status":"RUNNING"},
{"startDate":new Date("Sun Dec 09 07:00:06 EST 2012"),"endDate":new Date("Sun Dec 09 07:05:07 EST 2012"),"taskName":"D Job","status":"RUNNING"},
{"startDate":new Date("Sun Dec 09 08:46:59 EST 2012"),"endDate":new Date("Sun Dec 09 09:54:19 EST 2012"),"taskName":"P Job","status":"RUNNING"},
{"startDate":new Date("Sun Dec 09 09:02:45 EST 2012"),"endDate":new Date("Sun Dec 09 09:48:56 EST 2012"),"taskName":"N Job","status":"RUNNING"},
{"startDate":new Date("Sun Dec 09 08:27:35 EST 2012"),"endDate":new Date("Sun Dec 09 08:58:43 EST 2012"),"taskName":"E Job","status":"SUCCEEDED"},
{"startDate":new Date("Sun Dec 09 08:40:11 EST 2012"),"endDate":new Date("Sun Dec 09 08:46:35 EST 2012"),"taskName":"A Job","status":"SUCCEEDED"},
{"startDate":new Date("Sun Dec 09 08:00:03 EST 2012"),"endDate":new Date("Sun Dec 09 08:09:51 EST 2012"),"taskName":"D Job","status":"SUCCEEDED"},
{"startDate":new Date("Sun Dec 09 10:21:00 EST 2012"),"endDate":new Date("Sun Dec 09 10:51:42 EST 2012"),"taskName":"P Job","status":"SUCCEEDED"},
{"startDate":new Date("Sun Dec 09 11:08:42 EST 2012"),"endDate":new Date("Sun Dec 09 11:33:42 EST 2012"),"taskName":"N Job","status":"FAILED"},
{"startDate":new Date("Sun Dec 09 12:27:15 EST 2012"),"endDate":new Date("Sun Dec 09 12:54:56 EST 2012"),"taskName":"E Job","status":"SUCCEEDED"},
{"startDate":new Date("Sat Dec 08 23:12:24 EST 2012"),"endDate":new Date("Sun Dec 09 00:26:13 EST 2012"),"taskName":"A Job","status":"KILLED"}];
{"startDate":new Date("Sun Dec 09 01:36:45 EST 2012"),"endDate":new Date("Sun Dec 09 02:36:45 EST 2012"),"taskName":"E Job","status":"RUNNING", title: "Text content of task 1"},
{"startDate":new Date("Sun Dec 09 04:56:32 EST 2012"),"endDate":new Date("Sun Dec 09 06:35:47 EST 2012"),"taskName":"A Job","status":"RUNNING", title: "Text content of task 2"},
{"startDate":new Date("Sun Dec 09 06:29:53 EST 2012"),"endDate":new Date("Sun Dec 09 06:34:04 EST 2012"),"taskName":"D Job","status":"RUNNING", title: "Text content of task 3"},
{"startDate":new Date("Sun Dec 09 05:35:21 EST 2012"),"endDate":new Date("Sun Dec 09 06:21:22 EST 2012"),"taskName":"P Job","status":"RUNNING", title: "Text content of task 4"},
{"startDate":new Date("Sun Dec 09 05:00:06 EST 2012"),"endDate":new Date("Sun Dec 09 05:05:07 EST 2012"),"taskName":"D Job","status":"RUNNING", title: "Text content of task 5"},
{"startDate":new Date("Sun Dec 09 03:46:59 EST 2012"),"endDate":new Date("Sun Dec 09 04:54:19 EST 2012"),"taskName":"P Job","status":"RUNNING", title: "Text content of task 6"},
{"startDate":new Date("Sun Dec 09 04:02:45 EST 2012"),"endDate":new Date("Sun Dec 09 04:48:56 EST 2012"),"taskName":"N Job","status":"RUNNING", title: "Text content of task 7"},
{"startDate":new Date("Sun Dec 09 03:27:35 EST 2012"),"endDate":new Date("Sun Dec 09 03:58:43 EST 2012"),"taskName":"E Job","status":"SUCCEEDED", title: "Text content of task 8"},
{"startDate":new Date("Sun Dec 09 01:40:11 EST 2012"),"endDate":new Date("Sun Dec 09 03:26:35 EST 2012"),"taskName":"A Job","status":"SUCCEEDED", title: "Text content of task 9"},
{"startDate":new Date("Sun Dec 09 03:00:03 EST 2012"),"endDate":new Date("Sun Dec 09 03:09:51 EST 2012"),"taskName":"D Job","status":"SUCCEEDED", title: "Text content of task 10"},
{"startDate":new Date("Sun Dec 09 01:21:00 EST 2012"),"endDate":new Date("Sun Dec 09 02:51:42 EST 2012"),"taskName":"P Job","status":"SUCCEEDED", title: "Text content of task 11"},
{"startDate":new Date("Sun Dec 09 01:08:42 EST 2012"),"endDate":new Date("Sun Dec 09 01:33:42 EST 2012"),"taskName":"N Job","status":"FAILED", title: "Text content of task 12"},
{"startDate":new Date("Sun Dec 09 00:27:15 EST 2012"),"endDate":new Date("Sun Dec 09 00:54:56 EST 2012"),"taskName":"E Job","status":"SUCCEEDED", title: "Text content of task 13"},
{"startDate":new Date("Sun Dec 09 00:29:48 EST 2012"),"endDate":new Date("Sun Dec 09 00:44:50 EST 2012"),"taskName":"D Job","status":"SUCCEEDED", title: "Text content of task 14"},
{"startDate":new Date("Sun Dec 09 07:39:21 EST 2012"),"endDate":new Date("Sun Dec 09 07:43:22 EST 2012"),"taskName":"P Job","status":"RUNNING", title: "Text content of task 15"},
{"startDate":new Date("Sun Dec 09 07:00:06 EST 2012"),"endDate":new Date("Sun Dec 09 07:05:07 EST 2012"),"taskName":"D Job","status":"RUNNING", title: "Text content of task 16"},
{"startDate":new Date("Sun Dec 09 08:46:59 EST 2012"),"endDate":new Date("Sun Dec 09 09:54:19 EST 2012"),"taskName":"P Job","status":"RUNNING", title: "Text content of task 17"},
{"startDate":new Date("Sun Dec 09 09:02:45 EST 2012"),"endDate":new Date("Sun Dec 09 09:48:56 EST 2012"),"taskName":"N Job","status":"RUNNING", title: "Text content of task 18"},
{"startDate":new Date("Sun Dec 09 08:27:35 EST 2012"),"endDate":new Date("Sun Dec 09 08:58:43 EST 2012"),"taskName":"E Job","status":"SUCCEEDED", title: "Text content of task 19"},
{"startDate":new Date("Sun Dec 09 08:40:11 EST 2012"),"endDate":new Date("Sun Dec 09 08:46:35 EST 2012"),"taskName":"A Job","status":"SUCCEEDED", title: "Text content of task 20"},
{"startDate":new Date("Sun Dec 09 08:00:03 EST 2012"),"endDate":new Date("Sun Dec 09 08:09:51 EST 2012"),"taskName":"D Job","status":"SUCCEEDED", title: "Text content of task 21"},
{"startDate":new Date("Sun Dec 09 10:21:00 EST 2012"),"endDate":new Date("Sun Dec 09 10:51:42 EST 2012"),"taskName":"P Job","status":"SUCCEEDED", title: "Text content of task 22"},
{"startDate":new Date("Sun Dec 09 11:08:42 EST 2012"),"endDate":new Date("Sun Dec 09 11:33:42 EST 2012"),"taskName":"N Job","status":"FAILED", title: "Text content of task 23"},
{"startDate":new Date("Sun Dec 09 12:27:15 EST 2012"),"endDate":new Date("Sun Dec 09 12:54:56 EST 2012"),"taskName":"E Job","status":"SUCCEEDED", title: "Text content of task 24"},
{"startDate":new Date("Sat Dec 08 23:12:24 EST 2012"),"endDate":new Date("Sun Dec 09 00:26:13 EST 2012"),"taskName":"A Job","status":"KILLED", title: "Text content of task 25"}];

var taskStatus = {
"SUCCEEDED" : "bar",
Expand Down
1 change: 1 addition & 0 deletions examples/example2.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@
href="https://twitter.com/intent/tweet?hashtags=d3&original_referer=http%3A%2F%2Fdk8996.github.io%2FGantt-Chart%2F&text=D3%20Gantt%20Chart&tw_p=tweetbutton&url=http%3A%2F%2Fdk8996.github.com%2FGantt-Chart&screen_name=dk8996" target="_blank">Share on Twitter</a>
<button type="button" onclick="example.addTask()">Add Task</button>
<button type="button" onclick="example.removeTask()">Remove Task</button>
<div id="svg-gantt"></div>
<script type="text/javascript" src="../lib/d3/d3.v3.min.js"></script>
<script type="text/javascript" src="../gantt-chart-d3.js"></script>
<script type="text/javascript" src="example2.js"></script>
Expand Down
109 changes: 59 additions & 50 deletions examples/example2.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,53 +1,62 @@
example();
function example() {

var tasks = [
{"startDate":new Date("Sun Dec 09 01:36:45 EST 2012"),"endDate":new Date("Sun Dec 09 02:36:45 EST 2012"),"taskName":"E Job","status":"RUNNING"}];

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" ];

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.timeDomain([new Date("Sun Dec 09 04:54:19 EST 2012"),new Date("Sun Jan 09 04:54:19 EST 2013")]);
//gantt.timeDomainMode("fixed");
gantt(tasks);


example.addTask = function() {

var lastEndDate = Date.now();
if (tasks.length > 0) {
lastEndDate = tasks[tasks.length - 1].endDate;
}

var taskStatusKeys = Object.keys(taskStatus);
var taskStatusName = taskStatusKeys[Math.floor(Math.random()*taskStatusKeys.length)];
var taskName = taskNames[Math.floor(Math.random()*taskNames.length)];

tasks.push({"startDate":d3.time.hour.offset(lastEndDate,Math.ceil(1*Math.random())),"endDate":d3.time.hour.offset(lastEndDate,(Math.ceil(Math.random()*3))+1),"taskName":taskName,"status":taskStatusName});
gantt.redraw(tasks);
};

example.removeTask = function() {
tasks.pop();
gantt.redraw(tasks);
};

};
var tasks = [
{"startDate": new Date("Sun Dec 09 01:36:45 EST 2012"), "endDate": new Date("Sun Dec 09 02:36:45 EST 2012"), "taskName": "E Job", "status": "RUNNING", title: "Text content of task"}
];

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" ];

var taskTitles = ['Random text content of task 1', 'Random text content of task 2', 'Random text content of task 3', 'Random text content of task 4'];

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.timeDomain([new Date("Sun Dec 09 04:54:19 EST 2012"),new Date("Sun Jan 09 04:54:19 EST 2013")]);
//gantt.timeDomainMode("fixed");
gantt(tasks);


example.addTask = function() {

var lastEndDate = Date.now();
if (tasks.length > 0) {
lastEndDate = tasks[tasks.length - 1].endDate;
}

var taskStatusKeys = Object.keys(taskStatus);
var taskStatusName = taskStatusKeys[Math.floor(Math.random() * taskStatusKeys.length)];
var taskName = taskNames[Math.floor(Math.random() * taskNames.length)];
var taskRandomTitle = taskTitles[Math.floor(Math.random() * taskTitles.length)];

tasks.push({
"startDate":d3.time.hour.offset(lastEndDate,Math.ceil(1*Math.random())),
"endDate":d3.time.hour.offset(lastEndDate,(Math.ceil(Math.random()*3))+1),
"taskName":taskName,
"status":taskStatusName,
"title": taskRandomTitle
});
gantt.redraw(tasks);
};

example.removeTask = function() {
tasks.pop();
gantt.redraw(tasks);
};
}
1 change: 1 addition & 0 deletions examples/example3.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,7 @@
<button type="button" onclick="changeTimeDomain('6hr')">6 HR</button>
<button type="button" onclick="changeTimeDomain('1day')">1 DAY</button>
<button type="button" onclick="changeTimeDomain('1week')">1 WEEK</button>
<div id="svg-gantt"></div>
<script type="text/javascript" src="../lib/d3/d3.v3.min.js"></script>
<script type="text/javascript" src="../gantt-chart-d3.js"></script>
<script type="text/javascript" src="example3.js"></script>
Expand Down
71 changes: 39 additions & 32 deletions examples/example3.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
var tasks = [
{"startDate":new Date("Sun Dec 09 01:36:45 EST 2012"),"endDate":new Date("Sun Dec 09 02:36:45 EST 2012"),"taskName":"E Job","status":"RUNNING"}];
{"startDate": new Date("Sun Dec 09 01:36:45 EST 2012"), "endDate": new Date("Sun Dec 09 02:36:45 EST 2012"), "taskName": "E Job", "status": "RUNNING", title: "Text content of task"}
];

var taskStatus = {
"SUCCEEDED" : "bar",
Expand All @@ -10,6 +11,8 @@ var taskStatus = {

var taskNames = [ "D Job", "P Job", "E Job", "A Job", "N Job" ];

var taskTitles = ['Random text content of task 1', 'Random text content of task 2', 'Random text content of task 3', 'Random text content of task 4'];

tasks.sort(function(a, b) {
return a.endDate - b.endDate;
});
Expand Down Expand Up @@ -39,33 +42,35 @@ gantt(tasks);

function changeTimeDomain(timeDomainString) {
this.timeDomainString = timeDomainString;

switch (timeDomainString) {
case "1hr":
format = "%H:%M:%S";
gantt.timeDomain([ d3.time.hour.offset(getEndDate(), -1), getEndDate() ]);
break;
case "3hr":
format = "%H:%M";
gantt.timeDomain([ d3.time.hour.offset(getEndDate(), -3), getEndDate() ]);
break;

case "6hr":
format = "%H:%M";
gantt.timeDomain([ d3.time.hour.offset(getEndDate(), -6), getEndDate() ]);
break;

case "1day":
format = "%H:%M";
gantt.timeDomain([ d3.time.day.offset(getEndDate(), -1), getEndDate() ]);
break;

case "1week":
format = "%a %H:%M";
gantt.timeDomain([ d3.time.day.offset(getEndDate(), -7), getEndDate() ]);
break;
default:
format = "%H:%M"

case "1hr":
format = "%H:%M:%S";
gantt.timeDomain([ d3.time.hour.offset(getEndDate(), -1), getEndDate() ]);
break;

case "3hr":
format = "%H:%M";
gantt.timeDomain([ d3.time.hour.offset(getEndDate(), -3), getEndDate() ]);
break;

case "6hr":
format = "%H:%M";
gantt.timeDomain([ d3.time.hour.offset(getEndDate(), -6), getEndDate() ]);
break;

case "1day":
format = "%H:%M";
gantt.timeDomain([ d3.time.day.offset(getEndDate(), -1), getEndDate() ]);
break;

case "1week":
format = "%a %H:%M";
gantt.timeDomain([ d3.time.day.offset(getEndDate(), -7), getEndDate() ]);
break;
default:
format = "%H:%M";
}
gantt.tickFormat(format);
gantt.redraw(tasks);
Expand All @@ -74,7 +79,7 @@ function changeTimeDomain(timeDomainString) {
function getEndDate() {
var lastEndDate = Date.now();
if (tasks.length > 0) {
lastEndDate = tasks[tasks.length - 1].endDate;
lastEndDate = tasks[tasks.length - 1].endDate;
}

return lastEndDate;
Expand All @@ -86,17 +91,19 @@ function addTask() {
var taskStatusKeys = Object.keys(taskStatus);
var taskStatusName = taskStatusKeys[Math.floor(Math.random() * taskStatusKeys.length)];
var taskName = taskNames[Math.floor(Math.random() * taskNames.length)];
var taskRandomTitle = taskTitles[Math.floor(Math.random() * taskTitles.length)];

tasks.push({
"startDate" : d3.time.hour.offset(lastEndDate, Math.ceil(1 * Math.random())),
"endDate" : d3.time.hour.offset(lastEndDate, (Math.ceil(Math.random() * 3)) + 1),
"taskName" : taskName,
"status" : taskStatusName
"startDate" : d3.time.hour.offset(lastEndDate, Math.ceil(1 * Math.random())),
"endDate" : d3.time.hour.offset(lastEndDate, (Math.ceil(Math.random() * 3)) + 1),
"taskName" : taskName,
"status" : taskStatusName,
"title": taskRandomTitle
});

changeTimeDomain(timeDomainString);
gantt.redraw(tasks);
};
}

function removeTask() {
tasks.pop();
Expand Down
Binary file modified examples/screenshot1.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified examples/screenshot2.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading