jquery甘特图,甘特图 js

这叫什么图？用excel能做不？咋做？求教了

甘特图（Gantt chart）又叫横道图、条状图(Bar chart)。它是在第一次世界大战时期发明的，以亨利·L·甘特先生的名字命名，他制定了一个完整地用条形图表进度的标志系统。甘特图内在思想简单，即以图示的方式通过活动列表和时间刻度形象地表示出任何特定项目的活动顺序与持续时间。基本是一条线条图，横轴表示时间，纵轴表示活动（项目），线条表示在整个期间上计划和实际的活动完成情况。它直观地表明任务计划在什么时候进行，及实际进展与计划要求的对比。管理者由此可便利地弄清一项任务（项目）还剩下哪些工作要做，并可评估工作进度。

创新互联建站长期为上千余家客户提供的网站建设服务，团队从业经验10年，关注不同地域、不同群体，并针对不同对象提供差异化的产品和服务；打造开放共赢平台，与合作伙伴共同营造健康的互联网生态环境。为阿合奇企业提供专业的网站制作、网站设计，阿合奇网站改版等技术服务。拥有10余年丰富建站经验和众多成功案例,为您定制开发。

目录

简介

发明人

优点

局限

含义

图表

应用范围

展开

简介

发明人

优点

局限

含义

图表

应用范围

展开

编辑本段简介

甘特图是基于作业排序的目的，将活动与时间联系起来的最早尝试之一。该图能帮助企业描述对诸如工作中心、超时工作等资源的使用图。当用于负荷时，甘特图可以显示几个部门、机器或设备的运行和闲置情况。这表示了该系统的有关工作负荷状况，这样可使管理人员了解何种调整是恰当的。例如，当某一工作中心处于超负荷状态时，则低负荷工作中心的员工可临时转移到该工作中心以增加其劳动力，或者，在制品存货可在不同工作中心进行加工，则高负荷工作中心的部分工作可移到低负荷工作中心完成，多功能的设备也可在各中心之间转移。但甘特负荷图有一些重要的局限性，它不能解释生产变动如意料不到的机器故障及人工错误所形成的返工等。甘特排程图可用于检查工作完成进度。它表明哪件工作如期完成，哪件工作提前完成或延期完成。在实践中还可发现甘特图的多种用途。

甘特图

编辑本段发明人

亨利·劳伦斯·甘特是泰勒创立和推广科学管理制度的亲密的合作者，也是科学管理运动的先驱者之一。甘特非常重视工业中人的因素，因此他也是人际关系理论的先驱者之一。其对科学管理理论的重要贡献：

1提出了任务和奖金制度。

2强调对工人进行教育的重要性，重视人的因素在科学管理中的作用。——其在科学管理运动先驱中最早注意到人的因素；“工业的习惯”

3制定了甘特图——生产计划进度图（是当时管理思想的一次革命）

他在20世纪早期引用了这种工作和方法。在图上，项目的每一步在被执行的时间段中用线条标出。完成以后，甘特图能以时间顺序显示所要进行的活动，以及那些可以在同时进行的活动。

个人甘特图和时间表是两种不同的任务表达方式，个人甘特图使用户可以直观地知道有哪些任务在什么时间段要做，而时间表则提供更精确的时间段数据。此外，用户还可以在时间表中直接更新任务进程。

编辑本段优点

图形化概要，通用技术，易于理解；

中小型项目一般不超过30项活动；

有专业软件支持，无须担心复杂计算和分析。

编辑本段局限

甘特图事实上仅仅部分地反映了项目管理的三重约束（时间、成本和范围），因为它主要关注进程管理（时间）；

甘特图

软件的不足：尽管能够通过项目管理软件描绘出项目活动的内在关系，但是如果关系过多，纷繁芜杂的线图必将增加甘特图的阅读难度。

编辑本段含义

甘特图

甘特图包含以下三个含义：

1、以图形或表格的形式显示活动；

2、现在是一种通用的显示进度的方法；

3、构造时应包括实际日历天和持续时间，并且不要将周末和节假日算在进度之内。

甘特图具有简单、醒目和便于编制等特点，在企业管理工作中被广泛应用。甘特图按反映的内容不同，可分为计划图表、负荷图表、机器闲置图表、人员闲置图表和进度表等五种形式。

