DxChartSeriesLegendItem.TextTemplate Property

Specifies the template to display a series legend item’s text.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v22.2.dll

NuGet Package: DevExpress.Blazor

Declaration

[Parameter]
public RenderFragment<string> TextTemplate { get; set; }

Property Value

Type	Description
RenderFragment<String>	A UI fragment to be rendered as a legend item’s text.

Remarks

Use the TextTemplate property to customize the legend item’s text. The code below applies the bold style to the legend item’s text.

Note

The AllowToggleSeries property does not affect legend items that use text templates.

<DxChartLineSeries Name="2019">
    <DxChartSeriesLegendItem>
        <TextTemplate>
            <b>Last year</b>
        </TextTemplate>
    </DxChartSeriesLegendItem>
</DxChartLineSeries>

Run Demo: Charts - Legend Customization

Pie and Donut charts consists of one series only. You should specify one DxChartSeriesLegendItem item for these charts. The specified settings are applied to all legend items in the chart.

<DxChart Data="@SalesData">
    <DxChartTitle Text="Total Sales" />
    <DxChartLegend VerticalAlignment="VerticalEdge.Bottom" Position="RelativePosition.Outside" />
    <DxChartDonutSeries ValueField="@((SaleInfo i) => i.Amount)" 
                        ArgumentField="@(i => i.City)" 
                        SummaryMethod="Enumerable.Sum">
        <DxChartSeriesLabel Visible="true" />
        <DxChartSeriesLegendItem IconCssClass="oi oi-flag">
            <TextTemplate>City: @context</TextTemplate>
        </DxChartSeriesLegendItem>
    </DxChartDonutSeries>
</DxChart>