dhtmlxGantt是用于跨瀏覽器和跨平臺應用程序的功能齊全的Gantt圖表。可滿足項目管理應用程序的所有需求，是最完善的甘特圖圖表庫。它允許你創建動態甘特圖，并以一個方便的圖形化方式可視化項目進度。有了dhtmlxGantt，你可以顯示活動之間的依賴關系，顯示具有完成百分比陰影的當前任務狀態以及組織活動到樹結構。

點擊下載dhtmlxGantt試用版

導出到MS Project

甘特組件允許將鏈接，任務和資源導出到MS Project中。

要將數據從甘特圖導出到MS Project，請執行以下操作：

• 在頁面上包含“ //export.dhtmlx.com/gantt/api.js”文件以啟用在線導出服務：

<script src="codebase/dhtmlxgantt.js"></script>
<script src="http://export.dhtmlx.com/gantt/api.js"></script>  
<link rel="stylesheet" href="codebase/dhtmlxgantt.css" type="text/css">

• 調用exportToMSProject方法以從甘特圖導出數據。

gantt.exportToMSProject();

響應

響應將包含以下結構的JSON：

{
   data: {},
   config: {},
   resources: [],
   worktime: {}
}

• 數據-甘特數據對象。每個任務具有以下屬性：id，open，parent，progress，start_date，text，resource。日期以“％Y-％m-％d％H：％i”格式進行字符串化。
• 配置-甘特配置有從項目文件中檢索設置對象。
• resources-資源的數組（代表每個對象具有以下屬性：{ id：字符串，name：string，type：string }），它們表示項目文件中的資源列表。
• 工作時間-包含從項目日歷的工作時間設置的對象。

所述exportToMSProject（）方法作為一個參數的對象與多個屬性（所有屬性是可選的）：

• name- （string）獲得的文件（“gantt.xml”默認）的名稱。

gantt.exportToMSProject({
    name:'custom.xml'
});

• auto_scheduling-（布爾值）指示導出項目中任務的計劃模式。true會將任務標記為自動調度，false會將任務標記為手動調度（默認狀態）。

gantt.exportToMSProject({
    auto_scheduling: false
});

• skip_circular_links-（布爾值）指示是否將刪除循環鏈接（true-將被刪除（默認模式），false-將不會被刪除）。

gantt.exportToMSProject({
    skip_circular_links: false
});

• project-（object）允許為導出的項目實體設置自定義屬性

gantt.exportToMSProject({
    project: {
        'Author': 'I am!',
        'MinutesPerDay': function () {
            return gantt.config.hours_per_day * 60;
        }
    }
});

• tasks-（object）允許為導出的任務項設置自定義屬性

gantt.exportToMSProject({
   tasks: {
       'StartVariance': function (task) {
           if (task.startVariance)
               return task.startVariance;
           else
               return 0;
       },
       'PercentWorkComplete': function (task) {
           return (task.progress + 0.1);
       },
       'Custom': function (task) {
           return 'Custom value';
       },
       'Custom 2': 'My Custom value'
   }
});

• callback-（函數）如果要接收下載下載生成的XML的URL，則可以使用callback屬性。它接收到具有url屬性的JSON對象：

gantt.exportToMSProject({
    callback: function(res){
        alert(res.url);
    }
});

• 資源-（數組）允許將資源列表導出到MS Project文件中

gantt.exportToMSProject({
  resources: [
    {"id":"1","name":"John","type":"work"},
    {"id":"2","name":"Mike","type":"work"},
    {"id":"3","name":"Anna","type":"work"}
  ]
});

var users = [// resources
  {key:'0', label: "N/A"},
  {key:'1', label: "John"},
  {key:'2', label: "Mike"},
  {key:'3', label: "Anna"}
];
 
gantt.exportToMSProject({
  resources: users
     .filter(function(u){
        if(u.key === '0')//skip the default option 
           return false;
        return true;
     })
     .map(function(u){
        return {
           id: u.key,
           name: u.label,
           type: "work"
        };
     }),
  tasks: {
     ResourceAssignments: function(task){  
        return task.user;                  
     }                                     
  }
});

tasks: {
    ResourceAssignments: function(task){
        return [task.user, task.office];
    }
}

• 服務器-（字符串）請求的API端點。可以與導出服務的本地安裝一起使用。默認值為//export.dhtmlx.com/gantt。

gantt.exportToMSProject({
   server:"http://myapp.com/myexport/gantt"
});

為了轉換XML或MPP MS Project文件，您需要將以下請求發送到導出服務：

• 請求網址-https: //export.dhtmlx.com/gantt
• 請求方法-POST
• 內容類型-多部分/表單數據

• 文件-MPP或XML MS Project文件
• 類型-“ msproject-parse”
• 數據-（可選）帶有設置的JSON字符串

<form action="http://export.dhtmlx.com/gantt" method="POST" 
    enctype="multipart/form-data">
    <input type="file" name="file" />
    <input type="hidden" name="type" value="msproject-parse">
    <button type="submit">Get</button>
