Class Chart3DSeries

Gets or sets the options for customizing the 3D Chart series.

Inheritance

System.Object

SfBaseComponent

SfDataBoundComponent

Chart3DDataBoundComponent

Chart3DSeries

Inherited Members

SfBaseComponent.Dispose()

SfBaseComponent.Dispose(Boolean)

SfBaseComponent.OnObservableChange(String, Object, Boolean, NotifyCollectionChangedEventArgs)

SfDataBoundComponent.DataManager

SfDataBoundComponent.MainParent

SfDataBoundComponent.OnAfterRenderAsync(Boolean)

SfDataBoundComponent.OnInitializedAsync()

SfDataBoundComponent.OnParametersSetAsync()

SfDataBoundComponent.SetDataManager<T>(Object)

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.

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.

The default value is Column.

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.