Gantt图文档
<!--[if !supportLists]-->1、 <!--[endif]-->gantt构造函数
var gantt = new GanttChart();
gantt.create(divID); divID是作为甘特图的父容器;
create方法应该在gantt属性设置之后调用;
示例代码:
var project1 = new GanttProjectInfo(id, name, startDate);
id:项目编号
name:项目名称
startDate:项目开始日期
注意:javascript 中日期对象月份是从0 开始的;示例代码是表示:2014年6月28号;
var parentTask1 = new GanttTaskInfo(id, name, EST, duration, predecessorTaskId);
id: 任务编号
name:任务名称
EST :计划任务开始时间
duration:任务工期(按天)
predecessorTaskId:前置任务编号
示例代码:
我们有两种类型对象:分别是设计时对象和运行时对象;
设计时对象(GanttProjectInfo, GanttTaskInfo ):在调用create方法之前初始化内容;
运行时对象(GanttChart, GanttProject, GanttTask):在调用create方法之后可以操作的对象。
4.1设计时对象API
GanttProjectInfo对象 |
|
addTask |
给项目增加特定的GanttTaskInfo对象 |
deleteTask |
从项目中删除对象 |
getTaskById |
根据编号返回GanttTaskInfo对象 |
GanttTaskInfo对象 |
|
addChildTask |
给GanttTaskInfo对象增加子任务 |
var parentTask1 = new GanttTaskInfo(1, "Old code review", new Date(2014, 5, 28), 29, "");
parentTask1.addChildTask(new GanttTaskInfo(2, "Convert to J#", new Date(2014, 6, 11), 12, ""));
var childTask2 = new GanttTaskInfo(3, "Hosted Control", new Date(2014,7, 7), 10, "1"); parentTask1.addChildTask(childTask2 );
|
4.2运行时对象API
4.2.1 GanttChart对象api
addProject |
给gantt增加GanttProjectInfo对象 |
attachEvent |
增加不同类型的事件处理 ganttChart.attachEvent(evName, evHandler); evName:事件名称,注意大小写敏感; evHandler:用户定义事件处理方法; onBeforeContextMenu: occurs when user clicks the mouse button on Tree items. onTaskClick : occurs when user clicks a Task item. onTaskStartDrag : occurs when user starts to drag a Task item. onTaskDragging : occurs while user is dragging a Task item. onTaskEndDrag : occurs when user finished to drag a Task item. onTaskStartResize : occurs when user starts to resize a Task item. onTaskResizing : occurs while user is resizing a Task item. onTaskEndResize : occurs when user finished to resize a Task item. |
在页面上创建GanttChart对象 |
|
returns a string representation of current month for the month scale row; you may override this function to customize the label |
|
adds custom context menu of type dhtmlXMenuObject |
|
defines whether GanttChart is editable by user |
|
sets path to image directory |
|
defines full month names for your locale |
|
defines short month names for your locale |
|
set path to styles file, default is “codebase/style.css”; used in simple printing method printToWindow |
|
enables or disables default context menu in tree, which can be used for basic task manipulations |
|
enables or disables inline project description (displayed right after the project bar), and configures the shown values |
|
enables or disables inline task description (displayed right after the task bar), and configures the shown values |
|
show/hide new project bar at start-up; it is useful if you have no project at all, and user needs some start point where the menu is attached |
|
show/hide task & project tooltip (info panel) |
|
show/hide left side tree panel |
|
use short or full month name in the month label axis |
GanttChart对象 |
|
运行时方法 - create()方法之前调用 |
|
clears all control's contents |
|
deletes project from chart by id |
|
returns chart in html format suitable for printing, full-sized and without scrollbars |
|
returns GanttProject object by id |
|
returns XML string representation of the chart content |
|
inserts new project with specified id, name, start date and returns it |
|
loads XML data from string or file |
|
opens chart full-sized in a new window, from where you can print it as you like |
|
saves XML data to server using URL specified in setSavePath and encoding “application/x-www-form-urlencoded” |
|
sets URL which is used to load chart data with loadData method调用服务器端servlet来载入数据;loadData方法之前调用; |
|
sets URL which is used to save chart data with saveData method:调用服务器端servlet来保存数据,saveDate方法之前调用; |
4.2.2 GanttProject对象api
GanttProject对象 |
|
this is object property, equals true; used to distinguish Project and Task in menu event handler |
|
deletes task from project by id |
|
calculates and returns the duration of project in hours |
|
returns id of project |
|
returns name of project |
|
calculates and returns percent completed of project |
|
returns start date of project |
|
returns GanttTask object by id |
|
inserts new task with specified id, name, start date, duration, percent completed, predecessor task Id, parent task Id and returns it |
|
sets name of this project |
|
sets percent completed for this project |
4.2.3 GanttTask对象api
GanttTask对象 |
|
this is object property, equals true; used to distinguish Project and Task in menu event handler |
|
返回工期(用小时表示) |
|
获取任务计划开始时间 |
|
计算返回任务完成时间 |
|
返回任务编号 |
|
返回任务名称 |
|
返回父任务编号 |
|
获取任务完成比例 |
|
获取前置任务编号 |
|
设置任务工期 |
|
设置任务计划开始时间 |
|
设置任务名称 |
|
设置任务完成百分比 |
|
设置前置任务 var task121 = project2.getTaskById(121); task121.setPredecessor(120);
// to remove the connection var task122 = project2.getTaskById(122); task122.setPredecessor(""); |
5、xml文件结构
<?xml version="1.0" encoding="UTF-8"?>
<projects>
<project id="1" name="project1" startdate="2006,12,14">
<task id="1">
<name>project1 task1</name>
<est>2006,12,14</est>
<duration>120</duration>
<percentcompleted>60</percentcompleted>
<predecessortasks></predecessortasks>
<childtasks>
<task id="2">
<name>project1 task2</name>
<est>2006,12,14</est>
<duration>100</duration>
<percentcompleted>20</percentcompleted>
<predecessortasks></predecessortasks>
<childtasks></childtasks>
</task>
<task id="6">
<name>project1 task6</name>
<est>2006,12,15</est>
<duration>90</duration>
<percentcompleted>10</percentcompleted>
<predecessortasks>2</predecessortasks>
<childtasks></childtasks>
</task>
</childtasks>
</task>
</project>
<project id="2" name="project2" startdate="2006,12,20">
<task id="12">
<name>project2 task12</name>
<est>2006,12,20</est>
<duration>140</duration>
<percentcompleted>60</percentcompleted>
<predecessortasks></predecessortasks>
<childtasks>
<task id="14">
<name>project2 task14</name>
<est>2006,12,20</est>
<duration>100</duration>
<percentcompleted>20</percentcompleted>
<predecessortasks></predecessortasks>
<childtasks></childtasks>
</task>
</childtasks>
</task>
</project>
</projects>
窗体顶端
窗体底端
<!--EndFragment-->
相关推荐
图书馆管理系统Gantt图,基于Visio 2016绘制的Gantt图
【毕业设计管理系统】是一个综合性的IT项目,通常涵盖了软件工程中的多个重要环节,如需求分析、系统设计、编码实现、测试以及后期维护等。在这个系统中,学生、指导教师、评审专家等多个角色可以进行交互,完成从...
dhtmlxGantt 甘特图组件使用指南 dhtmlxGantt 是一个 JavaScript 组件,能够创建动态的甘特图和...通过学习和使用 dhtmlxGantt,我们可以更好地展示项目计划的进度和任务的开始和结束时间,提高项目的管理和执行效率。
在Web端使用dhtmlxGantt时,开发者需要注意以下几点关键知识点: 1. 数据绑定:dhtmlxGantt支持多种数据格式,如JSON、XML或CSV,开发者需要根据实际需求选择合适的数据格式,并设置相应的数据源。 2. 任务和依赖...
可应用于项目管理系统、生产执行系统(MES)、资源管理 系统(ERP)或其它的任务资源分配相关领域的应用程序的。Ext Gantt甘特图完全兼容Extjs语法,熟悉Extjs可以轻易上手。 Ext Gantt甘特图可与任意后端代码(asp...
JQuery Gantt-Demo是一个基于JQuery库的项目管理工具,用于展示甘特图,这是一种流行的数据可视化方式,尤其在项目管理和任务调度中广泛应用。甘特图通过条形图显示项目的时间线,使得用户可以清晰地看到各个任务的...
dhtmlxGantt 是一款基于 JavaScript 的强大甘特图组件库,它属于 dhtmlxSuite 中的一部分。该组件库提供了创建交互式甘特图所需的所有工具,非常适合于项目管理和任务跟踪应用的开发。dhtmlxGantt 的主要优势在于其...
总结起来,"Gantt图的简单做法示例精典"主要涵盖了以下几个知识点: 1. Gantt图的基本概念:任务、持续时间、开始日期、结束日期和依赖关系。 2. 在JAVA中使用JFreeChart库创建Gantt图的步骤。 3. 如何扩展Gantt图以...
《VB毕业设计——VB课题项目进程管理系统》是一个综合性的学习资源包,包含了完整的毕业设计流程,包括论文、源代码、开题报告、外文翻译以及答辩PPT。这个系统是用Visual Basic(VB)开发的,旨在管理和跟踪项目...
Man Xu擅长系统设计、数据库设计和用户管理系统设计;Yijing Wang专注于储蓄系统的设计、开发和实施;Jinliang Li负责贷款系统的全流程;Ziwei Zhang专长于储蓄系统的需求分析和测试描述等。合理的人员分配是保证...
在这个"科研管理系统毕业设计"项目中,我们可以推测这是一个针对计算机科学与技术专业学生的课程设计任务,旨在锻炼学生在实际开发环境中应用所学知识的能力。 该项目名为"ScientResearch-master",暗示了它可能是...
Devexpress Gantt是一款由DevExpress公司开发的用于创建和展示...通过学习和实践Devexpress Gantt,开发者不仅可以提升项目管理技能,还能增强在UI设计和编程上的能力,为构建高效、直观的项目管理应用打下坚实基础。
项目管理
**dhtmlxGantt_v4.0.0:深度解析甘特图库的资源与应用** **一、dhtmlxGantt简介** dhtmlxGantt是一款强大的JavaScript库,专门用于创建交互式的甘特图。它允许用户在网页上直观地展示项目计划,包括任务、依赖关系...
2. **LayUI**:LayUI是一个前端UI框架,提供了丰富的组件和优雅的样式,适用于后台管理系统。它包括表格、表单、按钮、提示等模块,与jQuery结合可以快速构建界面。在甘特图应用中,LayUI可能被用来设计和布局页面,...
e-gantt是专为那些寻求在Java环境中实现Gantt图功能的开发者和项目管理者设计的。它利用Java Swing库,这是一个用于构建桌面应用的组件集合,提供了丰富的用户界面和交互功能。Swing库使得e-gantt可以跨平台运行,...
### 三、jQuery-ganttView的应用场景 - **项目管理**:在软件开发、建筑施工等项目中,用于展示项目进度和计划。 - **团队协作**:协助团队成员了解各自的任务分配和截止日期,提高协作效率。 - **资源调度**:在...
【前端项目-frappe-gantt】是一个专为前端开发者设计的开源项目,旨在提供一个轻量级、现代化且交互性强的网络甘特图库。这个项目的主要目标是帮助开发者轻松地在网页应用中集成甘特图功能,以清晰、直观地展示项目...
《本科毕业设计综合信息管理系统》的开源性质意味着任何人都可以学习、修改和贡献代码,进一步推动该项目的发展,为更多用户提供便利。通过这个系统,我们可以深入理解软件工程中的各个环节,包括需求分析、设计、...