编辑本段图表

简述

在甘特图中，横轴方向表示时间，纵轴方向并列机器设备名称、操作人员和编号等。图表内以线条、数字、文字代号等来表示计划(实际)所需时间，计划(实际)产量，计划(实际)开工或完工时间等。

甘特图

变形—负荷

纵轴不再列出活动，而是列出整个部门或特定的资源。负荷图使管理者对生产能力进行计划和控制。

绘制步骤

1.明确项目牵涉到的各项活动、项目。内容包括项目名称（包括顺序）、开始时间、工期，任务类型（依赖/决定性）和依赖于哪一项任务。

2.创建甘特图草图。将所有的项目按照开始时间、工期标注到甘特图上。

甘特图

3.确定项目活动依赖关系及时序进度。使用草图，按照项目的类型将项目联系起来，并安排项目进度。

此步骤将保证在未来计划有所调整的情况下，各项活动仍然能够按照正确的时序进行。 也就是确保所有依赖性活动能并且只能在决定性活动完成之后按计划展开。

同时避免关键性路径过长。关键性路径是由贯穿项目始终的关键性任务所决定的，它既表示了项目的最长耗时， 也表示了完成项目的最短可能时间。请注意，关键性路径会由于单项活动进度的提前或延期而发生变化。 而且要注意不要滥用项目资源，同时，对于进度表上的不可预知事件要安排适当的富裕时间（Slack Time）。 但是，富裕时间不适用于关键性任务，因为作为关键性路径的一部分，它们的时序进度对整个项目至关重要。

4.计算单项活动任务的工时量。

5.确定活动任务的执行人员及适时按需调整工时。

甘特图

6.计算整个项目时间

编辑本段应用范围

1. 项目管理：在现代的项目管理里，被广泛的应用。这可能是最容易理解、最容易使用并最全面的一种。它可以让你预测时间、成本、数量及质量上的结果并回到开始。它也能帮助你考虑人力、资源、日期、项目中重复的要素和关键的部分，你还能把10张各方面的甘特图集成为一张总图。以甘特图的方式，可以直观的看到任务的进展情况，资源的利用率等等。[1]

2. 其它领域：如今甘特图不单单被应用到生产管理领域，随着生产管理的发展、项目管理的扩展，它被应用到了各个领域，如：建筑、IT软件、汽车等等。

编辑本段制作工具

1、Microsoft OfficeProject

微软出品的通用型项目管理软件，在国际上享有盛誉，凝集

project界面效果

了许多成熟的项目管理现代理论和方法，可以帮助项目管理者实现时间、资源、成本的计划、控制。

2、GanttProject

JAVA开源的项目管理软件，支持可用资源、里程碑、任务/子任务，以及任务的起始日期、

GanttProject界面

持续时间、相依性、进度、备注等等，可输出 PNG/JPG 图片格式、HTML 网页，或是 PDF 档案格式。

3、VARCHART XGantt

。NET甘特图控件，支持以甘特图、柱状图的形式来编辑、打印以及图形化的表示数据，

XGANTT界面效果

能够实现与Project或P/6相似的界面效果，并支持集成到项目管理、生产排程等应用程序中。

4.jQuery.Gantt

基于jQuery的一个甘特图图表插件，可以实现甘特图。功能包括：读取JSON数据、结果分页、对每个任务用不同颜色显示、使用一个简短的描述作为提示、标注节假日等。

求jQuery做的甘特图实例，或类似甘特图的实例！不胜感激！.......

甘特图是条状图的一种流行类型，显示项目，进度，和其他时间相关的系统进展的内在关系随着时间进展的情况。

在项目管理中，Gantt22图显示项目的终端元素的开始和结束，概要元素或终端元素的依赖关系。

甘特图是由亨利·甘特于1910年开发出来的。

甘特图在许多项目管理软件包中都有体现，如Microsoft Project和Mr. Project。

jquery 简介

