The Gantt chart time header rows can be customized using TimeHeaders property.

You can specify the properties of each row:

html5 gantt chart time headers

The default time header levels are defined as follows:

  • GroupBy: Month, Format: "MMMM yyyy"
  • GroupBy: Day, Format: "d"

JavaScript

See also DayPilot.Gantt.timeHeaders property.

Example

gantt.timeHeaders = [
  { groupBy: "Month", format: "MMMM yyyy" },
  { groupBy: "Day", format: "d"},
  { groupBy: "Hour", format: "h"}
];

ASP.NET WebForms

Example

<DayPilot:DayPilotGantt
  ID="DayPilotGantt1" 
  runat="server" 
  ...
  >
  <TimeHeaders>
      <DayPilot:TimeHeader GroupBy="Month" Format="MMMM yyyy" />
      <DayPilot:TimeHeader GroupBy="Day" Format="%d" />
  </TimeHeaders>
</DayPilot:DayPilotGantt>