DxPieChart<T>.SelectionChanged Event

Fires when a user selects/deselects a pie chart sector.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v22.1.dll

NuGet Package: DevExpress.Blazor

Declaration

[Parameter]
public Action<PieChartSelectionChangedEventArgs> SelectionChanged { get; set; }

Event Data

The SelectionChanged event's data class is PieChartSelectionChangedEventArgs. The following properties provide information specific to this event:

Property	Description
IsPointSelected	Identifies whether a pie sector is selected.
Point	Returns the last point that is clicked when selecting.
Series	Returns a series to which the clicked point belongs.

Remarks

Use the DxPieChart.PointSelectionMode property to enable sector selection in pie charts.

Example

The following example shows how to obtain an argument and value of a selected pie sector:

Razor

@page "/"
<DxPieChart Data="@infos"
            Diameter="1"
            InnerDiameter="0.5"
            Width="500" Height="300" 
            PointSelectionMode=ChartSelectionMode.Single
            SelectionChanged="@OnSelectionChanged">
    <DxPieChartSeries T="SessionInfo"
                      TArgument="string"
                      TValue="double"
                      ArgumentField="i => i.Country"
                      ValueField="i => i.Total"/>
</DxPieChart>
<br /><br />
@if (Selection != null) {
    <div id="selection-args">
        <table>
            <tr> <td>Selected Point Argument:</td><td> @Selection.Point.Argument</td> </tr>
            <tr> <td>Selected Point Value:</td><td> @Selection.Point.Value</td> </tr>
        </table>
    </div>
}
@code {
    private SessionInfo[] infos;
    PieChartSelectionChangedEventArgs Selection { get; set; }
    protected override void OnInitialized() {
        infos = GetSessionInfos();
    }
    void OnSelectionChanged(PieChartSelectionChangedEventArgs selectionArgs) {
        Selection = selectionArgs;
        StateHasChanged();
    }
    public class SessionInfo {
        public string Country { get; set; }
        public int Total { get; set; }
    }
    public SessionInfo[] GetSessionInfos() {
        SessionInfo[] sales = new SessionInfo[] {
            new SessionInfo() { Country = "China",          Total = 16591},
            new SessionInfo() { Country = "United States",  Total = 10286},
            new SessionInfo() { Country = "India",          Total = 7978},
            new SessionInfo() { Country = "South Korea",    Total = 6118},
            new SessionInfo() { Country = "Germany",        Total = 5385},
            new SessionInfo() { Country = "Turkey",         Total = 5064},
            new SessionInfo() { Country = "Vietnam",        Total = 2804},
            new SessionInfo() { Country = "United Kingdom", Total = 2451},
            new SessionInfo() { Country = "Italy",          Total = 2130},
            new SessionInfo() { Country = "Brazil",         Total = 2093},
        };
        return sales;
    }
}