JQuery是继prototype之后又一个优秀的Javascript库。它是轻量级的js库 ，它兼容CSS3，还兼容各种浏览器（IE 6.0+, FF1.5+, Safari 2.0+, Opera 9.0+），jQuery2.0及后续版本将不再支持IE6/7/8浏览器。jQuery使用户能更方便地处理HTML（标准通用标记语言下的一个应用）、events、实现动画效果，并且方便地为网站提供AJAX交互。jQuery还有一个比较大的优势是，它的文档说明很全，而且各种应用也说得很详细，同时还有许多成熟的插件可供选择。jQuery能够使用户的html页面保持代码和html内容分离，也就是说，不用再在html里面插入一堆js来调用命令了，只需要定义id即可。

jQuery是一个兼容多浏览器的javascript库，核心理念是write less,do more(写得更少,做得更多)。jQuery在2006年1月由美国人John Resig在纽约的barcamp发布，吸引了来自世界各地的众多JavaScript高手加入，由Dave Methvin率领团队进行开发。如今，jQuery已经成为最流行的javascript库，在世界前10000个访问最多的网站中，有超过55%在使用jQuery。

jQuery是免费、开源的，使用MIT许可协议。jQuery的语法设计可以使开发更加便捷，例如操作文档对象、选择DOM元素、制作动画效果、事件处理、使用Ajax以及其他功能。除此以外，jQuery提供API让开发者编写插件。其模块化的使用方式使开发者可以很轻松的开发出功能强大的静态或动态网页。

jQuery，顾名思义，也就是JavaScript和查询（Query），即是辅助JavaScript开发的库。

历史

大概在 1992 年，一家称作 Nombas 的公司开发了一种叫做 C 减减（C-minus-minus，简称 Cmm）的嵌入式脚本语言。Cmm 背后的理念很简单：一个足够强大可以替代宏操作（macro）的脚本语言，同时保持与 C （和 C ++）足够的相似性，以便开发人员能很快学会。这个脚本语言捆绑在一个叫做 CEnvi 的共享软件中，它首次向开发人员展示了这种语言的威力。

Nombas 最终把 Cmm 的名字改成了 ScriptEase，原因是后面的部分（mm）听起来过于消极，同时字母 C “令人害怕”。

当 Netscape Navigator 崭露头角时，Nombas 开发了一个可以嵌入网页中的 CEnvi 的版本。这些早期的试验被称为 Espresso Page（浓咖啡般的页面），它们代表了第一个在万维网上使用的客户端语言。而 Nombas 丝毫没有料到它的理念将会成为万维网的一块重要基石。

当网上冲浪越来越流行时，对于开发客户端脚本的需求也逐渐增大。此时，大部分因特网用户还仅仅通过 28.8 kbit/s 的调制解调器连接到网络，即便这时网页已经不断地变得更大和更复杂。而更加加剧用户痛苦的是，仅仅为了简单的表单有效性验证，就要与服务器进行多次地往返交互。设想一下，用户填完一个表单，点击提交按钮，等待了 30 秒的处理后，看到的却是一条告诉你忘记填写一个必要的字段。

那时正处于技术革新最前沿的 Netscape，开始认真考虑开发一种客户端脚本语言来解决简单的处理问题。

当时工作于 Netscape 的 Brendan Eich，开始着手为即将在 1995 年发行的 Netscape Navigator 2.0 开发一个称之为 LiveScript 的脚本语言，当时的目的是在浏览器和服务器（本来要叫它 LiveWire）端使用它。Netscape 与 Sun 及时完成 LiveScript 实现。

就在 Netscape Navigator 2.0 即将正式发布前，Netscape 将其更名为 JavaScript，目的是为了利用 Java 这个因特网时髦词汇。Netscape 的赌注最终得到回报，JavaScript 从此变成了因特网的必备组件。

因为 JavaScript 1.0 如此成功，Netscape 在 Netscape Navigator 3.0 中发布了 1.1 版。恰巧那个时候，微软决定进军浏览器，发布了 IE 3.0 并搭载了一个 JavaScript 的克隆版，叫做 JScript（这样命名是为了避免与 Netscape 潜在的许可纠纷）。微软步入 Web 浏览器领域的这重要一步虽然令其声名狼藉，但也成为 JavaScript 语言发展过程中的重要一步。

在微软进入后，有 3 种不同的 JavaScript 版本同时存在：Netscape Navigator 3.0 中的 JavaScript、IE 中的 JScript 以及 CEnvi 中的 ScriptEase。与 C 和其他编程语言不同的是，JavaScript 并没有一个标准来统一其语法或特性，而这 3 种不同的版本恰恰突出了这个问题。随着业界担心的增加，这个语言的标准化显然已经势在必行。

