Class ChartArea

Provides options to customize the chart area.

Inheritance

System.Object

ChartSubComponent

ChartArea

Namespace: Syncfusion.Blazor.Charts

Assembly: Syncfusion.Blazor.dll

Syntax

public class ChartArea : ChartSubComponent, ISubcomponentTracker

Constructors

ChartArea()

Declaration

public ChartArea()

Properties

Background

Gets or sets the background of the chart area.

Declaration

public string Background { get; set; }

Property Value

Type	Description
System.String	A string representing the background color of the chart area. The default value is transparent.

Remarks

Accepts values in hex or rgba as valid CSS color string.

Examples

// This example demonstrates how to set the background to the chart:
<SfChart>
    <ChartArea Background="red" />
</SfChart>

BackgroundImage

Gets or sets the background image location or URL of the chart area.

Declaration

public string BackgroundImage { get; set; }

Property Value

Type	Description
System.String	A string representing the background image location or URL of the chart area. The default value is null.

Remarks

This property accepts a value as a URL link or location of an image. In this example, the image (wheat.png) is stored in the wwwroot folder and referenced using a relative path.

Examples

// This example demonstrates how to set the background image to the chart:
<SfChart>
    <ChartArea BackgroundImage="wheat.png" />
</SfChart>

Border

Gets or sets an instance of ChartAreaBorder which controls the customization of the chart area border color and width.

Declaration

public ChartAreaBorder Border { get; set; }

Property Value

Type	Description
ChartAreaBorder	An instance of ChartAreaBorder. The default value is a new instance of ChartAreaBorder.

Remarks

This property can be used to customize the color and width of the chart area border.

Examples

// This example demonstrates how to set the border for the chart area in the chart control:
<SfChart>
    <ChartArea>
        <ChartAreaBorder Width="2" Color="blue"></ChartAreaBorder>
    </ChartArea>
</SfChart>

Opacity

Gets or sets the opacity for the chart area background.

Declaration

public double Opacity { get; set; }

Property Value

Type	Description
System.Double	A double value representing the opacity for the chart area background. The default value is 1.

Remarks

Accepts values in numerical form from 0 to 1.

Examples

// This example demonstrates how to set the background opacity for a chart area:
<SfChart>
    <ChartArea Background="red" Opacity="0.5" />
</SfChart>

Width

Gets or sets the width for the chart area.

Declaration

public string Width { get; set; }

Property Value

Type	Description
System.String	A string specifying the width for the chart area. The default value is null.

Remarks

Accepts values in percentage or in pixels.