How to add extra columns in Gantt?

In Gantt control, you can add new columns using the Load event. In the following code snippet, headerText provides the name of the new column’s header; field value is used to provide data for the new column in data source, mappingName is used to map values of respective field from the datasource and the width value is used to provide width in pixels, for the new column.

The following example is used for inserting a custom column in Gantt.

JS

<script type="text/javascript">
$(function () {
       $("#gantt").ejGantt({
        //…
          load: function () {
           var columns = this.getColumns();
          columns.splice(2, 0,
           {
                 field: "customColumn",
                 headerText: "Custom Column",
                 mappingName: "customColumn",
                 width: "80px"
             });
        }});
 });
</script>

A sample to add extra columns in Gantt is available in following link. Sample