2006年1月，jQuery的第一个版本面世，至今已经有10年多了（注：这个时间点是截止至出书时间）。虽然过了这么久，但它依然以其简洁、灵活的编程风格让人一见倾心。在本篇文章中，我们将讲述jQuery的发展 历史 ，让读者对jQuery有更多的了解。

在jQuery迅速发展的同时，一些大的厂商也看中了商机。2009年9月，微软和诺基亚公司正式宣布支持开源的jQuery库，另外，微软公司还宣称他们将把jQuery作为Visual Studio工具集的一部分。他将提供包括jQuery的智能提示、代码片段、示例文档编制等内容在内的功能。微软和诺基亚公司将长期成为jQuery的用户成员，其他成员还有Google，Intel，IBM，Intuit等公司。

2009年1月，jQuery 1.3版发布，它使用了全新的选择符引擎Sizzle，在各个浏览器下全面超越其他同类型JavaScript框架的查询速度，程序库的性能也因此有了极大提升。这一版本的第2个变化就是提供live()方法，使用live()方法可以为当前及将来增加的元素绑定事件，在1.3版之前，如果要为将来增加的元素绑定事件，需要使用livequery插件，而在1.3版中，可以直接用live()方法。　2005年8月，John Resig提议改进Prototype的“Behaviour”库，于是他在blog上发表了自己的想法，并用了3个例子做说明。

2010年2月，jQuery 1.4.2版发布，它新增了有关事件委托的两个方法：delegate()和undelegate()。delegate()用于替代1.3.2中的live()方法。这个方法比live()来的方便，而且也可以达到动态添加事件的作用。比如给表格的每个td绑定hover事件

特点

1.动态特效

2.AJAX

3.通过插件来扩展

4.方便的工具 - 例如浏览器版本判断

5.渐进增强

6.链式调用

7.多浏览器支持，支持Internet Explorer6.0+、Opera9.0+、Firefox2+、Safari2.0+、Chrome1.0+（在2.0.0中取消了对Internet Explorer6,7,8的支持）

历史 版本

jQuery 1.0

（2006年8月）：该库的第一个稳定版本，已经具有了对CSS选择符、事件处理和AJAX交互的稳健支持。

jQuery 1.1

（2007年1月）：这一版大幅简化了API。许多较少使用的方法被合并，减少了需要掌握和解释的方法数量。

jQuery 1.1.3

（2007年7月）：这次小版本变化包含了对jQuery选择符引擎执行速度的显著提升。从这个版本开始，jQuery的性能达到了Prototype、Mootools以及Dojo等同类JavaScript库的水平。

jQuery 1.2

（2007年9月）：这一版去掉了对XPath选择符的支持，原因是相对于CSS语法它已经变得多余了。这一版能够支持对效果的更灵活定制，而且借助新增的命名空间事件，也使插件开发变得更容易。

jQuery UI（2007年9月）：这个新的插件套件是作为曾经流行但已过时的Interface插件的替代项目而发布的。jQuery UI中包含大量预定义好的部件（widget），以及一组用于构建高级元素（例如可拖放的界面元素）的工具。

jQuery 1.2.6

（2008年5月）：这一版主要是将Brandon Aaron开发的流行的Dimensions插件的功能移植到了核心库中。

jQuery 1.3

（2009年1月）：这一版使用了全新的选择符引擎Sizzle，库的性能也因此有了极大提升。这一版正式支持事件委托特性。

jQuery 1.3.2

（2009年2月）：这次小版本升级进一步提升了库的性能，例如改进了：visible/:hidden选择符、.height()/.width()方法的底层处理机制。另外，也支持查询的元素按文档顺序返回。

jQuery 1.4

（2010年1月14号）：对代码库进行了内部重写组织，开始建立一些风格规范。老的core.js文件被分为attribute.js,css.js,data.js,manipulation.js,traversing.js和queue.js；CSS和attribute的逻辑分离。

重要变化：

1. Ajax重写

