簇状甘特图

簇状甘特图 是由 SideBySideGanttSeriesView 对象来表示的，此对象属于甘特系列视图 (也称为时间或时间线图表)。这种视图沿时间轴显示水平条形。每个条形表示一个有起始值和终值的独立事件，因此这些图表被用于跟踪在时间框架期间的不同行为 (例如在项目管理中计划多种资源的利用、检查项目的完成情况等)。当需要从上至下逐个显示来源于不同系列的行动条形、并比较其持续期间时，使用这种图表类型。

注意
要学习如何从轴刻度中去除周末和节假日，请参阅日期时间数据呈现。

在下面的插图中显示了一个簇状甘特图。

注意，对于甘特图，水平显示日期时间轴 (取值轴) 是公认的，因此不能旋转甘特图。这就是 GanttDiagram.Rotated 属性 (属于 GanttDiagram 对象) 被隐藏和不可用的原因。

下表列出了这种图表类型的主要特征。

特征	取值
系列视图类型	SideBySideGanttSeriesView
图象类型	2D- GanttDiagram
每个数据点的参数个数	1
每个数据点的取值个数	2 个日期时间值 (开始日期和结束日期)

注意
要获得关于哪些图表类型可以与簇状甘特图组合使用的信息，请参阅组合使用不同的系列视图文档。

关于在设计时刻如何创建甘特图的示例，请参阅如何：创建有任务链路的甘特图。

下面的示例演示了在运行时刻如何创建 ChartControl (拥有两个 SideBySideGanttSeriesView 类型的系列)，并把图表添加到窗体中。在继续本示例之前，首先要在 Visual Studio 中创建一个 Windows 窗体应用程序，并把所有必需的程序集包含到项目的“引用”列表中。

然后，把下列代码添加到 Form.Load 事件处理程序。

C#	复制代码
using System; using System.Drawing; using System.Windows.Forms; using DevExpress.XtraCharts; // ... private void Form1_Load(object sender, EventArgs e) { // Create a new chart. ChartControl ganttChart = new ChartControl(); // Create two Gantt series. Series series1 = new Series("Estimation", ViewType.SideBySideGantt); Series series2 = new Series("Implementation", ViewType.SideBySideGantt); // Specify the date-time value scale type, // because it is qualitative by default. series1.ValueScaleType = ScaleType.DateTime; series2.ValueScaleType = ScaleType.DateTime; // Add points to them. series1.Points.Add(new SeriesPoint("Task 1", new DateTime[] { new DateTime(2006, 8, 16), new DateTime(2006, 8, 31) })); series1.Points.Add(new SeriesPoint("Task 2", new DateTime[] { new DateTime(2006, 8, 31), new DateTime(2006, 9, 15) })); series1.Points.Add(new SeriesPoint("Task 3", new DateTime[] { new DateTime(2006, 9, 15), new DateTime(2006, 9, 30) })); series1.Points.Add(new SeriesPoint("Task 4", new DateTime[] { new DateTime(2006, 9, 30), new DateTime(2006, 10, 15) })); series2.Points.Add(new SeriesPoint("Task 1", new DateTime[] { new DateTime(2006, 8, 16), new DateTime(2006, 9, 5) })); series2.Points.Add(new SeriesPoint("Task 2", new DateTime[] { new DateTime(2006, 9, 5), new DateTime(2006, 9, 22) })); series2.Points.Add(new SeriesPoint("Task 3", new DateTime[] { new DateTime(2006, 9, 22), new DateTime(2006, 10, 10) })); series2.Points.Add(new SeriesPoint("Task 4", new DateTime[] { new DateTime(2006, 10, 10), new DateTime(2006, 10, 23) })); // Add both series to the chart. ganttChart.Series.AddRange(new Series[] { series1, series2}); // Adjust series labels. ((RangeBarSeriesLabel)series1.Label).Kind = RangeBarLabelKind.MaxValueLabel; series2.Label.Visible = false; // Access the view-type-specific options of the second series. SideBySideGanttSeriesView myView2 = (SideBySideGanttSeriesView)series2.View; myView2.MaxValueMarker.Visible = true; myView2.MaxValueMarker.Kind = MarkerKind.Star; myView2.MaxValueMarker.StarPointCount = 5; myView2.MaxValueMarker.Size = 10; myView2.MinValueMarker.Visible = true; myView2.MinValueMarker.Kind = MarkerKind.Circle; myView2.MinValueMarker.Size = 10; myView2.BarWidth = 0.5; // Customize the chart (if necessary). GanttDiagram myDiagram = (GanttDiagram)ganttChart.Diagram; myDiagram.AxisX.Title.Visible = true; myDiagram.AxisX.Title.Text = "Tasks"; myDiagram.AxisY.Interlaced = true; myDiagram.AxisY.GridSpacing = 10; myDiagram.AxisY.Label.Angle = -30; myDiagram.AxisY.Label.Antialiasing = true; myDiagram.AxisY.DateTimeOptions.Format = DateTimeFormat.MonthAndDay; // Customize the legend (if necessary). ganttChart.Legend.AlignmentHorizontal = LegendAlignmentHorizontal.Right; ganttChart.Legend.AlignmentVertical = LegendAlignmentVertical.TopOutside; ganttChart.Legend.Direction = LegendDirection.LeftToRight; // Add a constant line. ConstantLine deadline = new ConstantLine("Deadline", new DateTime(2006, 10, 15)); deadline.ShowInLegend = false; deadline.Title.Alignment = ConstantLineTitleAlignment.Far; deadline.Color = Color.Red; myDiagram.AxisY.ConstantLines.Add(deadline); // Add a title to the chart (if necessary). ganttChart.Titles.Add(new ChartTitle()); ganttChart.Titles[0].Text = "A Side-by-Side Gantt Chart"; // Add the chart to the form. ganttChart.Dock = DockStyle.Fill; this.Controls.Add(ganttChart); }

