這篇文章給大家講解dhtmlxGantt如何調整網格的行大小。

DhtmlxGantt正版試用下載

可以更改網格中單獨行的高度，dhtmlxGantt 庫提供了兩種管理行高的方法：

• 通過為必要的任務對象設置行的高度和任務欄的高度；
• 通過拖動網格行的底部邊框。

gantt.config.columns = [
    {name:"wbs", label:"WBS", width:40, template:gantt.getWBSCode },   
    {name:"text", label:"Task name", tree:true, width:170 },
    {name:"start_date", align:"center", width: 90},
    {name:"duration", align:"center", width: 60},
    {name:"add", width:40}
];

設置行高

您可以根據需要調整特定行的高度。

為此，您需要重新定義 的row_height 和 bar_height屬性： 數據集中任務對象

gantt.parse({
    data: [
        { id: 11, text: "Project #1", type: "project", progress: 0.6, open: true, 
            row_height: 70, bar_height: 60 },     
        { id: 12, text: "Task #1", start_date: "03-04-2018", duration: "5", 
            parent: "11", progress: 1, open: true },
        { id: 13, text: "Task #2", start_date: "03-04-2018", type: "project", 
            parent: "11", progress: 0.5, open: true }
    ],
    links: []
});

或者您可以動態實現它：

gantt.getTask(11).row_height = 50;
gantt.getTask(11).bar_height = 25;
// re-render Gantt to apply the changes
gantt.render();

通過拖放調整行大小

要讓用戶可以通過拖動行的底部邊框來調整網格中的行大小，請將 gantt.config.resize_rows 選項設置為 true ：

gantt.config.resize_rows = true;

gantt.config.min_task_grid_row_height ： 選項提供了定義在調整大小期間可以為任務設置的最小行高的能力

gantt.config.min_task_grid_row_height = 45;

dhtmlxGantt是用于跨瀏覽器和跨平臺應用程序的功能齊全的Gantt圖表，可滿足項目管理控件應用程序的所有需求，是最完善的甘特圖圖表庫。了解更多DhtmlxGantt相關內容和資訊，歡迎在線咨詢或者私信我獲取正版試用版及報價。

甘特圖控件交流群：764148812    歡迎進群交流討論

更多正版甘特圖軟件下載、購買、授權咨詢，請點這里！