Back to Devexpress

DxChartAxisBase<T>.EndOnTick Property

blazor-devexpress-dot-blazor-dot-dxchartaxisbase-1-e1006a2c.md

latest2.6 KB
Original Source

DxChartAxisBase<T>.EndOnTick Property

Specifies whether an axis should start and end on ticks.

Namespace : DevExpress.Blazor

Assembly : DevExpress.Blazor.v25.2.dll

NuGet Package : DevExpress.Blazor

Declaration

csharp
[DefaultValue(null)]
[Parameter]
public bool? EndOnTick { get; set; }

Property Value

TypeDefaultDescription
Nullable<Boolean>null

true to start and end the axis on ticks; otherwise, false.

|

Remarks

If the EndOnTick property is set to true, the Chart component extends its axes so that they start and end on ticks.

razor
<DxChart Data="@forecasts">
    <DxChartArgumentAxis EndOnTick="true"></DxChartArgumentAxis>
    <DxChartValueAxis EndOnTick="true"></DxChartValueAxis>
    @* ... *@
</DxChart>

To change the default behavior, set the EndOnTick property to false. In this case, the Chart starts and ends at the outermost points with additional margins.

razor
<DxChart Data="@forecasts">
    <DxChartLineSeries ArgumentField="@((WeatherForecast i) => i.Date)"
                       ValueField="@((WeatherForecast i) => i.Precipitation)"
                       Name="Precipitation">
    </DxChartLineSeries>
    <DxChartArgumentAxis EndOnTick="false" SideMarginsEnabled="true"></DxChartArgumentAxis>
    <DxChartValueAxis EndOnTick="false" SideMarginsEnabled="true"></DxChartValueAxis>

</DxChart>

To remove these margins, set SideMarginsEnabled property to false.

razor
<DxChart Data="@forecasts">
    @* No spaces between the line and the axes *@
    <DxChartArgumentAxis SideMarginsEnabled="false" EndOnTick="false"></DxChartArgumentAxis>
    <DxChartValueAxis Name="Temperature" SideMarginsEnabled="false" EndOnTick="false"></DxChartValueAxis>
    @* ... *@
</DxChart>

See Also

DxChartAxisBase<T> Class

DxChartAxisBase<T> Members

DevExpress.Blazor Namespace