C#

复制代码

using System;
using System.Drawing;
using System.Windows.Forms;
using DevExpress.XtraCharts;
// ...

private void Form1_Load(object sender, EventArgs e) {
    // Create a new chart.
    ChartControl ganttChart = new ChartControl();

    // Create two Gantt series.
    Series series1 = new Series("Estimation", ViewType.SideBySideGantt);
    Series series2 = new Series("Implementation", ViewType.SideBySideGantt);

    // Specify the date-time value scale type,
    // because it is qualitative by default.
    series1.ValueScaleType = ScaleType.DateTime;
    series2.ValueScaleType = ScaleType.DateTime;

    // Add points to them.
    series1.Points.Add(new SeriesPoint("Task 1", new DateTime[] { 
    new DateTime(2006, 8, 16), new DateTime(2006, 8, 31) }));
    series1.Points.Add(new SeriesPoint("Task 2", new DateTime[] { 
    new DateTime(2006, 8, 31), new DateTime(2006, 9, 15) }));
    series1.Points.Add(new SeriesPoint("Task 3", new DateTime[] { 
    new DateTime(2006, 9, 15), new DateTime(2006, 9, 30) }));
    series1.Points.Add(new SeriesPoint("Task 4", new DateTime[] { 
    new DateTime(2006, 9, 30), new DateTime(2006, 10, 15) }));

    series2.Points.Add(new SeriesPoint("Task 1", new DateTime[] { 
    new DateTime(2006, 8, 16), new DateTime(2006, 9, 5) }));
    series2.Points.Add(new SeriesPoint("Task 2", new DateTime[] { 
    new DateTime(2006, 9, 5), new DateTime(2006, 9, 22) }));
    series2.Points.Add(new SeriesPoint("Task 3", new DateTime[] { 
    new DateTime(2006, 9, 22), new DateTime(2006, 10, 10) }));
    series2.Points.Add(new SeriesPoint("Task 4", new DateTime[] { 
    new DateTime(2006, 10, 10), new DateTime(2006, 10, 23) }));

    // Add both series to the chart.
    ganttChart.Series.AddRange(new Series[] { series1, series2});

    // Adjust series labels.
    ((RangeBarSeriesLabel)series1.Label).Kind = RangeBarLabelKind.MaxValueLabel;
    series2.Label.Visible = false;

    // Access the view-type-specific options of the second series.
    SideBySideGanttSeriesView myView2 = (SideBySideGanttSeriesView)series2.View;

    myView2.MaxValueMarker.Visible = true;
    myView2.MaxValueMarker.Kind = MarkerKind.Star;
    myView2.MaxValueMarker.StarPointCount = 5;
    myView2.MaxValueMarker.Size = 10;

    myView2.MinValueMarker.Visible = true;
    myView2.MinValueMarker.Kind = MarkerKind.Circle;
    myView2.MinValueMarker.Size = 10;

    myView2.BarWidth = 0.5;

    // Customize the chart (if necessary).
    GanttDiagram myDiagram = (GanttDiagram)ganttChart.Diagram;

    myDiagram.AxisX.Title.Visible = true;
    myDiagram.AxisX.Title.Text = "Tasks";
    myDiagram.AxisY.Interlaced = true;
    myDiagram.AxisY.GridSpacing = 10;
    myDiagram.AxisY.Label.Angle = -30;
    myDiagram.AxisY.Label.Antialiasing = true;
    myDiagram.AxisY.DateTimeOptions.Format = DateTimeFormat.MonthAndDay;

    // Customize the legend (if necessary).
    ganttChart.Legend.AlignmentHorizontal = LegendAlignmentHorizontal.Right;
    ganttChart.Legend.AlignmentVertical = LegendAlignmentVertical.TopOutside;
    ganttChart.Legend.Direction = LegendDirection.LeftToRight;

    // Add a constant line.
    ConstantLine deadline = new ConstantLine("Deadline", new DateTime(2006, 10, 15));
    deadline.ShowInLegend = false;
    deadline.Title.Alignment = ConstantLineTitleAlignment.Far;
    deadline.Color = Color.Red;
    myDiagram.AxisY.ConstantLines.Add(deadline);

    // Add a title to the chart (if necessary).
    ganttChart.Titles.Add(new ChartTitle());
    ganttChart.Titles[0].Text = "A Side-by-Side Gantt Chart";

    // Add the chart to the form.
    ganttChart.Dock = DockStyle.Fill;
    this.Controls.Add(ganttChart);
}

