Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.


Section


Column
width820px


Column

On this page you will learn how to configure Gantt chart:

Table of Contents
maxLevel3
minLevel2




Example



Section


Column
width560px

Rendered Chart












Column
width30%

Parameters in Macro Browser

TypeGantt
Labels column
  • Project*
  • Phase
  • Milestone (a star that is a key event of a particular project)
  • Event (a vertical line that doesn't belong to any project)
  • Description of Milestone
  • Description of Event
Values column
  • Start Date*
  • End Date*
  • Completion Ratio (the percentage of completed work)
  • Date

*  - Minimum required columns to build the Gantt chart

Info

See also a blog post: 5 Tips to Become a Gantt Chart Expert Using Atlassian Confluence to learn more about the completion ratio, events, and milestones on the Gantt chart.




Column
width70%

Data Tables in Macro Placeholder

Project

Phase

Start Date

End Date

Completion Ratio

Project One

Planning and Research

01 Jan 2019

30 Jan 2019

95%

Project One

Development

01 Feb 2019

30 Apr 2019

27%

Project One

Testing

01 May 2019

15 May 2019

0%

Project One

Deployment

16 May 2019

22 May 2019

0%

Project Two

Planning and Research

15 Dec 2018

15 Jan 2019

95%

Project Two

Development

16 Jan 2019

15 Apr 2019

27%

Project Two

Testing

16 Apr 2019

21 Apr 2019

0%

Project Two

Deployment

22 Apr 2019

30 Apr 2019

0%


ProjectMilestoneDescription of MilestoneDate
Project OneRCСompletion of development

7 May 2019 

Project TwoRCСompletion of development

19 Apr 2019 


EventDescription of EventDate
Today
today
Demo 1Release of Demo 1

12 May 2019

Demo 2Release of Demo 2

27 Apr 2019


Info

Here's the example on how to calculate the completion ratio in Table Transformer.



Parameters


Settings Tab

Table Excerpt Include
namechart-type
pageChart Parameters
typepage


Handy Carousel
delay10



Table Excerpt Include
namedata-series-labels-values
pageChart Parameters
typepage


Handy Carousel



Adjustments Tab

Table Excerpt Include
nametable-data-orientation
pageChart Parameters
typepage


Table Excerpt Include
namedecimal-separator
pageChart Parameters
typepage


Table Excerpt Include
namedate-format
pageChart Parameters
typepage


Table Excerpt Include
nameworklog
pageChart Parameters
typepage


Table Excerpt Include
namemin-max
pageChart Parameters
typepage


Table Excerpt Include
namescale-step
pageChart Parameters
typepage


Look Tab

Table Excerpt Include
nameheight-width
pageChart Parameters
typepage

Info

 Add /bar after the height value to set the height of bars.



Handy Carousel
delay10



Table Excerpt Include
nameindividual-colors
pageChart Parameters
typepage



Handy Carousel
delay10



Table Excerpt Include
namealign
pageChart Parameters
typepage


Table Excerpt Include
namegrid
pageChart Parameters
typepage


Table Excerpt Include
namehide-source
pageChart Parameters
typepage


Handy Carousel
delay10



Table Excerpt Include
namehide-controls
pageChart Parameters
typepage


Table Excerpt Include
nametitle
pageChart Parameters
typepage


Table Excerpt Include
nameaxis-labels
pageChart Parameters
typepage


Table Excerpt Include
namefilter-table
pageChart Parameters
typepage


Table Excerpt Include
namegantt-dependencies
merge-tablestrue
pageChart Parameters
typepage


Zoom in Chart

To zoom in the chart:

  1. Open the page with the chart you want to zoom in.
  2. Hover your mouse pointer over this chart.
  3. Hold down Ctrl and rotate the wheel button forward to zoom in the chart.

To navigate across the chart:

  1. Hold down Ctrl (for Windows) or Alt (for MacOS) and drag the mouse pointer across the chart.