📄 index.htm
字号:
<html>
<head>
<link rel="stylesheet" type="text/css" href="jsgantt.css" />
<script language="javascript" src="jsgantt.js"></script>
<style type="text/css">
<!--
.style1 {color: #0000FF}
-->
</style>
</head>
<body>
<TABLE width="100%">
<TBODY>
<TR>
<TD bgColor=#dddddd><FONT face=Arial,Helvetica size=5><I><STRONG> jsGantt</STRONG></I></FONT></TD>
</TR></TBODY>
</TABLE>
<BR>
<FONT face=Arial,Helvetica size=3> 100% Free Javascript / CSS/ HTML Gantt chart control. Completely buzzword compliant including AJAX !</FONT><BR>
<BR>
<div style="position:relative" class="gantt" id="GanttChartDIV"></div>
<script>
//建立一个甘特图对象
var g = new JSGantt.GanttChart('g',document.getElementById('GanttChartDIV'), 0, 0, 0, 1, 1, 'day');
if( g ) {
// 属性 (pID, pName, pStart, pEnd, pColor, pLink, pMile(是否是标志性任务), pRes(资源), pComp(完成比例), pGroup, pParent, pOpen)
g.AddTaskItem(new JSGantt.TaskItem(1, 'Define Chart API', '', '', 'ff0000', 'http://help.com', 0, 'Brian', 0, 1, 0, 1));
g.AddTaskItem(new JSGantt.TaskItem(11, 'Chart Object', '2/20/2008', '2/20/2008', 'ff00ff', 'http://yahoo.com', 1, 'Shlomy', 100, 0, 1, 1));
g.AddTaskItem(new JSGantt.TaskItem(12, 'Task Objects', '', '', '00ff00', '', 0, 'Shlomy', 40, 1, 1, 1));
g.AddTaskItem(new JSGantt.TaskItem(121, 'Constructor Proc', '2/21/2008', '3/9/2008', '00ffff', 'http://www.com', 0, 'Brian T.', 60, 0, 12,1));
g.AddTaskItem(new JSGantt.TaskItem(122, 'Task Variables', '3/6/2008', '3/11/2008', 'ff0000', 'http://help.com', 0, '', 60, 0, 12, 1,121));
g.AddTaskItem(new JSGantt.TaskItem(123, 'Task Functions', '3/9/2008', '3/29/2008', 'ff0000', 'http://help.com', 0, 'Anyone', 60, 0, 12, 1));
g.AddTaskItem(new JSGantt.TaskItem(2, 'Create HTML Shell', '3/24/2008', '3/25/2008', 'ffff00', 'http://help.com', 0, 'Brian', 20, 0, 0, 1,122));
g.AddTaskItem(new JSGantt.TaskItem(3, 'Code Javascript', '', '', 'ff0000', 'http://help.com', 0, 'Brian', 0, 1, 0, 1));
g.AddTaskItem(new JSGantt.TaskItem(31, 'Define Variables', '2/25/2008', '3/17/2008', 'ff00ff', 'http://help.com', 0, 'Brian', 30, 0, 3, 1));
g.AddTaskItem(new JSGantt.TaskItem(32, 'Calculate Chart Size', '3/15/2008', '3/24/2008', '00ff00', 'http://help.com', 0, 'Shlomy', 40, 0, 3, 1));
g.AddTaskItem(new JSGantt.TaskItem(33, 'Draw Taks Items', '', '', '00ff00', 'http://help.com', 0, 'Someone', 40, 1, 3, 1));
g.AddTaskItem(new JSGantt.TaskItem(332, 'Task Label Table', '3/6/2008', '3/11/2008', '0000ff', 'http://help.com', 0, 'Brian', 60, 0, 33, 1));
g.AddTaskItem(new JSGantt.TaskItem(333, 'Task Scrolling Grid', '3/9/2008', '3/29/2008', '0000ff', 'http://help.com', 0, 'Brian', 60, 0, 33, 1));
g.AddTaskItem(new JSGantt.TaskItem(34, 'Draw Task Bars', '', '', '990000', 'http://help.com', 0, 'Anybody', 60, 1, 3, 1));
g.AddTaskItem(new JSGantt.TaskItem(341, 'Loop each Task', '3/26/2008', '4/11/2008', 'ff0000', 'http://help.com', 0, 'Brian', 60, 0, 34, 1));
g.AddTaskItem(new JSGantt.TaskItem(342, 'Calculate Start/Stop', '4/12/2008', '5/18/2008', 'ff6666', 'http://help.com', 0, 'Brian', 60, 0, 34, 1));
g.AddTaskItem(new JSGantt.TaskItem(343, 'Draw Task Div', '5/13/2008', '5/17/2008', 'ff0000', 'http://help.com', 0, 'Brian', 60, 0, 34, 1));
g.AddTaskItem(new JSGantt.TaskItem(344, 'Draw Completion Div', '5/17/2008', '6/04/2008', 'ff0000', 'http://help.com', 0, 'Brian', 60, 0, 34, 1));
g.Draw();
g.DrawDependencies();
}
else
{
alert("not defined");
}
</script>
</body>
</html>
⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -