Specify Y-axis minimum, maximum and grid lines for Bar chart

Question

I have created bar chart control in wpf using system.windows.controls.datavisualization.toolkit dll. I want to specify the minimum and maximum for the Y axis.

Here the Bar-chart `

<Grid >
    <barChartToolkit:Chart Height="280" HorizontalAlignment="Stretch" Title="Resource Availability"  Name="columnChart" Background="White"  VerticalAlignment="Stretch"  Width="360">
        <barChartToolkit:ColumnSeries DependentValuePath="Value" IndependentValuePath="Name" ItemsSource="{Binding}"  Title="Resources" />
    </barChartToolkit:Chart>
</Grid>

` Now I'm created the list and binded DataContext of the chart

public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();
        showColumnChart();
    }

    private void showColumnChart()
    {
        List<BarCHartData> valueList = new List<BarCHartData>();
        valueList.Add(new BarCHartData() { Name = "Developer", Value = 10 });
        valueList.Add(new BarCHartData() { Name = "Tester", Value = 20 });
        valueList.Add(new BarCHartData() { Name = "QA", Value = 30 });
        columnChart.DataContext = valueList;
    }

}

public class BarCHartData
{
    public string Name { get; set; }

    public int Value { get; set; }
}

here my bar chart plotting like below image

I have tried with below code

<Window x:Class="WpfToolkitChart.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:barChartToolkit="clr-namespace:System.Windows.Controls.DataVisualization.Charting;assembly=System.Windows.Controls.DataVisualization.Toolkit">

<Grid >
    <barChartToolkit:Chart Height="280" HorizontalAlignment="Stretch" Title="Resource Availability"  Name="columnChart" Background="White"  VerticalAlignment="Stretch"  Width="360">
        <barChartToolkit:ColumnSeries DependentValuePath="Value" IndependentValuePath="Name" ItemsSource="{Binding}"  Title="Resources" />
        <barChartToolkit:Chart.Axes>
            <barChartToolkit:LinearAxis Orientation="Y" Minimum="0" Maximum="100"/>
        </barChartToolkit:Chart.Axes>
    </barChartToolkit:Chart>
</Grid>

but this code removing the grid line of the graph like below image

how can i set the maximum and minimum value to the Y-Axis with the gridlines?

Answer 1

You just need to set ShowGridLines="True" in your LinearAxis:

XAML:

<Window
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:local="clr-namespace:WpfApp55"
    xmlns:chartingToolkit="clr-namespace:System.Windows.Controls.DataVisualization.Charting;assembly=System.Windows.Controls.DataVisualization.Toolkit" 
    x:Class="WpfApp55.MainWindow"
    mc:Ignorable="d"
    Title="MainWindow" Height="350" Width="525">
<Window.Resources>
    <x:Array x:Key="array1" Type="{x:Type local:BarChartData}">
        <local:BarChartData Name="Developer" Value="25" />
        <local:BarChartData Name="Tester" Value="50" />
        <local:BarChartData Name="QA" Value="75" />
    </x:Array>
</Window.Resources>

<Grid>

    <chartingToolkit:Chart Title="Sample Chart">
        <chartingToolkit:Chart.Axes>
            <chartingToolkit:LinearAxis Minimum="0" 
                                        Maximum="100" 
                                        Orientation="Y"
                                        ShowGridLines="True" />
        </chartingToolkit:Chart.Axes>
        <chartingToolkit:ColumnSeries DependentValuePath="Value" 
                                      IndependentValuePath="Name" 
                                      ItemsSource="{StaticResource array1}"/>
    </chartingToolkit:Chart>

</Grid>

Answer 2

If you want to limit the values for display, you could use a converter and DependentValueBinding instead of DependentValuePath

public class RangeConverter : IValueConverter
{
    public double Min { get; set; }
    public double Max { get; set; }
    public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
    {
        var d = System.Convert.ToDouble(value, culture);
        return Math.Max(Min, Math.Min(Max, d));
    }

    public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
    {
        throw new NotImplementedException();
    }
}

Converter resource:

<local:RangeConverter x:Key="rangeConverter" Max="100" Min="0"/>

Usage

<DVC:ColumnSeries
    DependentValueBinding="{Binding Value,Converter={StaticResource rangeConverter}}"
    IndependentValuePath="Name"
    ItemsSource="{Binding}"
    Title="Resources"/>