`

毕业设计管理系统之三gantt学习部分知识整理

阅读更多

 Gantt文档

 

<!--[if !supportLists]-->1、 <!--[endif]-->gantt构造函数

var gantt = new GanttChart();

gantt.create(divID);   divID是作为甘特图的父容器;

create方法应该在gantt属性设置之后调用;

示例代码:

 

 

 

 

 

 

 

 

 

 

 

 

 

2、GanttProjectInfo构造函数

var project1 = new GanttProjectInfo(id, name, startDate);

id:项目编号

name:项目名称

startDate:项目开始日期

注意:javascript 中日期对象月份是从0 开始的;示例代码是表示:2014年6月28号;

 

 

 

 

 

 

3、GanttTaskInfo构造函数

var parentTask1 = new GanttTaskInfo(id, name, EST, duration, predecessorTaskId);

id:     任务编号

name:任务名称

EST   :计划任务开始时间

duration:任务工期(按

predecessorTaskId:前置任务编号

 

 

 

示例代码:

 

 

 

 

 

 

 

 

4、dhtmlxGantt API 方法

我们有两种类型对象:分别是设计时对象和运行时对象;

设计时对象(GanttProjectInfoGanttTaskInfo ):在调用create方法之前初始化内容;

运行时对象(GanttChartGanttProjectGanttTask):在调用create方法之后可以操作的对象。

 

4.1设计时对象API

GanttProjectInfo对象

addTask

给项目增加特定的GanttTaskInfo对象

deleteTask

从项目中删除对象

getTaskById

根据编号返回GanttTaskInfo对象

 

 

GanttTaskInfo对象

addChildTask

给GanttTaskInfo对象增加子任务

var parentTask1 = new GanttTaskInfo(1, "Old code review", new Date(2014528), 29, "");

 

parentTask1.addChildTask(new GanttTaskInfo(2, "Convert to J#", new Date(20146, 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

 

GanttChart对象

初始化方法 - create()方法之前调用

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. 

create

在页面上创建GanttChart对象

getMonthScaleLabel

returns a string representation of current month for the month scale row; you may override this function to customize the label

setContextMenu

adds custom context menu of type dhtmlXMenuObject

setEditable

defines whether GanttChart is editable by user

setImagePath

sets path to image directory

setMonthNames

defines full month names for your locale

setShortMonthNames

defines short month names for your locale

setStylePath

set path to styles file, default is “codebase/style.css”; used in simple printing method printToWindow

showContextMenu

enables or disables default context menu in tree, which can be used for basic task manipulations

showDescProject

enables or disables inline project description (displayed right after the project bar), and configures the shown values

showDescTask

enables or disables inline task description (displayed right after the task bar), and configures the shown values

showNewProject

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

showTooltip

show/hide task & project tooltip (info panel)

showTreePanel

show/hide left side tree panel

useShortMonthNames

use short or full month name in the month label axis

 

GanttChart对象

运行时方法 - create()方法之前调用

clearAll

clears all control's contents

deleteProject

deletes project from chart by id

getPrintableHTML

returns chart in html format suitable for printing, full-sized and without scrollbars

getProjectById

returns GanttProject object by id

getXML

returns XML string representation of the chart content

insertProject

inserts new project with specified id, name, start date and returns it

loadData

loads XML data from string or file

printToWindow

opens chart full-sized in a new window, from where you can print it as you like

saveData

saves XML data to server using URL specified in setSavePath and encoding “application/x-www-form-urlencoded”

setLoadPath

sets URL which is used to load chart data with loadData method调用服务器端servlet来载入数据;loadData方法之前调用;

setSavePath

sets URL which is used to save chart data with saveData method:调用服务器端servlet来保存数据,saveDate方法之前调用;

 

4.2.2  GanttProject对象api

GanttProject对象

isProject

this is object property, equals true; used to distinguish Project and Task in menu event handler

deleteTask

deletes task from project by id

getDuration

calculates and returns the duration of project in hours

getId

returns id of project

getName

returns name of project

getPercentCompleted

calculates and returns percent completed of project

getStartDate

returns start date of project

getTaskById

returns GanttTask object by id

insertTask

inserts new task with specified id, name, start date, duration, percent completed, predecessor task Id, parent task Id and returns it

setName

sets name of this project

setPercentCompleted

sets percent completed for this project

 

4.2.3  GanttTask对象api

GanttTask对象

isTask

this is object property, equals true; used to distinguish Project and Task in menu event handler

getDuration

返回工期(用小时表示)

getEST

获取任务计划开始时间

getFinishDate

计算返回任务完成时间

getId

返回任务编号

getName

返回任务名称

getParentTaskId

返回父任务编号

getPercentCompleted

获取任务完成比例

getPredecessorTaskId

获取前置任务编号

setDuration

设置任务工期

setEST

设置任务计划开始时间

setName

设置任务名称

setPercentCompleted

设置任务完成百分比

setPredecessor

设置前置任务

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图

    图书馆管理系统Gantt图,基于Visio 2016绘制的Gantt图

    ext-gantt1.8

    可应用于项目管理系统、生产执行系统(MES)、资源管理 系统(ERP)或其它的任务资源分配相关领域的应用程序的。Ext Gantt甘特图完全兼容Extjs语法,熟悉Extjs可以轻易上手。 Ext Gantt甘特图可与任意后端代码(asp...

    项目管理_gantt

    项目管理

    ext-gantt2.0

    Ext Gantt甘特图 是基于Extjs核心库的开发的,基于WEB浏览器的...可应用于项目管理系统、 ERP 系统、MES系统或其它的任务资源分配相关领域的应用程序的。Ext Gantt甘特图 完全兼容Extjs语法,熟悉Extjs可以轻易上手。

    dhtmlxGantt.doc

    自己项目中用到了dhtmlxGantt,所以结合自己的项目使用实例写的应用文档,从引入到应用,一步步来可实现相应效果,如有问题可私信讨论。

    gantt图的简单做法示例精典

    gantt图的简单做法示例精典gantt图的简单做法示例精典gantt图的简单做法示例精典gantt图的简单做法示例精典

    Ext gantt 龙博甘特图+ jsp的demo

    可应用于项目管理系统、 生产执行系统(MES)、资源管理 系统(ERP)或其它的任务资源分配相关领域的应用程序的。 Ext Gantt甘特图完全兼容Extjs语法,熟悉Extjs可以轻易上手。 Ext Gantt甘特图可与任意后端代码...

    JQuery Gantt-Demo

    JQuery Gantt-Demo

    dhtmlxGantt.rar

    dhtmlxGantt最新版本,web端甘特图,示例,源码,使用手册。例子比较齐全。从官网打包下载。

    银行系统Gantt chart

    银行系统分有管理子系统,贷款子系统,存款子系统,以及网上银行子系统。Gantt chart用于系统进程管理和时间,人员,任务进度分配!支持原创!!

    gantt_trial.zip

    gantt DhtmlxGantt Pro试用版

    gantt-latest

    gantt-latest

    Gantt chart开源软件

    基于Java swing的开源Gantt图程序e-gantt

    dhtmlxGantt_v4.0.0

    甘特图(dhtmlxgantt)的资源文件,具体代码请访问https://blog.csdn.net/qq_27339781/article/details/79869584

    2018 最新 dhtmlxGantt 官网甘特图示例

    2018 最新 dhtmlxGantt 官网甘特图示例。 该资源是从官网下载的标准版的免费版本的 dhtmlxGantt示例,官网下载比较麻烦,这是最新的,可点击下载参考学习。 dhtmlxGantt 甘特图

    dhtmlx gantt甘特图标准库及例子

    开源dhtmlx gantt甘特图标准库及例子,非专业付费版本

    前端项目-frappe-gantt.zip

    前端项目-frappe-gantt,一个简单、现代、交互式的网络甘特库

    gantt甘特图插件

    gantt图插件,根据国外的gantt.js修改,原版有BUG,修改后gantt环节上支持hover和click事件~

    jQuery-gantt案例,下载即可用

    JQuery.Gantt是一个开源的基于JQuery库的用于实现甘特图效果的可扩展功能的JS组件库。 我这里是一个实例包,下载即可用;

Global site tag (gtag.js) - Google Analytics