</form>

gantt.importFromMSProject({
    data: file,
    taskProperties: ["Notes", "Name"],
    callback: function (project) {
        if (project) {
            gantt.clearAll();
            if (project.config.duration_unit) {
                gantt.config.duration_unit = project.config.duration_unit;
            }                    
            gantt.parse(project.data);
        }
     }
});

響應

響應將包含以下結構的JSON：

{
   data: {},
   config: {},
   resources: [],
   worktime: {}
}

• 數據-甘特數據對象。每個任務具有以下屬性：id，open，parent，progress，start_date，text，resource。日期以“％Y-％m-％d％H：％i”格式進行字符串化。
• 配置-甘特配置有從項目文件中檢索設置對象。
• 資源-對象的數組（每個對象具有以下屬性：{ id：string，name：string，type：string }，代表項目文件中的資源列表。
• 工作時間-包含從項目日歷的工作時間設置的對象。

設置持續時間單位
要設置預期的持續時間單位，還可以將durationUnit（“分鐘”，“小時”，“天”，“周”，“月”，“年”）字符串發送到服務器。

<form action="http://export.dhtmlx.com/gantt" method="POST" 
    enctype="multipart/form-data">
    <input type="file" name="file" />
    <input type="hidden" name="type" value="msproject-parse">
    <input type="hidden" name="data" 
        value="{ \"durationUnit\": \"hour\" }" />
    <button type="submit">Get</button>
</form>

gantt.importFromMSProject({
    data: file,
    durationUnit: "hour",
    callback: function(project){}
});

要獲取項目字段，可以將帶有一系列必需字段的projectProperties輸入發送到服務器。它將Project實體的任意屬性提取 到輸出的config屬性中。這是受支持的屬性的列表。

• projectProperties-指定應放入響應中的項目屬性數組。

<form action="http://export.dhtmlx.com/gantt" method="POST" 
    enctype="multipart/form-data">
    <input type="file" name="file" />
    <input type="hidden" name="type" value="msproject-parse">
    <input type="hidden" name="data" 
        value="{ \"projectProperties\": [\"Author\", \"Title\"] }" />
    <button type="submit">Get</button>
</form>

gantt.importFromMSProject({
    data: file,
    durationUnit: "hour",
    projectProperties: ["Author", "Title"],
    callback: function(project){
        var config = project.config;
        alert(config.$custom_properties.Author);
    }
});

要獲取任務字段，可以將帶有一系列必需字段的taskProperties輸入發送到服務器。它提取Task實體的任意屬性。這是受支持的屬性的列表：

• taskProperties-指定要導入的其他任務屬性的數組。

<form action="http://export.dhtmlx.com/gantt" method="POST" 
    enctype="multipart/form-data">
    <input type="file" name="file" />
    <input type="hidden" name="type" value="msproject-parse">
    <input type="hidden" name="data" 
        value="{ \"taskProperties\": [\"Contact\", \"Priority\"] }" />
    <button type="submit">Get</button>
</form>

gantt.importFromMSProject({
    data: file,
    durationUnit: "hour",
    taskProperties: ["Contact", "Priority"],
    callback: function(project){
        var config = project.config;
        alert(config.$custom_properties.Author);
        gantt.parse(project.data);
    }
});
gantt.attachEvent("onTaskLoading", function(task) {
    if (task.$custom_data) {
        task.contact = task.$custom_data["Contact"];
        task.priority = task.$custom_data["priority"];
        delete task.$custom_data;
    }
    return true;
});

MSProject導出/導入服務有兩個API端點：

• //export.dhtmlx.com/gantt-提供所有導出方法（ exportToPDF， exportToPNG， exportToMSProject等）的默認端點。請求的最大大小為10 MB。
• //export.dhtmlx.com/gantt/project-專用于MS Project服務的終結點（僅exportToMSProject / importFromMSProject）。最大請求大小：40 MB。

gantt.importFromMSProject({
    server:"http://export.dhtmlx.com/gantt",
    data: file,
    callback: function(project){
       // some logic
    }
});

gantt.importFromMSProject({
    data: file,
    callback: function(project){
       // some logic
    }
});

gantt.importFromMSProject({
    server:"http://export.dhtmlx.com/gantt/project",
    data: file,
    callback: function(project){
       // some logic
    }
});

任何其他方法，例如gantt.exportToPDF（{server：“ //export.dhtmlx.com/gantt/project”}）都應返回服務器錯誤。

關產品推薦：

VARCHART XGantt：支持ActiveX、.Net等平臺的C#甘特圖控件

AnyGantt：構建復雜且內容豐富的甘特圖的理想工具

jQuery Gantt Package：基于HTML5 / jQuery的跨平臺jQuery Gantt包

phGantt Time Package：對任務和時間的分配管理的甘特圖

APS幫助提升企業生產效率，真正實現生產計劃可視化呈現與控制,快速有效響應不同場景的生產計劃，提高準時交貨能力，提高產能和資源利用率