Extjs甘特图的高级应用

Extjs甘特图的大数据量和性能优化

Extjs甘特图所能支持的数据量,以及界面的渲染和操做性能,是衡量一个甘特图组件是否符合项目须要的重要指标。html

为了支持超过万级超大数据量的甘特图,Extjs提供一个数据缓冲视图的解决方案。使用这个方案很是简单,只须要在建立甘特图的时候,加入如下代码。性能优化

 

1.       var g = new Sch.gantt.GanttPanel({   工具

2.                      性能

3.                   view : new Sch.gantt.BufferedGanttView({   测试

4.                       scrollDelay : false  大数据

5.                   }),   优化

6.                   taskStore : store,   htm

7.                   dependencyStore : dependencyStore,   内存

8.               });   rem

 

使用个数据缓冲视图的Extjs甘特图能支持10万条以上的数据量。在咱们的测试中,内存开销和性能体验都很是好。

皮肤和主题

若是你不想让你的应用千人一面,那么Extjs甘特图提供的“皮肤和主题”功能就很是有必要了。Extjs甘特图提供三种不一样风格的皮肤和样式,你也能够在美工的配合下自定义本身的皮肤和主题。

 

自定义主题1

 

自定义主题2

 

自定义主题3

如下的代码展现了经过CSS更改样式的多种方法。点击工具栏按钮更改样式。

1.       var g = new Sch.gantt.GanttPanel({   

2.          ...   

3.       });   

4.       handler : function() {   

5.           g.el.removeClass(['style2', 'style3']).addClass('style1');   

6.           g.view.refresh();   

7.       }  

别忘记调用view.refresh()来刷新视图。

相关文章
相关标签/搜索