Visual Basic	复制代码
Imports System Imports System.Drawing Imports System.Windows.Forms Imports DevExpress.XtraCharts ' ... Private Sub Form1_Load(ByVal sender As Object, _ ByVal e As EventArgs) Handles MyBase.Load ' Create a new chart. Dim ganttChart As New ChartControl() ' Create two Gantt series. Dim series1 As New Series("Estimation", ViewType.SideBySideGantt) Dim series2 As New Series("Implementation", ViewType.SideBySideGantt) ' Specify the date-time value scale type, ' because it is qualitative by default. series1.ValueScaleType = ScaleType.DateTime series2.ValueScaleType = ScaleType.DateTime ' Add points to them. series1.Points.Add(New SeriesPoint("Task 1", New DateTime() _ { New DateTime(2006, 8, 16), New DateTime(2006, 8, 31) })) series1.Points.Add(New SeriesPoint("Task 2", New DateTime() _ { New DateTime(2006, 8, 31), New DateTime(2006, 9, 15) })) series1.Points.Add(New SeriesPoint("Task 3", New DateTime() _ { New DateTime(2006, 9, 15), New DateTime(2006, 9, 30) })) series1.Points.Add(New SeriesPoint("Task 4", New DateTime() _ { New DateTime(2006, 9, 30), New DateTime(2006, 10, 15) })) series2.Points.Add(New SeriesPoint("Task 1", New DateTime() _ { New DateTime(2006, 8, 16), New DateTime(2006, 9, 5) })) series2.Points.Add(New SeriesPoint("Task 2", New DateTime() _ { New DateTime(2006, 9, 5), New DateTime(2006, 9, 22) })) series2.Points.Add(New SeriesPoint("Task 3", New DateTime() _ { New DateTime(2006, 9, 22), New DateTime(2006, 10, 10) })) series2.Points.Add(New SeriesPoint("Task 4", New DateTime() _ { New DateTime(2006, 10, 10), New DateTime(2006, 10, 23) })) ' Add both series to the chart. ganttChart.Series.AddRange(New Series() { series1, series2}) ' Adjust series labels. CType(series1.Label, RangeBarSeriesLabel).Kind = RangeBarLabelKind.MaxValueLabel series2.Label.Visible = False ' Access the view-type-specific options of the second series. Dim myView2 As SideBySideGanttSeriesView = _ CType(series2.View, SideBySideGanttSeriesView) myView2.MaxValueMarker.Visible = True myView2.MaxValueMarker.Kind = MarkerKind.Star myView2.MaxValueMarker.StarPointCount = 5 myView2.MaxValueMarker.Size = 10 myView2.MinValueMarker.Visible = True myView2.MinValueMarker.Kind = MarkerKind.Circle myView2.MinValueMarker.Size = 10 myView2.BarWidth = 0.5 ' Customize the chart (if necessary). Dim myDiagram As GanttDiagram = CType(ganttChart.Diagram, GanttDiagram) myDiagram.AxisX.Title.Visible = True myDiagram.AxisX.Title.Text = "Tasks" myDiagram.AxisY.Interlaced = True myDiagram.AxisY.GridSpacing = 10 myDiagram.AxisY.Label.Angle = -30 myDiagram.AxisY.Label.Antialiasing = True myDiagram.AxisY.DateTimeOptions.Format = DateTimeFormat.MonthAndDay ' Customize the legend (if necessary). ganttChart.Legend.AlignmentHorizontal = LegendAlignmentHorizontal.Right ganttChart.Legend.AlignmentVertical = LegendAlignmentVertical.TopOutside ganttChart.Legend.Direction = LegendDirection.LeftToRight ' Add a constant line. Dim deadline As New ConstantLine("Deadline", New DateTime(2006, 10, 15)) deadline.ShowInLegend = False deadline.Title.Alignment = ConstantLineTitleAlignment.Far deadline.Color = Color.Red myDiagram.AxisY.ConstantLines.Add(deadline) ' Add a title to the chart (if necessary). ganttChart.Titles.Add(New ChartTitle()) ganttChart.Titles(0).Text = "A Side-by-Side Gantt Chart" ' Add the chart to the form. ganttChart.Dock = DockStyle.Fill Me.Controls.Add(ganttChart) End Sub

