DxChartSeriesLabel.Format Property

OBSOLETE

This property is obsolete now. Use the ValueFormat property instead.

Specifies the display format for series labels.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v24.1.dll

NuGet Package: DevExpress.Blazor

Declaration

[Browsable(false)]
[Obsolete("This property is obsolete now. Use the ValueFormat property instead.")]
[Parameter]
public ChartElementFormat Format { get; set; }

Property Value

Type	Description
ChartElementFormat	A series label format.

Remarks

You can use built-in ChartElementFormat formats to customize series labels. The following code applies the decimal format to series labels.

<DxChart Data="@forecasts" CustomizeSeriesPoint="@showPointLabel">
    <DxChartLineSeries ArgumentField="@((WeatherForecast i) => i.Date)"
                      ValueField="@((WeatherForecast i) => i.Precipitation)"
                      Name="Temperature">
        @* Apply fixed point format *@
        <DxChartSeriesLabel Format="ChartElementFormat.FixedPoint(2)" Position="RelativePosition.Outside"></DxChartSeriesLabel>
    </DxChartLineSeries>
</DxChart>

@code {
    protected void showPointLabel(ChartSeriesPointCustomizationSettings pointSettings) {
        // Show labels for series points
        pointSettings.PointLabel.Visible = true;
    }

    private WeatherForecast[] forecasts;

    protected override void OnInitialized()
    {
        forecasts = GetForecast();
    }

    public WeatherForecast[] GetForecast()
    {
        WeatherForecast[] forecasts = new WeatherForecast[] {
                    new WeatherForecast() { Date = new DateTime(2020, 05, 11), TemperatureC = 20,
                                            Precipitation = 5},
                    new WeatherForecast() { Date = new DateTime(2020, 05, 12), TemperatureC = 22,
                                            Precipitation = 1.2},
                    new WeatherForecast() { Date = new DateTime(2020, 05, 13), TemperatureC = 18,
                                            Precipitation = 0.8},
                    new WeatherForecast() { Date = new DateTime(2020, 05, 14), TemperatureC = 19,
                                            Precipitation = 0},
                    new WeatherForecast() { Date = new DateTime(2020, 05, 15), TemperatureC = 14,
                                            Precipitation = 3.3},
                    new WeatherForecast() { Date = new DateTime(2020, 05, 16), TemperatureC = 15,
                                            Precipitation = 1.7},
                    new WeatherForecast() { Date = new DateTime(2020, 05, 17), TemperatureC = 18,
                                            Precipitation = 1},
                    new WeatherForecast() { Date = new DateTime(2020, 05, 18), TemperatureC = 23,
                                            Precipitation = 0},
                    new WeatherForecast() { Date = new DateTime(2020, 05, 19), TemperatureC = 21,
                                            Precipitation = 4.4},
                    new WeatherForecast() { Date = new DateTime(2020, 05, 20), TemperatureC = 20,
                                            Precipitation = 8.5},
                };
        return forecasts;
    }
}

Run Demo: Charts - Multiple Axes