Ext Gantt Web甘特图--时间刻度和自定义

甘特图提供多种不同的时间刻度的定义,用户也可以自定义自己的时间刻度。系统内置的时间刻度包括以下六种:

1       hourAndDay 小时和天刻度

2       dayAndWeek 天和周刻度

3       weekAndDay 周和天刻度

4       weekAndMonth 周和月刻度

5       monthAndYear 月和年刻度

6       year 年刻度

以下是自定义时间刻度的代码。

1.       Sch.PresetManager.registerPreset("test", {   

2.               timeColumnWidth : 20,   // Time column width, only applicable when locked columns are used   

3.               displayDateFormat : "Y-m-d",  // Controls how dates will be displayed in tooltips etc   

4.               shiftIncrement : 1,     // Controls how much time to skip when calling shiftNext and shiftPrevious.   

5.               shiftUnit : "w",      // Valid values are "MILLI", "SECOND", "MINUTE", "HOUR", "DAY", "WEEK", "MONTH", "QUARTER", "YEAR".   

6.               defaultSpan : 12,       // By default, if no end date is supplied to a view it will show 12 hours   

7.               timeResolution : {      // Dates will be snapped to this resolution   

8.                   unit : "d",    // Valid values are "MILLI", "SECOND", "MINUTE", "HOUR", "DAY", "WEEK", "MONTH", "QUARTER", "YEAR".   

9.                   increment : 1   

10.           },   

11.           headerConfig : {    // This defines your header, you must include a "middle" object, and top/bottom are optional. For each row you can define "unit", "increment", "dateFormat", "renderer", "align", and "scope"   

12.               middle : {                

13.                   unit : "w",   

14.                   dateFormat : "D d M Y"  

15.               },   

16.               /*top : {  

17.                   unit : "Month",  

18.                   dateFormat : 'D d/m'  

19.               },*/  

20.               bottom:{   

21.                   increment:1,   

22.                   unit:"d",   

23.                   renderer:function(a, b, c, d){   

24.                       return a.getDate();   

25.                   }   

26.               }   

27.           }   

28.   });  

时间: 2024-09-20 10:42:30

Ext Gantt Web甘特图--时间刻度和自定义的相关文章

Ext Gantt Web甘特图--自定义任务树

  GanttPanel中默认的设置很难满足客户多变需求,我们就针对一些常用的扩展做一个说明.       一般最常用的需求是,自定义多列,自定义行,自定义单元格等等.下面我们就分别来说明. 自定义列 GanttPanel的列配置对象,描述了表头.单元格.编辑器等重要配置.一般来说, 我们提供一个列配置对象,显示了"序号"."任务名称"."开始日期"."完成日期"."进度"等比较典型的列. 但是有时我们会显

Ext Gantt Web甘特图--DataStore

和甘特图打交道,就不得不和DataStore打交道,甘特图中的数据是存放类型为Store 的数据存储器中,通过指定甘特图中的store 属性来设置表格中显示的数据,通过调用store 的load 或reload方法可以重新加载表格中的数据.ExtJS 中用来定义控件中使用数据的API 位于Ext.Data 命名空间中,本附录我们重点对ExtJS 中的数据存储Store 进行介绍. Record 首先需要明确是,ExtJS 中有一个名为Record 的类,表格等控件中使用的数据是存放在Record

Ext Gantt Web甘特图--自定义提示框

ExtJS甘特图控件有很多提示框效果,当鼠标移上,或进行某些操作的时候,提供更多丰富的信息帮助用户更好的操作. 1.       tooltipTpl : new Ext.XTemplate(    2.           '<h4 class="tipHeader">{Name}</h4>',    3.           '<table class="taskTip">',     4.           '<tr

Ext Gantt Web甘特图--高级应用

甘特图所能支持的数据量,以及界面的渲染和操作性能,是衡量一个甘特图组件是否符合项目需要的重要指标. 为了支持超过万级超大数据量的甘特图,Extjs提供一个数据缓冲视图的解决方案.使用这个方案非常简单,只需要在创建甘特图的时候,加入以下代码.   1.       var g = new Sch.gantt.GanttPanel({    2.                       3.                   view : new Sch.gantt.BufferedGantt

在Excel2010中绘制简单的甘特图

甘特图(Gantt Chart)又称横道图,它通过图示形象地表示特定项目的活动顺序与持续时间.在Excel 2003中,可用用自定义图表类型中的"悬浮的条形图"来快速绘制简单的甘特图,而在Excel 2007/2010中,没有现成的自定义图表类型可用,但通过堆积条形图同样可以轻松实现.下面以Excel 2010为例来说明绘制步骤,Excel 2007中的制作步骤类似,示例文件可在文章结尾处下载. 上图A列为某工程一些项目代号,B至D列为"开始日期"."天数

Excel 2007绘制甘特图查看项目安排情况

  在Excel 2007中使用图表来进行分析数据,通常大家会选择使用较常见的图表类型,比如图柱.还有一个类型更能体现出表格中的数据,那就是甘特图,也是一种线条图,非常适合用在工程进度的数据上. 下面的过程可帮助在Excel2007中创建甘特图(Gantt Chart).对于此图表,我们使用示例工作表数据.您可以将这些数据复制到工作表中,也可以使用自己的数据,只要使用的列标题和工作表结构是相同的. 将示例工作表数据复制到一个空白工作表中,或者打开包含要绘制到甘特图中的数据的工作表; 工作表数据

echarts甘特图的实现问题

问题描述 echarts甘特图的实现问题 由于项目需要使用甘特图展现设备的运行和.停机记录和故障记录,每条数据都有开始时间和结束时间.选择了很多JS图表组件,amchart.highchart.echarts等,最终决定使用echarts,数据量大时加载速度也很理想.问题来了,由于echarts没有专门的甘特图,我们使用了堆积图展示数据,但是如果数据里出现2条以上相同开始时间和结束时间的数据时,就会出现依次向后堆积的情况,同时会印象X轴(时间轴)的显示,出现时间刻度错位的现象.想了很多办法没有解

如何使用excel画甘特图

       甘特图小伙伴们都非常的熟悉,首先小编简单的向各位小伙伴介绍一下什么是甘特图,甘特图内在思想简单,即以图示的方式通过活动列表和时间刻度形象地表示出任何特定项目的活动顺序与持续时间.基本是一条线条图,横轴表示时间,纵轴表示活动(项目),线条表示在整个期间上计划和实际的活动完成情况.它直观地表明任务计划在什么时候进行,及实际进展与计划要求的对比.管理者由此可便利地弄清一项任务(项目)还剩下哪些工作要做,并可评估工作进度.         还记得在软考的时候,甘特图经常和PERT图放在一起

甘特图入门介绍

这不涉及公司机密,是我查资料查到的. 计算所许佳铭博士说的话:在研究的过程中,我发觉几乎很少有研究者提供不同对比方法的代码.这为研究带来了很大不便,而且我坚信在研究的过程中,我们应专注于新算法的设计,而不是新人进来时都得重新造轮子,我们可以在现有代码的基础上学习它,并将它进行拓展,为自己使用. 一.介绍 甘特图(Gantt Chart)由亨利·甘特于1910年开发的,他通过条状图来显示项目,进度,和其他时间相关的系统进展的内在关系随着时间进展的情况. 其中,横轴表示时间,纵轴表示活动(项目).线