Configures the major grid lines that extend horizontally across the chart from Y-axis major tick marks. Provides comprehensive control over grid line appearance including color, style, spacing, and visibility to enhance chart readability and value interpretation. Use this component to create horizontal visual guides that help users align data points with value positions and improve chart navigation.
Definition
Namespace:Telerik.Blazor.Components
Assembly:Telerik.Blazor.dll
Syntax:
public class ChartYAxisMajorGridLines : DataVizChildComponent, IComponent, IHandleEvent, IHandleAfterRender, IDisposableInheritance: objectComponentBaseDataVizChildComponentChartYAxisMajorGridLines
Implements:
Inherited Members
Constructors
public ChartYAxisMajorGridLines()Methods
protected override void BuildRenderTree(RenderTreeBuilder __builder)Overrides:
protected override void OnInitialized()Overrides:
protected override void OnParametersSet()Overrides:
Properties
Specifies the color of the major grid lines that extend horizontally from Y-axis tick marks. Accepts any valid CSS color value including hex codes (#E0E0E0), RGB values (rgb(224,224,224)), or color names (lightgray). Use this property to ensure grid lines complement your chart's color scheme while maintaining sufficient contrast for value reading. Default behavior uses a subtle color that doesn't interfere with data visualization but provides clear horizontal reference lines.
[Parameter]
public string Color { get; set; }Defines the line pattern for major grid lines using predefined dash styles. Available options include solid lines for standard grids, dashed patterns for subtle guidance, dotted lines for minimal visual impact, and various dash-dot combinations for specialized chart presentations. Choose dash types that balance visual guidance with data clarity - solid lines for emphasis, dashed for subtle value reference. See DashType for all available line pattern options.
[Parameter]
public DashType? DashType { get; set; }Specifies how many major grid lines to skip at the beginning of the axis. Use this property to align grid lines with specific value points or create custom grid patterns. For example, setting Skip to 1 will start grid lines from the second major tick position. Useful for fine-tuning grid alignment in charts with irregular value distributions or specific formatting requirements.
[Parameter]
public double? Skip { get; set; }Defines the interval between major grid lines in axis units. For numeric axes, specifies the value interval between grid lines (e.g., 10 shows lines every 10 units). For date axes, defines the time interval between grid lines (e.g., monthly or yearly intervals). Use this property to control grid density and prevent overcrowding in charts with wide value ranges.
[Parameter]
public double? Step { get; set; }Controls whether major grid lines are displayed on the chart. When set to true (default), horizontal grid lines appear at each major tick position to help align data points with Y-axis values. Set to false to hide grid lines for cleaner chart presentation or when grid lines might interfere with data visualization. Hidden grid lines can improve focus on data series while maintaining axis tick marks for value reference.
[Parameter]
public bool? Visible { get; set; }Sets the thickness of major grid lines in pixels. Use thicker lines (2-3 pixels) to emphasize value structure or thinner lines (0.5-1 pixel) for subtle guidance. This property affects visual prominence and can help establish hierarchy between major and minor grid lines. Consider chart size and data density when choosing width - thicker lines work well for charts requiring precise value reading.
[Parameter]
public double? Width { get; set; }