想要購(gòu)買dhtmlxDiagram正版授權(quán)，或了解慧都APS系統(tǒng)請(qǐng)點(diǎn)擊

dhtmlxGantt是用于跨瀏覽器和跨平臺(tái)應(yīng)用程序的功能齊全的Gantt圖表。可滿足項(xiàng)目管理應(yīng)用程序的所有需求，是最完善的甘特圖圖表庫(kù)。它允許你創(chuàng)建動(dòng)態(tài)甘特圖，并以一個(gè)方便的圖形化方式可視化項(xiàng)目進(jìn)度。有了dhtmlxGantt，你可以顯示活動(dòng)之間的依賴關(guān)系，顯示具有完成百分比陰影的當(dāng)前任務(wù)狀態(tài)以及組織活動(dòng)到樹結(jié)構(gòu)。

點(diǎn)擊下載dhtmlxGantt試用版

從版本5.0開始，Gantt提供了指定可配置布局并將組件的元素安排為布局內(nèi)部視圖的可能性。它允許您使用其他時(shí)間軸和網(wǎng)格來(lái)制作靈活的甘特圖結(jié)構(gòu)并定義各種布置元素的方案。

例如，您可以在時(shí)間線的右側(cè)放置一個(gè)網(wǎng)格：

或在默認(rèn)網(wǎng)格下方添加另一個(gè)網(wǎng)格和時(shí)間線。

通過(guò)gantt.config.layout配置選項(xiàng)設(shè)置布局。布局的默認(rèn)配置如下：

gantt.config.layout = {
    css: "gantt_container",
    rows:[
        {
           cols: [
            {
              // the default grid view  
              view: "grid",  
              scrollX:"scrollHor", 
              scrollY:"scrollVer"
            },
            { resizer: true, width: 1 },
            {
              // the default timeline view
              view: "timeline", 
              scrollX:"scrollHor", 
              scrollY:"scrollVer"
            },
            {
              view: "scrollbar", 
              id:"scrollVer"
            }
        ]},
        {
            view: "scrollbar", 
            id:"scrollHor"
        }
    ]
}

甘特圖的布局由被視圖占據(jù)的單元格組成。主要和輔助甘特元素由視圖呈現(xiàn)，它們是：

• grid-定義甘特圖的網(wǎng)格部分。預(yù)定義的用于顯示任務(wù)的主網(wǎng)格具有id：“ grid” ;
• 時(shí)間線-定義甘特圖的時(shí)間線部分。預(yù)定義的用于顯示任務(wù)的主時(shí)間軸具有ID：“ timeline”；
• 調(diào)整大小-定義調(diào)整大小行。要啟用調(diào)整器，您需要將resizer屬性設(shè)置為true。僅在PRO版中提供;
• 滾動(dòng)條-定義甘特圖中使用的滾動(dòng)條。網(wǎng)格和時(shí)間軸視圖可以綁定到特定的滾動(dòng)條。閱讀下面的詳細(xì)信息。
• resourceGrid-資源面板的預(yù)配置網(wǎng)格。僅在PRO版本中可用。
• resourceTimeline-資源面板的預(yù)配置時(shí)間線。僅在PRO版本中可用。

視圖配置被指定為具有相應(yīng)屬性的對(duì)象。您可以為網(wǎng)格視圖和時(shí)間軸視圖設(shè)置自定義配置選項(xiàng)。默認(rèn)選項(xiàng)來(lái)自全局gantt.config對(duì)象。

下一節(jié)內(nèi)容中我們將繼續(xù)講解如何設(shè)置滾動(dòng)條！

想要購(gòu)買dhtmlxDiagram正版授權(quán)，或了解慧都APS系統(tǒng)請(qǐng)點(diǎn)擊