FusionCharts for Flex > Creating Widgets > Gantt Chart > Configuring Date Format

You can configure both; the input format and the output format for dates. This feature lets you provide dates and show them on the chart using formats defined by you.

 
Setting Input Date Format

The input date format can be specified in the following way:

<chart dateFormat='mm/dd/yyyy' ... >

The dateFormat attribute can take one of the following values:

  • mm/dd/yyyy
  • dd/mm/yyyy
  • yyyy/mm/dd
Configuring output date format

The output date format can be specified in the following way:

<chart dateFormat='mm/dd/yyyy' outputDateFormat='mns ddds, yyyy' ...>

Here, mns ddds, yyyy is the custom date format template which is applied to output dates. We'll see how to build this template soon. In case you don't specify an output format for dates, then the dates will be displayed according to the input format. However, when you run the chart (after specifying the output format as described above), you'll see the dates as under:

As you can see, our input dates have been converted into a more readable format by applying output date format. This is possible using the output date format template.

This template can consist of various pre-defined tokens. You can add those tokens to form a date format.

Currently supported tokens for building output date format templates are:

Token What it represents?
dd Numeric Date
mm Numeric Month
yy Numeric year (2 digits only)
yyyy Numeric year (4 digits)
hh Hour in 24 hour format - Numeric
hh12 Hour in 12 hour format - Numeric
mn Minute
ss Second
ampm When using 12 hour format, this specifies whether it's AM or PM
mnl Month Name Long (Full)
mns Month Name Short
dnl Week Day Name (Long)
dns Week Day Name (short)
ds Suffix for the date (like st, nd, rd, th etc.)
 
Let's quickly see some sample template examples in order to get a clear idea of how to build custom output formats:
Output date format that you need What date format to use?
21st March, 2007 ddds mnl, yyyy
March 21 2007 mnl dd yyyy
21-Mar-07 mns-dd-yy
3/7/2007 mm/dd/yyyy
21-03 dd-mm
Friday, 21st March 07 dnl, ddds mnl yy
21-7-2007 13:11:20 dd-mm-yyyy hh:mn:ss
21-7-2007 1:11:20 PM dd-mm-yyyy hh12:mn:ss ampm
1:11:20 PM hh12:mn:ss ampm
Please note that the output format is not restricted to the examples listed above. Using tokens, you can build your own custom date format templates.