DxChartAxisGridLines.Visible Property

Specifies whether grid lines are displayed.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v20.2.dll

Declaration

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

Property Value

Type Default Description
Boolean

true for the value axis;
false for the argument axis.

true to display grid lines; otherwise, false.

Remarks

The Chart component's default grid line visibility is as follows:

Chart - Default Grid Lines

The code below sets the argument axis's Visible property to true to show vertical grid lines in the Chart component.

<DxChart Data="@forecasts">
    <DxChartBarSeries ArgumentField="@((WeatherForecast i) => i.Date)"
                      ValueField="@((WeatherForecast i) => i.Precipitation)"
                      Name="Precipitation">
        <DxChartSeriesLabel Visible="true">
            <DxChartSeriesLabelConnector Visible="true" Width="2" />
        </DxChartSeriesLabel>
    </DxChartBarSeries>
    <DxChartLineSeries ArgumentField="@((WeatherForecast i) => i.Date)"
                       ValueField="@((WeatherForecast i) => i.TemperatureC)"
                       Name="Temperature">
    </DxChartLineSeries>
    <DxChartArgumentAxis>
        <DxChartAxisGridLines Visible="true" />
    </DxChartArgumentAxis>
</DxChart>

Chart - Grid Lines

To hide both horizontal and vertical grid lines, set the value axis's Visible property to false.

<DxChart Data="@forecasts">
    <DxChartBarSeries ArgumentField="@((WeatherForecast i) => i.Date)"
                      ValueField="@((WeatherForecast i) => i.Precipitation)"
                      Name="Precipitation">
        <DxChartSeriesLabel Visible="true">
            <DxChartSeriesLabelConnector Visible="true" Width="2" />
        </DxChartSeriesLabel>
    </DxChartBarSeries>
    <DxChartLineSeries ArgumentField="@((WeatherForecast i) => i.Date)"
                       ValueField="@((WeatherForecast i) => i.TemperatureC)"
                       Name="Temperature">
    </DxChartLineSeries>
    <DxChartValueAxis>
        <DxChartAxisGridLines Visible="false" />
    </DxChartValueAxis>
</DxChart>

Chart - Hidden Grid Lines

See Also