Is there a documented viewmodel for Gantt Chart and Kanban board?

[VT]

Hello,

I was wondering if there is a viewmodel which describes what shape the data has to be in order to be fully mapped to the Blazor controls, in particular Kanban board and Gantt Chart.

For example, in https://blazor.syncfusion.com/documentation/gantt-chart/data-binding#web-api the viewmodel seems to be as per below:

public class GanttRemoteData
    {
        public int TaskId { get; set; }
        public string TaskName { get; set; }
        public DateTime StartDate { get; set; }
        public string Duration { get; set; }
        public int Progress { get; set; }
        public string Predecessor { get; set; }
        public List<GanttRemoteData>SubTasks { get; set; }
    }

Now, in https://blazor.syncfusion.com/documentation/gantt-chart/managing-tasks#entity-framework the mapped data looks like

<SfDataManager AdaptorInstance="@typeof(CustomAdaptor)" Adaptor="Adaptors.CustomAdaptor"></SfDataManager>
    <GanttColumns>
        <GanttColumn Field=@nameof(GanttData.Id) Width="100"></GanttColumn>
        <GanttColumn Field=@nameof(GanttData.Name) Width="250"></GanttColumn>
        <GanttColumn Field=@nameof(GanttData.Sdate)></GanttColumn>
        <GanttColumn Field=@nameof(GanttData.Edate)></GanttColumn>
        <GanttColumn Field=@nameof(GanttData.Progress)></GanttColumn>
    </GanttColumns>

As you can see, the second example does not have Predecessor property for example, but have something called "Edate". The same story is with Kanban control: every example has its own viewmodel for the control it seems.
So the question is Is there a defined and documented data model (viewmodel) for Blazor controls? Something that can be referred to for the whole functionality of the control? Having all these different classed on different examples is not helpful unfortunately, especially when mapping the existing Domain model to the viewmodel of the control.
thank you

[Monisha Sivanthilingam]

Hi VT,

Greetings from Syncfusion support.

Gantt Chart

The model of the Gantt Chart changes based on the types of features you want to include in it. However, a few properties that are absolutely necessary for the Gantt Chart are as follows:

 

public class TaskData

{

  public int TaskId { get; set; }

  public string TaskName { get; set; }

  public DateTime StartDate { get; set; }

  public DateTime EndDate { get; set; }

  public string Duration { get; set; }

}

 

These properties correspond to the TaskID, TaskName, StartDate, EndDate and Duration properties of the Gantt TaskFields respectively. We can also change the names of these properties according to our convenience. We just have to ensure that the names of these properties are mapped against their corresponding taskfields.

The remaining properties can be included as per your requirements. For example:

1. If you are using the Hierarchical data source, you can use the subtasks property. However, if you are using the Self-Referential data source, you can use the ParentID property.
2. Similarly, if you want to enable predecessor connections in your data source, then you have to include the Predecessor property. BaselineStartDate and BaselineEndDate properties are only used if you wish to use the Baseline feature in the Gantt Chart.
3. Hence, the properties mentioned in the above code snippet are necessary to render a basic Gantt Chart without any additional features. Based on the features you want to include in your application, the model of the Gantt Chart will also change.

Kanban

Similarly, the Kanban control also contains a few properties that are absolutely necessary to render the Kanban. The other additional fields are simply for the purpose of presenting additional information in the cards. They are as follows:

 

public class TasksModel

{

  public string Id { get; set; }

  public string Title { get; set; }

  public string Status { get; set; }

  public string Summary { get; set; }

}

 

Among these properties the Status property is used as a key field. Based on the status value provided, the cards in the Kanban will be distributed among their respective columns. You can also name the key field according to your requirements. Just ensure that you have mapped the key field properly. The summary property will provide a detailed description of the card.

If you wish to enable swim lanes in the Kanban control, then an additional property can be added and assigned to the KanbanSwimlaneSettings.KeyField property.

We hope this clarifies any doubts you have.

Please contact us if you require further information. We will be happy to provide you with assistance.

Regards,

Monisha.

[VT]

Thank you Monisha, it makes sense now.

[Monisha Sivanthilingam]

Hi VT,

You are welcome.

Please contact us if you require any further assistance.

Regards,

Monisha.