摘要：
甘特图所能支持的数据量，以及界面的渲染和操作性能，是衡量一个甘特图组件是否符合项目需要的重要指标。为了支持超过万级超大数据量的甘特图，Extjs提供一个数据缓冲视图的解决方案。使用这个方案非常简单，只需要在创建甘特图的时候，加入以下代码。1. varg=newSch.gantt.GanttPanel({ 2. 3. view:newSch.gantt.BufferedGanttView({ 4. scrollDelay:false5. }), 6. taskStore:store, 7. dependencyStore:dependencyStore, 8. }); 使用个数据缓冲视图的Ex. 阅读全文
摘要：
甘特图提供多种不同的时间刻度的定义，用户也可以自定义自己的时间刻度。系统内置的时间刻度包括以下六种:1 hourAndDay 小时和天刻度2 dayAndWeek 天和周刻度3 weekAndDay 周和天刻度4 weekAndMonth 周和月刻度5 monthAndYear 月和年刻度6 year 年刻度以下是自定义时间刻度的代码。1. Sch.PresetManager.registerPreset("test",{ 2. timeColumnWidth:20,//Timecolumnwidth,onlyapplicablewhenlockedcolumnsareus 阅读全文
摘要：
ExtJS甘特图控件有很多提示框效果，当鼠标移上，或进行某些操作的时候，提供更多丰富的信息帮助用户更好的操作。1. tooltipTpl:newExt.XTemplate( 2. '<h4class="tipHeader">{Name}</h4>', 3. '<tableclass="taskTip">', 4. '<tr><td>开始时间：</td><tdalign="right">{[values.Start 阅读全文
摘要：
以上我们讨论的自定义内容都是对于左边的树形表格，Extjs甘特图也提供各种机制自定义右边的条形图。以下我们讨论的自定义，都是定义某一个或几个任务的条形图。要自定义整个甘特图的风格，请参看高级应用中的《皮肤和主题》。自定义样式基于条形图的HTML结构和样式，通过修改样式的边框线、背景图片和背景色，达到修改外观的目的。GanttPanel提供一个eventRenderer回调函数， 该函数在渲染条形图之前被调用，返回一个css样式或者一个css类。以下的例子演示了，当任务的周期超过7天，条形图高亮（背景变为红色）。1. eventRenderer:function(r){ 2. if(Sch.ut 阅读全文
摘要：
GanttPanel中默认的设置很难满足客户多变需求，我们就针对一些常用的扩展做一个说明。 一般最常用的需求是，自定义多列，自定义行，自定义单元格等等。下面我们就分别来说明。自定义列GanttPanel的列配置对象，描述了表头、单元格、编辑器等重要配置。一般来说， 我们提供一个列配置对象，显示了“序号”、“任务名称”、“开始日期”、“完成日期”、“进度”等比较典型的列。 但是有时我们会显示更多的任务属性，例如，任务的部门，负责人，地点等等。自定义列非常简单，只要在配置GanttPanel的列配置对象中多添加一个单元既可。见以下例子1. varg=newSch.gantt.GanttPanel( 阅读全文
摘要：
甘特图的数据结构分为两部分，任务的数据和任务依赖关系的数据。这种设计大幅度的降低了数据之间的耦合关系，也更加接近于我们平时的数据库设计，降低了和数据库接口之间的难度。任务的数据结构 先看一个任务的数据结构简单的XML的例子。1. <Tasks>2. <Task>3. <Id>1</Id>4. <Name>Planning</Name>5. <StartDate>2010-01-18T00:00:00-08:00</StartDate>6. <EndDate>2010-02-02T00:0 阅读全文
摘要：
和甘特图打交道，就不得不和DataStore打交道，甘特图中的数据是存放类型为Store 的数据存储器中，通过指定甘特图中的store 属性来设置表格中显示的数据，通过调用store 的load 或reload方法可以重新加载表格中的数据。ExtJS 中用来定义控件中使用数据的API 位于Ext.Data 命名空间中，本附录我们重点对ExtJS 中的数据存储Store 进行介绍。Record首先需要明确是，ExtJS 中有一个名为Record 的类，表格等控件中使用的数据是存放在Record 对象中，一个Record 可以理解为关系数据表中的一行，也可以称为记录。Record 对象中即包含了记 阅读全文