Class Chart3DSeries
Gets or sets the options for customizing the 3D Chart series.
Inheritance
Inherited Members
Namespace: Syncfusion.Blazor.Chart3D
Assembly: Syncfusion.Blazor.dll
Syntax
public class Chart3DSeries : Chart3DDataBoundComponent, IChart3DSubcomponentTracker, IChart3DElement
Remarks
The Chart3DSeries is child component of the Chart3DSeriesCollection. It is used to render the series in the 3D Chart. We can provide "n” number of series to the Chart3DSeriesCollection.
Examples
<SfChart3D>
<Chart3DSeriesCollection>
<Chart3DSeries XName="Browser" YName="Users" XAxisName="PrimaryXAxis" YAxisName="PrimaryYAxis" PointColorMapping="Color" Visible="true" Fill="SKyblue"
DataSource="@StatisticsDetails" Query="@query" Name="Users" Type="Chart3DSeriesType.Column" EnableTooltip="true" TooltipFormat="${series.name} : ${point.y}K" TooltipMappingName="Users"
ColumnWidth="0.7" LegendShape="LegendShape.Circle" StackingGroup="Group 1" Opacity="0.6" GroupName="Country" ColumnFacet="Chart3DShapeType.Cylinder"
ColumnSpacing="0.1">
<Chart3DAnimation Enable="true" Delay="200" Duration="2000"></Chart3DAnimation>
<Chart3DEmptyPointSettings Fill="gray" Mode="EmptyPointMode.Average">
<Chart3DEmptyPointBorder Color="green" Width="2"></Chart3DEmptyPointBorder>
</Chart3DEmptyPointSettings>
<Chart3DDataLabel Visible="true" NameField="Browser" Fill="blue" Format="N2" Opacity="0.9" DataLabelAngle="30" EnableRotation="true" Position="Chart3DDataLabelPosition.Top">
</Chart3DDataLabel>
</Chart3DSeries>
</Chart3DSeriesCollection>
</SfChart3D>
@code {
Query query = new Query();
public class Statistics
{
public string Browser { get; set; }
public double Users { get; set; }
public string Color { get; set; }
}
public List<Statistics> StatisticsDetails = new List<Statistics>
{
new Statistics { Browser = "Chrome", Users = 37, Color = "red" },
new Statistics { Browser = "UC Browser", Users = 17, Color = "blue" },
new Statistics { Browser = "iPhone", Users = 19, Color = "green" },
new Statistics { Browser = "Others", Users = 4, Color = "orange" },
new Statistics { Browser = "Opera", Users = 11, Color = "yellow" },
new Statistics { Browser = "Android", Users = 12, Color = "pink" },
};
}
Constructors
Chart3DSeries()
Declaration
public Chart3DSeries()
Properties
ColumnFacet
Gets or sets the 3D column or bar chart rendering facet. The available options are:
- Rectangle
- Cylinder
Declaration
public Chart3DShapeType ColumnFacet { get; set; }
Property Value
Type | Description |
---|---|
Chart3DShapeType | Accepts a value from the Chart3DShapeType enum. The default value is Rectangle. |
Remarks
The ColumnFacet property determines the rendering facet for 3D column or bar chart series in the SfChart3D. Choose between Rectangle and Cylinder options to define the appearance of the columns or bars in the chart.
ColumnSpacing
Gets or sets the space between adjacent SfChart3D series.
Declaration
public double ColumnSpacing { get; set; }
Property Value
Type | Description |
---|---|
System.Double | Accepts the double value ranges from 0 to 1. The default value is 0.1. |
Remarks
The ColumnSpacing property controls the space between adjacent series in the SfChart3D. Use this property to adjust the gap between columns or bars in a 3D column or bar chart. The value should be between 0 (no spacing) and 1 (maximum spacing relative to the series width). A smaller value results in tighter spacing between series, while a larger value increases the gap. The default value is 0.1, providing a moderate spacing between adjacent series.
ColumnWidth
Gets or sets the width of the column series.
Declaration
public double ColumnWidth { get; set; }
Property Value
Type | Description |
---|---|
System.Double | Accepts the double value ranges from 0 to 1. The default value is 0.7. |
Remarks
The ColumnWidth property specifies the width of the column series in the chart, as a percentage of the available space. The value should be between 0 and 1, where 0 represents no width (invisible) and 1 represents full width. The default value is 0.7, which provides a balanced width for column series in most cases.
DataSource
Gets or sets the data source for the SfChart3D series.
Declaration
public IEnumerable<object> DataSource { get; set; }
Property Value
Type | Description |
---|---|
System.Collections.Generic.IEnumerable<System.Object> | Accepts the IEnumerable object as a data source. Also, it can be an expando object, dynamic object, or list of objects. The default value is null. |
Remarks
The DataSource property allows you to bind data to the SfChart3D. You can use an IEnumerable object, an expando object, a dynamic object, or a list of objects as the data source. To consume data from a remote service or custom adaptor, use the SfDataManager.
Examples
<SfChart3D>
<Chart3DSeriesCollection>
<Chart3DSeries XName="Browser" YName="Users" DataSource="@StatisticsDetails" Name="Users" Type="Chart3DSeriesType.Column">
</Chart3DSeries>
</Chart3DSeriesCollection>
<Chart3DPrimaryXAxis ValueType="Syncfusion.Blazor.Chart3D.ValueType.Category"></Chart3DPrimaryXAxis>
</SfChart3D>
@code {
public class Statistics
{
public string Browser { get; set; }
public double Users { get; set; }
public string Color { get; set; }
}
public List<Statistics> StatisticsDetails = new List<Statistics>
{
new Statistics { Browser = "Chrome", Users = 65.3, Color = "red" },
new Statistics { Browser = "Safari", Users = 18.3, Color = "blue" },
new Statistics { Browser = "Edge", Users = 5, Color = "green" },
new Statistics { Browser = “Firefox”, Users = 3, Color = "orange" },
new Statistics { Browser = “Samsung Internet”, Users = 2.6, Color = "yellow" },
new Statistics { Browser = “Opera”, Users = 2.4, Color = "pink" },
};
}
EnableTooltip
Gets or sets a value indicating whether to toggle the tooltip option for the series.
Declaration
public bool EnableTooltip { get; set; }
Property Value
Type | Description |
---|---|
System.Boolean | Accepts a boolean value. The default value is true. |
Remarks
The EnableTooltip property controls whether tooltips are enabled for the series in the chart. Set this property to true to enable tooltips for the series, providing additional information on data points when hovered.
Fill
Gets or sets the fill color of the SfChart3D series.
Declaration
public string Fill { get; set; }
Property Value
Type | Description |
---|---|
System.String | Accepts valid CSS color string values such as hexadecimal, rgba, and color names. The default value is null. |
Remarks
The Fill property specifies the fill color for the series in the SfChart3D. You can use valid CSS color string values, such as hexadecimal (#RRGGBB), rgba (rgba(R,G,B,A)), or color names (e.g., "red", "blue"). Setting this property applies the specified fill color to the series. If not explicitly set, the default value is null, indicating that the series uses the default fill color defined by the chart theme.
GroupName
Specifies a name for the group that defines series which are mutually exclusive and can be overlaid. Series within the same group share the same baseline and location on the corresponding axis.
Declaration
public string GroupName { get; set; }
Property Value
Type | Description |
---|---|
System.String | Accepts the string value. The default value is null. |
Remarks
The GroupName property assigns a name to a group of mutually exclusive series that can be overlaid on the SfChart3D. Series within the same group share the same base-line and location on the corresponding axis. Use this property to organize and manage series that should be displayed together.
LegendShape
Gets or sets the option to customize the legend shape for the series. Possible values are:
- SeriesType: Represents the legend shape as the series type.
- Circle: Represents the legend shape as a circle.
- Rectangle: Represents the legend shape as a rectangle.
- Diamond: Represents the legend shape as a diamond.
- Cross: Represents the legend shape as a cross.
- VerticalLine: Represents the legend shape as a vertical line.
- HorizontalLine: Represents the legend shape as a horizontal line.
- Triangle: Represents the legend shape as a triangle.
- Pentagon: Represents the legend shape as a pentagon.
- InvertedTriangle: Represents the legend shape as an inverted triangle.
- Multiply: Represents the legend shape as the multiply.
Declaration
public LegendShape LegendShape { get; set; }
Property Value
Type | Description |
---|---|
LegendShape | Accepts the LegendShape enum value. The default value is SeriesType. |
Remarks
When the LegendShape is set to SeriesType, the legend shape is displayed based on the series type.
Examples
<SfChart3D>
<Chart3DSeriesCollection>
<Chart3DSeries XName="Browser" YName="Users" NameField="Browsers" LegendShape="LegendShape.Circle">
</Chart3DSeries>
</Chart3DSeriesCollection>
</SfChart3D>
@code {
public class Statistics
{
public string Browser { get; set; }
public double Users { get; set; }
}
public List<Statistics> StatisticsDetails = new List<Statistics>
{
new Statistics { Browser = "Chrome", Users = 65.3 },
new Statistics { Browser = "Safari", Users = 18.3},
new Statistics { Browser = "Edge", Users = 5 },
new Statistics { Browser = “Firefox”, Users = 3 },
new Statistics { Browser = “Samsung Internet”, Users = 2.6 },
new Statistics { Browser = “Opera”, Users = 2.4 },
};
}
Name
Gets or sets the name of the series in the SfChart3D component. The series name is displayed as the legend text for the series, providing a descriptive label in the chart's legend.
Declaration
public string Name { get; set; }
Property Value
Type | Description |
---|---|
System.String | Accepts a string value representing the name of the series. The default value is an empty string. |
Remarks
The Name property specifies the name of the series, which is used as the legend text for the series in the chart. Assign a descriptive name to this property to provide meaningful labels in the chart's legend for each series. If not explicitly set, the default value is an empty string.
Opacity
Gets or sets the opacity of the 3D Chart series.
Declaration
public double Opacity { get; set; }
Property Value
Type | Description |
---|---|
System.Double | Accepts the double value. The default value is 1. |
Remarks
The Opacity property controls the transparency of the SfChart3D series. Set this property to a value between 0 (completely transparent) and 1 (fully opaque) to adjust the opacity of the series. A value of 0 makes the series completely invisible, while a value of 1 makes it fully visible. The default value is 1, indicating full opacity.
PointColor
Gets or sets the color field name to be mapped to the points.
Declaration
public string PointColor { get; set; }
Property Value
Type | Description |
---|---|
System.String | Accepts string value of the color field name. The default value is empty string. |
Remarks
The PointColor property specifies the field name in the data source that contains the color information for each point in the chart series. Assign the name of the corresponding field in the data source to this property to map point colors correctly. If not explicitly set, the default value is an empty string, indicating that no color mapping is performed.
Query
Gets or sets the query for the SfChart3D series to filter the data source.
Declaration
public Query Query { get; set; }
Property Value
Type | Description |
---|---|
Query | Accepts the Query object to filter the data source. The default value is instance of a Query. |
Remarks
This property is applicable only when the DataSource is SfDataManager.
RendererKey
Declaration
public string RendererKey { get; set; }
Property Value
Type |
---|
System.String |
RendererType
Declaration
public Type RendererType { get; set; }
Property Value
Type |
---|
System.Type |
StackingGroup
Specifies the grouping of series in stacked Column/Bar SfChart3D. If two or more series share the same value, they will be grouped together.
Declaration
public string StackingGroup { get; set; }
Property Value
Type | Description |
---|---|
System.String | Accepts a string value. The default value is an empty string. |
Remarks
This property is applicable only to stacking series types.
TooltipField
Gets or sets the field name to get the tooltip text from the data source.
Declaration
public string TooltipField { get; set; }
Property Value
Type | Description |
---|---|
System.String | Accepts the string value. The default value is empty string. |
Remarks
The TooltipField property specifies the field name in the data source from which to fetch the tooltip text for each data point in the series. Assign the name of the corresponding field in the data source to this property to enable tooltips with custom text for each point in the series. If not explicitly set, the default value is an empty string, indicating that tooltips will use default text or values.
TooltipFormat
Gets or sets the tooltip format for the specific SfChart3D series.
Declaration
public string TooltipFormat { get; set; }
Property Value
Type | Description |
---|---|
System.String | Accepts the string value. The default value is an empty string. |
Remarks
The TooltipFormat property allows customization of the tooltip format for the specific series over common Format.
By default, the tooltip displays information for the x and y values of a point.
Additional information can be included in the tooltip using a format string.
For example, the format "$series.name: $point.x" displays the series name and xvalue of the point in the tooltip.
Type
Gets or sets the type of series for the SfChart3D component. Possible values are:
- Column: Represents vertical column series.
- Bar: Represents horizontal bar series.
- StackingColumn: Represents stacked vertical column series.
- StackingBar: Represents stacked horizontal bar series.
- StackingColumn100: Represents 100% stacked vertical column series.
- StackingBar100: Represents 100% stacked horizontal bar series.
Declaration
public Chart3DSeriesType Type { get; set; }
Property Value
Type | Description |
---|---|
Chart3DSeriesType | Accepts the Chart3DSeriesType enum value. The default value is Column. |
Remarks
The Type property specifies the type of series to be displayed in the 3D chart. Choose one of the available values from the Chart3DSeriesType enumeration to define the appearance and behavior of the series. If not explicitly set, the default value is Column, representing vertical column series.
Visible
Gets or sets the visibility of the series.
Declaration
public bool Visible { get; set; }
Property Value
Type | Description |
---|---|
System.Boolean | Accepts bool value. The default value is true. |
Remarks
The Visible property determines whether the series is visible or hidden in the chart. Set this property to true to make the series visible, or false to hide it. The default value is true, indicating that the series is initially visible.
XAxisName
Gets or sets the x-axis name to which the series has to be associated.
Declaration
public string XAxisName { get; set; }
Property Value
Type | Description |
---|---|
System.String | Accepts string value of the x-axis name. The default value is "PrimaryXAxis". |
Remarks
The XAxisName property specifies the name of the x-axis to which the series should be associated in the chart. Assign the desired x-axis name to this property to link the series with the appropriate x-axis. If not explicitly set, the default value is "PrimaryXAxis".
XName
Gets or sets the DataSource field that contains the x value.
Declaration
public string XName { get; set; }
Property Value
Type | Description |
---|---|
System.String | Accepts string value of the field name in the data source. The default value is empty string. |
Remarks
The XName property specifies the field name in the data source that contains the x value for the chart series. Assign the name of the corresponding field in the data source to this property to map the x values correctly. If not explicitly set, the default value is an empty string.
YAxisName
Gets or sets the y-axis name to which the series has to be associated.
Declaration
public string YAxisName { get; set; }
Property Value
Type | Description |
---|---|
System.String | Accepts string value of the y-axis name. The default value is "PrimaryYAxis". |
Remarks
The YAxisName property specifies the name of the y-axis to which the series should be associated in the chart. Assign the desired y-axis name to this property to link the series with the appropriate y-axis. If not explicitly set, the default value is "PrimaryYAxis".
YName
Gets or sets the DataSource field that contains the y value.
Declaration
public string YName { get; set; }
Property Value
Type | Description |
---|---|
System.String | Accepts string value of the field name in the data source. The default value is empty string. |
Remarks
The YName property specifies the field name in the data source that contains the y value for the chart series. Assign the name of the corresponding field in the data source to this property to map the y values correctly. If not explicitly set, the default value is an empty string.
Methods
OnInitializedAsync()
Declaration
protected override Task OnInitializedAsync()
Returns
Type |
---|
System.Threading.Tasks.Task |
Overrides
OnParametersSetAsync()
Declaration
protected override Task OnParametersSetAsync()
Returns
Type |
---|
System.Threading.Tasks.Task |