Skip to main content
All docs
V24.1

IChartSeriesLabel.VerticalOffset Property

Specifies the vertical offset of series labels.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v24.1.dll

NuGet Package: DevExpress.Blazor

Declaration

double VerticalOffset { get; set; }

Property Value

Type Description
Double

The vertical offset in pixels.

Remarks

IChartSeriesLabel properties allow you to configure point label settings. To access these settings, use the PointLabel property in a CustomizeSeriesPoint event handler.

The VerticalOffset property value shifts series labels vertically from their initial positions. A positive value shifts labels down, a negative value shifts them up.

Example

The following code snippet shifts visible series labels horizontally and vertically:

Chart - Change Label Offset

<DxChart Data="@WeatherForecasts"
         CustomizeSeriesPoint="@PreparePointLabel"
         Width="100%">
    <DxChartTitle Text="Annual Weather in New York" />
    <DxChartLineSeries SummaryMethod="@(i => i.Average())"
                        ValueField="@((DetailedWeatherSummary i) => i.AverageTemperatureF)"
                        ArgumentField="@(i => new DateTime(2000, i.Date.Month, 1))"
                        Name="Temperature, F"
                        Filter="@((DetailedWeatherSummary  i) => i.City == "NEW YORK")">
        <DxChartSeriesLabel Position="RelativePosition.Outside"
                            FormatPattern="{argument:MMMM}: {value:#.##} °F">
            <DxChartSeriesLabelConnector Visible="true"
                                         Width="3" />
            <DxChartFont Size="14" Weight="600" />
        </DxChartSeriesLabel>
    </DxChartLineSeries>
    @* ... *@
</DxChart>


@code {
    IEnumerable<DetailedWeatherSummary> WeatherForecasts;

    protected override async Task OnInitializedAsync() {
        WeatherForecasts = await WeatherSummaryDataProvider.GetDataAsync();
    }

    protected void PreparePointLabel(ChartSeriesPointCustomizationSettings pointSettings) {
        double value = (double)pointSettings.Point.Value;
        if (value > 50 && value < 70)
            pointSettings.PointLabel.Visible = true;
            pointSettings.PointLabel.VerticalOffset = 30;
            pointSettings.PointLabel.HorizontalOffset = 75;
    }
}
See Also