jQuery.Gantt
— Draw Gantt charts with the famous jQuery ease of development
Example
Gantt Configuration
$(".selector").gantt({
source: "ajax/data.json",
scale: "weeks",
minScale: "weeks",
maxScale: "months"
});
|
Parameter
|
Default
|
Accepts Type
|
source
|
null
|
Array, String (url)
|
itemsPerPage
|
7
|
Number
|
months
|
["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"]
|
Array
|
days
|
["S", "M", "T", "W", "T", "F", "S"]
|
Array
|
navigate
|
"buttons"
|
String ("buttons","scroll")
|
scale
|
"days"
|
String
|
maxScale
|
"months"
|
String
|
minScale
|
"hours"
|
String
|
waitText
|
"Please Wait..."
|
String
|
Source Configuration
source: [{
name: "Example",
desc: "Lorem ipsum dolor sit amet.",
values: [ ... ]
}]
|
Parameter
|
Default
|
Accepts Type
|
Meaning
|
name
|
null
|
String
|
Bold value in the left-most column of the gantt row.
|
desc
|
null
|
String
|
Secondary value in the gantt row.
|
values
|
null
|
Array
|
Collection of date ranges for gantt items. See next table.
|
Value Configuration
values: [{
to: "/Date(1328832000000)/",
from: "/Date(1333411200000)/",
desc: "Something",
label: "Example Value",
customClass: "ganttRed",
dataObj: foo.bar[i]
}]
|
Parameter
|
Accepts Type
|
Meaning
|
to
|
String (Date)
|
-
|
from
|
String (Date)
|
-
|
desc
|
String
|
Text that appears on hover, I think?
|
label
|
String
|
Appears on the gantt item.
|
customClass
|
String
|
Custom class to be applied to the gantt item.
|
dataObj
|
All
|
A data object that is applied directly to the gantt item.
|