FusionCharts for Flex > Creating Widgets > Gantt Chart > Anatomy

A Gantt chart comprises of the following elements:

  • Categories and sub-categories (dates) in the visual time line
  • Scrollable data table consisting of:
    • Process names
    • Additional user defined columns of data
  • Scrollable Gantt view pane consisting of:
    • Gantt Task Bars
    • Milestones
    • Task Connectors
    • Trend Lines
  • Tooltip
  • Optional legend to show color keys used in the chart.

Here we’ll see each of them in detail. Let’s first have a look at a standard Gantt chart enlisting a few of the above elements:

 
Categories and Sub-Categories

On a Gantt chart, the horizontal axis represents the total time span of the project. The total time span can broken into increments (for example, days, weeks, or months). You can define any number of sub-categories in order to divide dates into smaller units.

For example, a Gantt chart with a time span of 2 years can have sub-categories that divide the timeline into quarters, months, weeks and days.

Irregular distribution of the timeline is also possible. For example, if you want to plot a Gantt chart showing progress of a certain project during a span of 3 months, you can easily divide the timeline into weeks at the same time displaying actual dates associated with each week. In the visual date timeline, the top bar will indicate the 3 months by their names, and the bar below it will display the weeks.

In most Gantt charts, you’re forced to divide a month into 4 weeks, which causes aberration in display of data. This happens because a month is a little longer than 4 weeks. A date based, timeline removes this aberration by stretching the last week of a month into the consecutive month.

 
Process Names

In a Gantt chart every task is associated with a process. The sample chart (above) comprises of processes such as Writing, Signing, Financing etc, each process in turn comprises of various tasks.

The process names automatically show up in the scrollable data table which is located to the left of Gantt pane.

 
Data Table
The data table shows additional information about various processes that are defined in the Gantt chart. The table is completely customizable and each cell of the table can be made to act as a hyperlink. Additionally, the table has been made drag-able and scrollable, for ease of viewing.
 
Task Bars
Task bars indicate the duration of each task. They run horizontally across the chart and are positioned with respect to their start and end dates.
 
Milestones

Milestones are used to mark the crucial stages of a task. It is possible to customize the appearance of a milestone in terms of its shape (star or polygon), size and color. Additionally, you can add tool text to a milestone and also convert it into a hyperlink.

 
Task Connectors

Task connectors are lines that link two associated tasks. In order to create a task connector, you’ll have to specify the Ids of the tasks that are to be connected. You have the option of configuring the point at which the task connector joins the tasks (i.e. the start point or the end point).

For example, if you are plotting two connected tasks which begin and end simultaneously and are a part of the same process, then you can configure the task connectors, such that it links the start points of both tasks. If on the other hand, the relation between the two tasks is such that one can start only after the other completes, then it is best to connect the end point of the task which will be completed first to the start point of the succeeding task.

 
Trend Lines
Trend Lines are used for indicating important dates such as; deadline, estimated time of completion etc.
 
Legend
Legend helps the chart’s audience in understanding the meaning of color keys that are used on that chart.