MAUI | ComponentOne
Controls / FlexChart / Charts Types / Statistical Charts / ErrorBar Chart
In This Topic
    ErrorBar Chart
    In This Topic

    Error bars are the charts that indicate the estimated error or uncertainty in the measured data to give an idea about how precise that data is. They most often represent this through the standard deviation of data set. Error bars are, generally useful while plotting results of scientific studies, experiments, or any other measurements that show variation in data from original values. Deviation in sales forecast is one of the good examples that can be presented using these error bars.

    ErrorBar

    In FlexChart, error bars can be shown along with various chart types such as line, area, column, scatter and, spline charts. Error bars can be implemented using the ErrorBar class which represents an error bar series. Apart from other series related properties, this class provides properties specific to error bar series such as the ErrorAmount property, which lets you specify the error amount of the series as a standard error amount, a percentage or a standard deviation. This property accepts the values from ErrorAmount enumeration. FlexChart also provides options to specify whether to display error bars in plus, minus or both directions using the Direction property. EndStyle property of FlexChart lets you specify whether to display caps or not at the ends of error bars. To customize the appearance of bar style, you can use the ErrorBarStyle property.

    Following XAML code is required to create the ErrorBar chart:

    XAML
    Copy Code
    <c1:FlexChart x:Name="flexChart" Header="Sales Forecast Accuracy" ItemsSource="{Binding Data}"
                  BindingX="Name" Binding="Sales" ChartType="Column"  Margin="8" >
        <c1:ErrorBar x:Name="errorBar" ErrorAmount="FixedValue"  ErrorValue="50"
                  EndStyle="Cap"  Direction="Both" />
    </c1:FlexChart>
    

    Following C# code is required to create the ErrorBar chart.

    C#
    Copy Code
    public partial class ErrorBarChart : ContentPage
    {
        public ErrorBarChart()
        {
            InitializeComponent();
        }
    
        Service ds = Service.GetService();
    
        List<CountrySalesData> _data;
    
        public List<CountrySalesData> Data => _data != null ? _data : _data = ds.GetCountrySales();
    }
    
    public class CountrySalesData
    {
        public string Name { get; set; }
        public double Sales { get; set; }
    }
    
    public class Service
    {
        static Service ser;
        static Random rnd = new Random();
    
        public static Service GetService()
        {
            if (ser == null)
                ser = new Service();
            return ser;
        }
    
        static string[] countries = { "US", "Japan", "China", "India", "Germany", "UK" };
    
        public List<CountrySalesData> GetCountrySales(int rangeMin = 100, int rangeMax = 1000)
        {
            var data = new List<CountrySalesData>();
            for (int i = 0; i < countries.Length; i++)
            {
                var country = new CountrySalesData
                {
                    Name = countries[i],
                    Sales = rnd.Next(rangeMin, rangeMax),
                };
                data.Add(country);
            }
            return data;
        }
    }