New to Telerik UI for Blazor? Start a free 30-day trial

ChartXAxisLine

Class

Configures the main horizontal line of the chart X-axis that serves as the foundation for category positioning and visual reference. Provides comprehensive control over axis line appearance including color, style, thickness, and visibility to create professional chart presentations. Use this component to customize the primary horizontal axis line that defines the bottom or top boundary of your chart's data area.

Definition

Namespace:Telerik.Blazor.Components

Assembly:Telerik.Blazor.dll

Syntax:

public class ChartXAxisLine : DataVizChildComponent, IComponent, IHandleEvent, IHandleAfterRender, IDisposable

Inheritance: objectComponentBaseDataVizChildComponentChartXAxisLine

Implements: IComponentIDisposableIHandleAfterRenderIHandleEvent

Inherited Members DataVizChildComponent.Dispose()DataVizChildComponent.Dispose(bool)ComponentBase.OnInitializedAsync()ComponentBase.OnParametersSetAsync()ComponentBase.StateHasChanged()ComponentBase.ShouldRender()ComponentBase.OnAfterRenderAsync(bool)ComponentBase.InvokeAsync(Action)ComponentBase.InvokeAsync(Func<Task>)ComponentBase.DispatchExceptionAsync(Exception)ComponentBase.SetParametersAsync(ParameterView)...

Constructors

ChartXAxisLine()

public ChartXAxisLine()

Methods

BuildRenderTree(RenderTreeBuilder)

protected override void BuildRenderTree(RenderTreeBuilder __builder)

Parameters:__builderRenderTreeBuilder

Overrides: ComponentBase.BuildRenderTree(RenderTreeBuilder)

OnAfterRender(bool)

protected override void OnAfterRender(bool firstRender)

Parameters:firstRenderbool

Overrides: ComponentBase.OnAfterRender(bool)

OnInitialized()

protected override void OnInitialized()

Overrides: DataVizChildComponent.OnInitialized()

OnParametersSet()

protected override void OnParametersSet()

Overrides: ComponentBase.OnParametersSet()

Serialize()

Dictionary<string, object>

public Dictionary<string, object> Serialize()

Returns:

Dictionary<string, object>

Properties

Color

string

Sets the color of the main X-axis line that runs horizontally across the chart. Accepts any valid CSS color value including hex codes (#333333), RGB values (rgb(51,51,51)), or color names (black). Use this to ensure the axis line has appropriate contrast and visibility against your chart's background and complements the overall design. Example: Set to "#666666" for a professional gray axis line, or "#2c3e50" for a darker, more prominent horizontal reference.

[Parameter]
public string Color { get; set; }

DashType

DashType?

Sets the dash pattern style for the main X-axis line. Controls the visual appearance of the horizontal axis line, allowing for solid lines or various dashed patterns to create different design effects. Use this to create distinctive axis styles that complement your chart design or match your application's visual language. Accepts values from the DashType enumeration including solid, dash, dot, and various dash-dot combinations.

[Parameter]
public DashType? DashType { get; set; }

Visible

bool?

Controls whether the main X-axis line is displayed on the chart. When set to true, the horizontal axis line appears to provide visual reference for category positioning. When false, the line is hidden. Use this to show or hide the axis line based on chart design preferences and the need for visual reference elements. Example: Set to true for charts requiring clear axis definition, or false for minimal designs where the axis line might be unnecessary.

[Parameter]
public bool? Visible { get; set; }

Width

double?

Sets the thickness of the main X-axis line in pixels. Controls how prominent the horizontal axis line appears and also affects the visual weight of associated major and minor ticks. Use this to create subtle axis lines with thin widths or bold axis definitions with thicker lines based on your chart's visual hierarchy. Example: Set to 1 for standard axis lines, 2 for more prominent axis definition, or 0.5 for subtle axis references.

[Parameter]
public double? Width { get; set; }