Visual Basic

复制代码

Imports System
Imports System.Drawing
Imports System.Windows.Forms
Imports DevExpress.XtraCharts
' ...

Private Sub Form1_Load(ByVal sender As Object, _ 
ByVal e As EventArgs) Handles MyBase.Load
    ' Create a new chart.
    Dim ganttChart As New ChartControl()

    ' Create two Gantt series.
    Dim series1 As New Series("Estimation", ViewType.SideBySideGantt)
    Dim series2 As New Series("Implementation", ViewType.SideBySideGantt)

    ' Specify the date-time value scale type,
    ' because it is qualitative by default.
    series1.ValueScaleType = ScaleType.DateTime
    series2.ValueScaleType = ScaleType.DateTime

    ' Add points to them.
    series1.Points.Add(New SeriesPoint("Task 1", New DateTime() _ 
{ New DateTime(2006, 8, 16), New DateTime(2006, 8, 31) }))
    series1.Points.Add(New SeriesPoint("Task 2", New DateTime() _ 
{ New DateTime(2006, 8, 31), New DateTime(2006, 9, 15) }))
    series1.Points.Add(New SeriesPoint("Task 3", New DateTime() _ 
{ New DateTime(2006, 9, 15), New DateTime(2006, 9, 30) }))
    series1.Points.Add(New SeriesPoint("Task 4", New DateTime() _ 
{ New DateTime(2006, 9, 30), New DateTime(2006, 10, 15) }))

    series2.Points.Add(New SeriesPoint("Task 1", New DateTime() _ 
{ New DateTime(2006, 8, 16), New DateTime(2006, 9, 5) }))
    series2.Points.Add(New SeriesPoint("Task 2", New DateTime() _ 
{ New DateTime(2006, 9, 5), New DateTime(2006, 9, 22) }))
    series2.Points.Add(New SeriesPoint("Task 3", New DateTime() _ 
{ New DateTime(2006, 9, 22), New DateTime(2006, 10, 10) }))
    series2.Points.Add(New SeriesPoint("Task 4", New DateTime() _ 
{ New DateTime(2006, 10, 10), New DateTime(2006, 10, 23) }))

    ' Add both series to the chart.
    ganttChart.Series.AddRange(New Series() { series1, series2})

    ' Adjust series labels.
    CType(series1.Label, RangeBarSeriesLabel).Kind = RangeBarLabelKind.MaxValueLabel
    series2.Label.Visible = False

    ' Access the view-type-specific options of the second series.
    Dim myView2 As SideBySideGanttSeriesView =  _ 
        CType(series2.View, SideBySideGanttSeriesView)

    myView2.MaxValueMarker.Visible = True
    myView2.MaxValueMarker.Kind = MarkerKind.Star
    myView2.MaxValueMarker.StarPointCount = 5
    myView2.MaxValueMarker.Size = 10

    myView2.MinValueMarker.Visible = True
    myView2.MinValueMarker.Kind = MarkerKind.Circle
    myView2.MinValueMarker.Size = 10

    myView2.BarWidth = 0.5

    ' Customize the chart (if necessary).
    Dim myDiagram As GanttDiagram = CType(ganttChart.Diagram, GanttDiagram)

    myDiagram.AxisX.Title.Visible = True
    myDiagram.AxisX.Title.Text = "Tasks"
    myDiagram.AxisY.Interlaced = True
    myDiagram.AxisY.GridSpacing = 10
    myDiagram.AxisY.Label.Angle = -30
    myDiagram.AxisY.Label.Antialiasing = True
    myDiagram.AxisY.DateTimeOptions.Format = DateTimeFormat.MonthAndDay

    ' Customize the legend (if necessary).
    ganttChart.Legend.AlignmentHorizontal = LegendAlignmentHorizontal.Right
    ganttChart.Legend.AlignmentVertical = LegendAlignmentVertical.TopOutside
    ganttChart.Legend.Direction = LegendDirection.LeftToRight

    ' Add a constant line.
    Dim deadline As New ConstantLine("Deadline", New DateTime(2006, 10, 15))
    deadline.ShowInLegend = False
    deadline.Title.Alignment = ConstantLineTitleAlignment.Far
    deadline.Color = Color.Red
    myDiagram.AxisY.ConstantLines.Add(deadline)

    ' Add a title to the chart (if necessary).
    ganttChart.Titles.Add(New ChartTitle())
    ganttChart.Titles(0).Text = "A Side-by-Side Gantt Chart"

    ' Add the chart to the form.
    ganttChart.Dock = DockStyle.Fill
    Me.Controls.Add(ganttChart)
End Sub

Show Me
在 DevExpress Code Central 数据库中可以找到完整的示例项目，网址是 http://www.devexpress.com/example=E1220。取决于目标平台类型 (ASP.NET、WinForms 等)，可以在线运行本示例，或者下载自动可执行的示例。

甘特图象
如何：创建有任务链路的甘特图

简要说明

图表类型特征

示例

参阅