Skip to main content
All docs
V24.2

ASPxClientGanttScaleCellPreparedEventArgs.scaleType Property

Gets the view type of the scale.

#Declaration

TypeScript

#Property Value

Type Description
ASPxClientGanttViewType

The view type.

#Remarks

The scale lines have different scale types. Use the scaleType property to get the view type of the processed scale.

ASPxGantt - Scale Customization

The example below illustrates how to customize the scale for different view types.

<dx:ASPxGantt runat="server" ID="Gantt" ClientInstanceName="clientGantt" >
    <SettingsTaskList>
        <Columns>
           <!-- ... -->
        </Columns>
    </SettingsTaskList>
    <ClientSideEvents 
        ScaleCellPrepared = "onGanttScaleCellPrepared"
    />
</dx:ASPxGantt>
function onGanttScaleCellPrepared(s, e) {
    var scaleElement = e.scaleElement;
    var color = "";
    if (e.scaleIndex === 0) {
        if (e.scaleType === ASPxClientGanttViewType.Hours || 
        e.scaleType === ASPxClientGanttViewType.SixHours) {
            color = "lightGreen";
        } else if (e.scaleType === ASPxClientGanttViewType.Days || 
        e.scaleType === ASPxClientGanttViewType.Weeks) {
            color = "Yellow";
        } else if (e.scaleType === ASPxClientGanttViewType.Quarter || 
        e.scaleType === ASPxClientGanttViewType.Years || 
        e.scaleType === ASPxClientGanttViewType.Months) {
            color = "silver";
        }
    } else {
        if (e.scaleType === ASPxClientGanttViewType.Days) {
            color = "lightGreen";
        } else if (e.scaleType === ASPxClientGanttViewType.Weeks || 
        e.scaleType === ASPxClientGanttViewType.Months) {
            color = "Yellow";
        } else if (e.scaleType === ASPxClientGanttViewType.FiveYears || 
        e.scaleType === ASPxClientGanttViewType.Years) {
            color = "silver";
        }
    }
    scaleElement.style.backgroundColor = color;
}

Result:

DevExpress ASP.NET Gantt - Customize Scale by View Type

See Also