Skip to main content
All docs
V25.1
  • DevExpress v25.1 Update — Your Feedback Matters

    Our What's New in v25.1 webpage includes product-specific surveys. Your response to our survey questions will help us measure product satisfaction for features released in this major update and help us refine our plans for our next major release.

    Take the survey Not interested

    DxChart<T>.SetValueAxisVisualRange(List<Object>, String) Method

    Applies a specific visual range to a value axis.

    Namespace: DevExpress.Blazor

    Assembly: DevExpress.Blazor.v25.1.dll

    NuGet Package: DevExpress.Blazor

    #Declaration

    C#
    public void SetValueAxisVisualRange(
        List<object> range,
        string axisName = null
    )

    #Parameters

    Name Type Description
    range List<Object>

    The value range.

    #Optional Parameters

    Name Type Default Description
    axisName String null

    The value axis name

    #Remarks

    The Chart component may include multiple value axes. To apply a visual range to a specific axis, set its name in markup and pass it to the SetValueAxisVisualRange method as a parameter.

    If you do not pass the axis name, the Chart applies the specified visual range as follows:

    Single-pane charts
    To the first value axis in chart markup.
    Multi-pane charts
    To the value axis that belongs to the default pane.

    Note

    We do not recommend that you call the SetValueAxisVisualRange method in single-pane charts with multiple axes. Once you call the method, the Chart tries to adjust visual ranges for all value axes and may render series incorrectly.

    You can also apply a specific visual range to the argument axis using the SetArgumentAxisVisualRange method. To reset visual ranges for all axes, call the ResetVisualRange() method.

    To respond to visual range changes, handle the Chart’s VisualRangeChanged event.

    #Example

    The following code snippet displays a custom Set Visual Range button that applies a specific visual range to the Temperature value axis:

    DxChart - Set Value Axis Visual Range

    Razor
    @inject IWeatherSummaryDataProvider WeatherSummaryDataProvider
    
    <DxChart @ref="@chart"
             Data="weatherForecasts"
             Width="100%"
             Height="500px">
        <DxChartTitle Text="Annual Weather in Hilo, Hawaii" />
        @* ...*@
        <DxChartPane Name="TopPane" />
        <DxChartPane Name="BottomPane" />
        <DxChartRangeAreaSeries Pane="TopPane"
                                Name="Temperature Range, °F"
                                ArgumentField="@(i => new DateTime(2000, i.Date.Month, 1))"
                                ValueField="@((DetailedWeatherSummary s) => s.AverageTemperatureF)"
                                Color="@(Color.FromArgb(176, 218, 255))" />
        <DxChartSplineSeries Pane="TopPane"
                             Name="Average Temperature, °F"
                             SummaryMethod="Enumerable.Average"
                             ArgumentField="@(i => new DateTime(2000, i.Date.Month, 1))"
                             ValueField="@((DetailedWeatherSummary s) => s.AverageTemperatureF)"
                             Color="@(Color.FromArgb(0, 169, 230))" >
            <DxChartSeriesLabel Visible="true"
                                ValueFormat="@(ChartElementFormat.FromLdmlString("0#.## °F"))" />
        </DxChartSplineSeries>
        <DxChartBarSeries Pane="BottomPane"
                          Name="Precipitation, inch"
                          ArgumentField="@(i => new DateTime(2000, i.Date.Month, 1))"
                          SummaryMethod="Enumerable.Average"
                          ValueField="@((DetailedWeatherSummary s) => s.PrecipitationInch)"
                          Color="@(Color.FromArgb(220, 53, 69))">
            <DxChartSeriesLabel Visible="true"
                                ValueFormat="@(ChartElementFormat.FromLdmlString("0#.## inch"))" />
        </DxChartBarSeries>
        <DxChartValueAxis Pane="TopPane"
                          Name="Temperature">
            <DxChartAxisTitle Text="Temperature, °F" />
        </DxChartValueAxis>
        <DxChartValueAxis Pane="BottomPane"
                          SideMarginsEnabled="true">
            <DxChartAxisTitle Text="Precipitation, inch" />
        </DxChartValueAxis>
        <DxChartArgumentAxis>
            <DxChartAxisLabel Format="ChartElementFormat.Month" />
        </DxChartArgumentAxis>
    </DxChart>
    
    <DxButton Text="Set Visual Range" Click="@SetVisualRange" />
    
    @code {
        IEnumerable<DetailedWeatherSummary> weatherForecasts;
        DxChart<DetailedWeatherSummary> chart;
    
        void SetVisualRange() {
            chart.SetValueAxisVisualRange([75, 80], "Temperature");
        }
    
        protected override async Task OnInitializedAsync() {
            var weatherForecasts = await WeatherSummaryDataProvider.GetDataAsync();
            this.weatherForecasts = weatherForecasts.Where((DetailedWeatherSummary i) => i.City == "HILO");
        }
    }
    
    See Also