GM - Gantt Chart

Documentation

GM – Gantt Chart component provides clarity to complex project timelines with numerous tasks, shifting deadlines, and overlapping dependencies. It helps you see the bigger picture while tracking details. With GridMate’s Gantt Chart, this clarity stays within your projects no need to switch between spreadsheets or external tools, as everything is connected to your live data.

Specification

Property

Type

Description

Gantt Id

String

Identifier for the Gantt chart parent record.

Icon name

String

Icon displayed for the Gantt chart, You can get the icon name from https://lightningdesignsystem.com/icons/

Title

String

Title displayed at the top of the Gantt chart.

Can select

Boolean

Determines if tasks can be selected in the chart.

Can reorder

Boolean

Indicates if tasks can be reordered by user interaction.

Can edit

Boolean

Indicates if tasks can be edited directly in the chart.

Columns

String

Configuration for the columns displayed in the chart.

Relation config

String

JSON configuration that defines the data modal for the Gantt Chart. JSON string configuration

Show only work hours

Boolean

Option to show only defined work hours in the chart.

Work day start

Integer

Hour at which the workday starts (1-24).

Work day end

Integer

Hour at which the workday ends (1-24).

Hour span

Integer

The time interval that defines a task slot’s length and the step size for moving tasks on the timeline (max 12h).

Work week start

Integer

The day the workweek starts, default is 1 (Monday).

Work week end

Integer

The day the workweek ends, default is 5 (Friday).

First day of week

Integer

Representation of the first day of the week (1-7).

Default displayed tasks

Integer

The number of tasks displayed by default.

Slot size

Integer

Width of each task slot in pixels.

Row height

Integer

Height of each row in pixels.

Left panel width (%)

Integer

Width of the left panel as a percentage of total width, up to 100%.

Right panel width (%)

Integer

Width of the right panel as a percentage of total width, up to 100%.

Default view

String

Initial view setting, e.g., “month” for monthly view.

API Reference

<?xml version="1.0" encoding="UTF-8"?>
<LightningComponentBundle xmlns="http://soap.sforce.com/2006/04/metadata">
    <apiVersion>64.0</apiVersion>
    <masterLabel>GM - Gantt Chart</masterLabel>
    <isExposed>true</isExposed>
    <targets>
        <target>lightning__RecordPage</target>
        <target>lightning__AppPage</target>
        <target>lightning__HomePage</target>
        <target>lightningCommunity__Page</target>
        <target>lightningCommunity__Default</target>
    </targets>

    <targetConfigs>
        <targetConfig targets="lightning__RecordPage,lightning__AppPage,lightning__HomePage">
            <property name="parentRecordId" type="String" default="" label="Gantt id" />
            <property name="iconName" type="String" default="standard:chart" label="Icon name" />
            <property name="title" type="String" default="Gantt chart" label="Title" />
            <property name="canSelect" type="Boolean" default="false" label="Can select" />
            <property name="canReorder" type="Boolean" default="false" label="Can reorder" />
            <property name="canEdit" type="Boolean" default="false" label="Can edit" />
            <property name="columns" type="String" default="" label="Columns" />
            <property name="taskProps" type="String" label="Relation config" />
            <property name="showWorkHours" type="Boolean" default="false" label="Show only work hours" />
            <property name="workDayStart" type="Integer" default="8" label="Work day start" min="1" max="24" />
            <property name="workDayEnd" type="Integer" default="17" label="Work day end" min="1" max="24" />
            <property name="hourSpan" type="Integer" default="1" label="Hour span" max="12" />
            <property name="workWeekStart" type="Integer" default="1" label="Work week start" />
            <property name="workWeekEnd" type="Integer" default="5" label="Work week end" />
            <property name="firstDayOfWeek" type="Integer" default="1" label="First day of week" />
            <property name="displayedTasks" type="Integer" default="10" label="Default displayed tasks" />
            <property name="slotSize" type="Integer" default="200" label="Slot size" />
            <property name="rowHeight" type="Integer" default="40" label="Row height" />
            <property name="listPanelWidth" type="Integer" default="40" label="Left panel width (%)" max="100" />
            <property name="editorPanelWidth" type="Integer" default="30" label="Right panel width (%)" max="100" />
            <property name="defaultView" type="String" default="month" label="default view" />
            <supportedFormFactors>
                <supportedFormFactor type="Large" />
                <supportedFormFactor type="Small" />
            </supportedFormFactors>
        </targetConfig>

        <targetConfig targets="lightningCommunity__Default">
            <property name="parentRecordId" type="String" default="" label="Gantt id" />
            <property name="iconName" type="String" default="standard:chart" label="Icon name" />
            <property name="title" type="String" default="Gantt chart" label="Title" />
            <property name="canSelect" type="Boolean" default="false" label="Can select" />
            <property name="canReorder" type="Boolean" default="false" label="Can reorder" />
            <property name="canEdit" type="Boolean" default="false" label="Can edit" />
            <property name="columns" type="String" default="" label="Columns" />
            <property name="taskProps" type="String" label="Relation config" />
            <property name="showWorkHours" type="Boolean" default="false" label="Show only work hours" />
            <property name="workDayStart" type="Integer" default="8" label="Work day start" min="1" max="24" />
            <property name="workDayEnd" type="Integer" default="17" label="Work day end" min="1" max="24" />
            <property name="hourSpan" type="Integer" default="1" label="Hour span" max="12" />
            <property name="workWeekStart" type="Integer" default="1" label="Work week start" />
            <property name="workWeekEnd" type="Integer" default="5" label="Work week end" />
            <property name="firstDayOfWeek" type="Integer" default="1" label="First day of week" />
            <property name="displayedTasks" type="Integer" default="10" label="Default displayed tasks" />
            <property name="slotSize" type="Integer" default="200" label="Slot size" />
            <property name="rowHeight" type="Integer" default="40" label="Row height" />
            <property name="listPanelWidth" type="Integer" default="40" label="Left panel width (%)" max="100" />
            <property name="editorPanelWidth" type="Integer" default="30" label="Right panel width (%)" max="100" />
            <property name="defaultView" type="String" default="month" label="default view" />
        </targetConfig>
    </targetConfigs>
</LightningComponentBundle>

PreviousGM - Single Calendar NextGM - File Explorer

Last updated 2 days ago

Was this helpful?