Back to Devexpress

DxPieChart<T>.PointSelectionMode Property

blazor-devexpress-dot-blazor-dot-dxpiechart-1-d7ffa48d.md

latest3.5 KB
Original Source

DxPieChart<T>.PointSelectionMode Property

Specifies whether a user can select pie sectors.

Namespace : DevExpress.Blazor

Assembly : DevExpress.Blazor.v25.2.dll

NuGet Package : DevExpress.Blazor

Declaration

csharp
[DefaultValue(ChartSelectionMode.None)]
[Parameter]
public ChartSelectionMode PointSelectionMode { get; set; }

Property Value

TypeDefaultDescription
ChartSelectionModeNone

A value that identifies a selection mode.

|

Available values:

NameDescription
None

A user cannot select points or series.

| | Single |

A single point or series can be selected at the same time.

| | Multiple |

Multiple points or series can be selected at the same time.

|

Remarks

A user should click a pie sector to select it:

Example

The following example obtains 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>



@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;
    }
}

See Also

DxPieChart<T> Class

DxPieChart<T> Members

DevExpress.Blazor Namespace