Ajax模块完全进行了重写。新增一个jXHR对象，为不同浏览器内置的XMLHttpRequest提供了一致的超集。对于XMLHttpRequest之外的传输机制，比如JSONP请求，jXHR对象也可以进行处理。（详情可以参见：jQuery.ajax文档）

此外，系统的可扩展性大大增强，可以附加各种数据处理器、过滤器和传输机制，为开发新的Ajax插件提供了方便。

2. 延迟对象

延迟对象（Deferred Object，jQuery.Deferred对象）是一个可链接的（chainable）实用工具对象，实现了Promise接口，可以在回调队列中注册多个回调、调用回调队列并转发任何同步/异步函数的成败状态。正如Using Deferreds in jQuery 1.5一文中说明的，其结果是在jQuery中能够将依赖于某个任务（事件）结果的逻辑与任务本身解耦了。这一点在JavaScript中其实并不新鲜，Mochikit和Dojo等已经实现有些日子了。由于jQuery 1.5的Ajax模块内置使用了延迟对象，因此通过jQuery编写Ajax程序将自动获得这一功能。

开发人员借此可以使用无法立即获得的返回值（如异步Ajax请求的返回结果），而且第一次能够附加多个事件处理器。

例如，使用了新的jQuery内部Ajax API就可以实现下面的代码了：

// Assign handlers immediately after making the request,// and remember the jxhr object for this request var jxhr = $.ajax({ url: "example.php" }) .success(function() { alert("success"); }) .error(function() { alert("error"); }) .complete(function() { alert("complete"); });// perform other work here ... // Set another completion function for the request above jxhr.complete(function(){ alert("second complete"); });

此外，使用jQuery.Deferred还可以开发自己的延迟对象。更多详情参见：延迟对象文档。

3. jQuery.sub()

jQuery 1.5提供了一种创建和修改jQuery副本的方式。可以用来添加不向外部公开的方法，或者对jQuery的某些方法进行重新定义以提供新功能，或者提供更好的封装、避免名称空间冲突。当然，也可以用来开发插件，但Resig强烈建议在开发插件之前，先考虑jQuery UI widget工厂。

值得注意的是，sub函数并不提供真正的隔离，所有方法、数据、调用仍然依靠jQuery本身来支持。

4. 遍历性能提高

在新版本中.children(),.prev(),.next()几个常用的遍历函数性能有了显著提高。

5. 内部开发系统

John Resig还特别提到了jQuery团队内部开发系统的两点改变：一是服务器端用Node.js替换了老的Java/Rhino系统，使得团队可以专注于JavaScript环境的新变化；二是所用的代码优化程序从Google Closure切换到UglifyJS，新工具的压缩效果非常令人满意。

使用方法

jQuery可以下载使用，有两个版本的 jQuery 可供下载

Production version - 用于实际的网站中，已被精简和压缩。

Development version - 用于测试和开发（未压缩，是可读的代码）

jQuery 1.8.0版时压缩前后的对比

插件机制

jQuery的官方插件是jQuery UI。开发者可以任意扩展jQuery的函数库或者按照自己的需求开发UI组件。网上已经有数以万计的jQuery插件，覆盖各种各样的需求。例如Ajax辅助、数据表格、动态列表、XML工具、拖曳、cookie处理、弹出层等等。jQuery 的文档说明很全，而且各种应用也说得很详细，同时还有许多成熟的插件可供选择,例如ComponentOne Studio for ASP NET Wijmo.

随着jQuery插件在网站建设过程中的使用率不断的增加，所以有必要跟进时代步伐开发出一些新的插件/代码片段，以此来巩固并提高前端用户体验，将用户体验提升到一个新的高度。其中包括Flat jQuery Price Slider、Gmaps jQuery Map Plugin 、FormChimp——MailChimp Ajax plugin for jQuery 等。

控件

jQuery Gantt控件是一个基于原生HTML5/jQuery，功能丰富的控件，该控件真正实现了跨平台，在许多设备和浏览器中无缝的运行。

使用项目甘特图中内置的调度，依赖等功能实现任务分层列表的可视化。

使用资源甘特图实现一个资源利用视图。

使用基于API的jQuery或者基于API的MVC可帮您轻松地安装甘特图并加快应用速度。

可与诸如KnockOut(KO),jQuery.tmpl等流行的jQuery模式一同使用。