Selection
28 Jun 20172 minutes to read
SunburstChart provides selection support for the points on mouse click. To enable the selection , set the e-selectionsettings-enable
property to true in the e-selectionsettings
.
<div id="container" ej-sunburstchart e-selectionsettings-enable="true" >
</div>
Selection Display mode
You can customize the selected segment appearance by using color or opacity. You can choose between color or opacity using the e-selectionsettings-type
property in the selection Settings.
- selectionByColor – To display the selected segment appearance using color.
- selectionByOpacity – To display the selected segment appearance using opacity.
<div id="container" ej-sunburstchart e-selectionsettings-enable="true" e-selectionsettings-type="color" e-selectionsettings-color="red">
</div>
Selection Mode
Sunburst chart provides multiple option to represent the selected categories. You can select the segment categories by using the e-selectionsettings-mode
property in selectionSettings
- Child – To selection the child of selected parent.
- All – To selection the entire categories in group.
- Parent – To selection the parent of selected child.
- Single - To selection single item in the category.
Child
The following code shows how to set the selection type as child
<div id="container" ej-sunburstchart e-selectionsettings-enable="true" e-selecitonsettings-mode="child">
</div>
Parent
The parent mode can be enabled by using the below code
<div id="container" ej-sunburstchart e-selectionsettings-enable="true" e-selecitonsettings-mode="parent">
</div>
Point
To selection the particular segment, the point mode of the selection settings is used.
<div id="container" ej-sunburstchart e-selectionsettings-enable="true" e-selecitonsettings-mode="point">
</div>
All
The following code snippet is used for the all mode of selection settings
<div id="container" ej-sunburstchart e-selectionsettings-enable="true" e-selecitonsettings-mode="all">
</div>
Click here to view the online demo sample of Selection in the Sunburst Chart.