現(xiàn)在，我們可以定義工具欄變量：

<span><span><span><head</span>></span>
</span>   <span><span><span><title</span>></span>Webix Gantt Chart<span><span></title</span>></span>
</span>   <span><!--Webix-->
</span>   <span><span><span><script</span> src<span>="http://cdn.webix.com/edge/webix.js"</span>></span><span><span></script</span>></span>
</span>   <span><span><span><link</span> rel<span>="stylesheet"</span> href<span>="http://cdn.webix.com/edge/webix.css"</span> /></span>
</span>   <span><!--dhtmlxGantt-->
</span>   <span><span><span><script</span> src<span>="codebase/dhtmlxgantt.js"</span>></span><span><span></script</span>></span>
</span>   <span><span><span><link</span> href<span>="codebase/dhtmlxgantt.css"</span> rel<span>="stylesheet"</span> /></span>
</span>   <span><!--dhtmlxGantt integration-->
</span>   <span><span><span><script</span> type<span>="text/javascript"</span> src<span>="./gantt/gantt.js"</span>></span><span><span></script</span>></span>
</span>   <span><!--export-->
</span>   <span><span><span><script</span> src<span>="http://export.dhtmlx.com/gantt/api.js"</span>></span><span><span></script</span>></span>
</span><span><span><span></head</span>></span></span>

>看起來與我們先前創(chuàng)建的菜單相似。 Paddingy屬性將頂部和底部填充值設(shè)置為0。元素屬性定義了工具欄內(nèi)容，就像我們菜單示例中的數(shù)據(jù)屬性一樣。工具欄的第一個元素是我們的菜單，而第二個是分段按鈕。當(dāng)您想在我們示例中的比例單元之類的可用值之間切換時，這很有用。另外一個活動處理程序用於管理用戶的選擇，但這一次是Onchange事件。它在更改當(dāng)前選擇的按鈕後發(fā)射。我們先前定義的功能將根據(jù)所選按鈕ID更改比例。選項屬性在控件中定義按鈕（段）。

>

<span>var tasks = {
</span>   <span>data: [{
</span>         <span>id: 1,
</span>         <span>text: "Project #1",
</span>         <span>start_date: "01-06-2015",
</span>         <span>duration: 11,
</span>         <span>progress: 0.6,
</span>         <span>open: true
</span>      <span>}, {
</span>         <span>id: 2,
</span>         <span>text: "Task #1",
</span>         <span>start_date: "03-06-2015",
</span>         <span>duration: 5,
</span>         <span>progress: 1,
</span>         <span>open: true,
</span>         <span>parent: 1
</span>      <span>},
</span>      <span>/*some more tasks*/
</span>      <span>{
</span>         <span>id: 6,
</span>         <span>text: "Task #2.3",
</span>         <span>start_date: "05-06-2015",
</span>         <span>duration: 4,
</span>         <span>progress: 0.2,
</span>         <span>open: true,
</span>         <span>parent: 3
</span>      <span>}
</span>   <span>],
</span>   <span>links: [{
</span>         <span>id: 1,
</span>         <span>source: 1,
</span>         <span>target: 2,
</span>         <span>type: "1"
</span>      <span>}, {
</span>         <span>id: 2,
</span>         <span>source: 1,
</span>         <span>target: 3,
</span>         <span>type: "1"
</span>      <span>},
</span>      <span>/*some more links*/
</span>      <span>{
</span>         <span>id: 5,
</span>         <span>source: 5,
</span>         <span>target: 6,
</span>         <span>type: "0"
</span>      <span>}
</span>   <span>]
</span><span>};</span>

>

在本文中，我們看到瞭如何構(gòu)建基於DHTMLXGANTT的Gantt Chart應(yīng)用程序，根據(jù)其整體持續(xù)時間設(shè)置適當(dāng)?shù)囊?guī)模，並將其導(dǎo)出到文件中以滿足進(jìn)一步的需求。我們擁有的是輕巧的在線圖表創(chuàng)建工具。

目前只有幾篇有關(guān)Webix與DHTMLXGANTT集成的文章。但是，根據(jù)這篇名為“ Webix UI - Gantt Pro的用例”的帖子，最近使用Webix來創(chuàng)建GantTPro - 高級在線Gantt Chart應(yīng)用程序。這使我猜想，通過使用帖子中描述的功能和UI組件，您將能夠大大擴展gantt Chart功能。

創(chuàng)建自己的甘特圖

是的，您可以在gantt圖表中添加依賴項在Webix中。依賴項由連接任務(wù)條的線路表示。要添加依賴關(guān)係，您需要為數(shù)據(jù)中的任務(wù)指定“依賴關(guān)係”屬性。該屬性的值應(yīng)該是其依賴任務(wù)的ID。這將自動從因任務(wù)繪製一條線，從其依賴的任務(wù)繪製。

>如何處理甘特圖表中的大量數(shù)據(jù)？ webix提供了幾個功能來處理gantt圖表中的大量數(shù)據(jù)。您可以使用“分頁”功能將數(shù)據(jù)分為頁面。這使您一次顯示大量數(shù)據(jù)。您還可以使用“過濾”功能僅顯示符合某些條件的數(shù)據(jù)。如果要專注於特定任務(wù)，這可能很有用。

>我可以將gantt圖表導(dǎo)出到PDF或圖像文件嗎？ Webix中的圖像文件。如果您想與他人共享圖表或?qū)⑵浒趫蟾嬷?，這將很有用。要導(dǎo)出圖表，您需要使用gantt圖表對象的“導(dǎo)出”或“導(dǎo)出”方法。這將生成圖表的PDF或PNG文件。您可以添加事件偵聽器以響應(yīng)用戶操作，例如單擊或拖動欄。您還可以使用“可編輯”屬性來允許用戶直接在圖表中編輯任務(wù)。如果您想允許用戶更新任務(wù)的進(jìn)度，這可能很有用。

我可以使用webix在移動應(yīng)用程序中創(chuàng)建gantt圖表嗎？在移動應(yīng)用程序中創(chuàng)建甘特圖。 Webix是一個JavaScript庫，因此可以在支持JavaScript的任何平臺中使用。這包括移動平臺，例如iOS和Android。甘特圖將自動適應(yīng)設(shè)備的屏幕尺寸。

如何將里程碑添加到我的gantt圖表中？