Skip to main content

DxChartSeriesLabel.ValueFormat Property

Specifies the display format for series label values.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v24.1.dll

NuGet Package: DevExpress.Blazor

Declaration

[Parameter]
public ChartElementFormat ValueFormat { get; set; }

Property Value

Type Description
ChartElementFormat

The format identificator.

Remarks

You can use built-in ChartElementFormat formats to customize series label values. Refer to the following section for a list of available formats: Value Formats.

The following example formats series labels so that they display values with two digits after the decimal point:

Series labels are formatted.

@page "/"
<DxChart Data="@dataPoints"
         Width=500 Height=300>
    <DxChartScatterSeries ArgumentField="@((DataPoint i) => i.Arg)"
                          ValueField="@((DataPoint i) => i.Value1)"
                          Name="Series 1">
        <DxChartSeriesPoint Size=20 />
        <DxChartSeriesLabel ValueFormat=ChartElementFormat.FixedPoint(2) 
                            Visible="true"/>
    </DxChartScatterSeries>
    <DxChartLegend Position=RelativePosition.Outside />
</DxChart>
@code {
    private DataPoint[] dataPoints;
    protected override void OnInitialized() {
        dataPoints = GetDataPoints();
    }
    public class DataPoint {
        public string Arg { get; set; }
        public double Value1 { get; set; }
    }
    public DataPoint[] GetDataPoints() {
        DataPoint[] dataPoints = new DataPoint[] {
            new DataPoint() { Arg = "I", Value1 = 26.54561 },
            new DataPoint() { Arg = "II", Value1 = 24.4521 },
            new DataPoint() { Arg = "III", Value1 = 25.3645 },
            new DataPoint() { Arg = "IV", Value1 = 27.4874 },
            new DataPoint() { Arg = "V", Value1 = 28.9654 },
        };
        return dataPoints;
    }
}

You can use the DxChartSeriesLabel.FormatPattern property to format series label text. To display values formatted by ArgumentFormat and ValueFormat properties, use the {argumentText} and {valueText} placeholders, respectively.

See Also