Siticone Box Plot Chart

The SiticoneBoxPlotChart is a statistical visualization control used to display the distribution of data based on a five-number summary: minimum, first quartile (Q1), median, third quartile (Q3), and maximum. It supports both raw data binding (auto-calculation) and pre-summarized data.

Data Binding Modes

This control supports two distinct modes of data binding: Raw Data (where the chart calculates statistics) and Pre-Summarized Data (where you provide the statistics).

Mode 1: Raw Data Binding

Use this mode when you have a list of raw values for each category. The chart will automatically calculate quartiles, medians, and outliers.

Property	Type	Description & Usage Example
`DataSource`	object	chart.DataSource = myRawDataTable; The source of the raw data. Accepts `DataTable`, `List<T>`, or `IEnumerable`.
`CategoryMember`	string	chart.CategoryMember = "Department"; The column name or property defining the groups (X-axis categories).
`ValueMember`	string	chart.ValueMember = "Salary"; The column containing the numeric values. The chart will group these by category and compute statistics.

Mode 2: Pre-Summarized Data

Use this mode when your data source already contains the calculated statistics (Min, Q1, Median, Q3, Max).

Property	Type	Description & Usage Example
`MinimumMember`	string	chart.MinimumMember = "MinVal"; Column for the minimum value (bottom whisker).
`FirstQuartileMember`	string	chart.FirstQuartileMember = "Q1Val"; Column for the 25th percentile (bottom of the box).
`MedianMember`	string	chart.MedianMember = "MedVal"; Column for the median (line inside the box).
`ThirdQuartileMember`	string	chart.ThirdQuartileMember = "Q3Val"; Column for the 75th percentile (top of the box).
`MaximumMember`	string	chart.MaximumMember = "MaxVal"; Column for the maximum value (top whisker).

Appearance & Theming

Customize the visual style of the box plots, whiskers, and outliers.

Property	Type	Description & Usage Example
`Theme`	BoxPlotThemePreset	chart.Theme = BoxPlotThemePreset.Forest; Applies a predefined color scheme. Options include `Professional`, `Cool`, `Warm`, `Forest`, and more.
`BoxColor`	Color	chart.BoxColor = Color.CornflowerBlue; The fill color of the interquartile range (IQR) box.
`MedianColor`	Color	chart.MedianColor = Color.DarkBlue; The color of the horizontal median line drawn inside the box.
`WhiskerColor`	Color	chart.WhiskerColor = Color.Black; The color of the vertical lines extending to Min/Max.
`OutlierColor`	Color	chart.OutlierColor = Color.Red; The color of dots representing outlier values (only in Raw Data mode).
`BoxWidthPercentage`	float	chart.BoxWidthPercentage = 0.6f; Controls the width of the box relative to the category spacing (0.1 to 1.0).

Behavior & Interaction

Control user interaction features such as highlighting and tooltips.

Property	Type	Description & Usage Example
`EnableHighlight`	bool	chart.EnableHighlight = true; If true, the box under the mouse cursor lightens to indicate focus.
`EnableTooltips`	bool	chart.EnableTooltips = true; Shows a floating popup with detailed statistics (Min, Q1, Median, Q3, Max) on hover.

Public Methods

DataBind()

// Forces the chart to re-read the DataSource and redraw.
// Call this after updating the underlying data list or table.
chart.DataBind();

Events

Events to handle user interaction with individual box plots.

Event Descriptions & Wiring

// 1. BoxPlotClick Event
// Fires when a user clicks on a box plot.
chart.BoxPlotClick += (s, e) => 
{
                MessageBox.Show($"Category: {e.Category}\nMedian: {e.Median}");
};

// 2. BoxPlotHover Event
// Fires when the mouse moves over a box plot.
chart.BoxPlotHover += (s, e) => 
{
    statusLabel.Text = $"Hovering: {e.Category}";
};

// 3. DataLoaded Event
// Fires after DataBind() completes and statistics are calculated.
chart.DataLoaded += (s, e) => 
{
                Debug.WriteLine($"Loaded {e.CategoryCount} categories. Range: {e.GlobalMin} - {e.GlobalMax}");
};

Detailed Usage Examples

Example 1: Binding Raw Data (Auto-Calculation)

This example binds a list of raw salary data. The chart groups data by Department and automatically calculates the 5-number summary.

C# - Raw Data Binding

public class Employee
{
                public string Department { get; set; }
                public double Salary { get; set; }
}

private void LoadRawData()
{
                // 1. Create Raw Data
                var employees = new List<Employee>();
                var rand = new Random();
    
                for (int i = 0; i < 50; i++)
    {
        employees.Add(new Employee { Department = "IT", Salary = rand.Next(40000, 90000) });
        employees.Add(new Employee { Department = "HR", Salary = rand.Next(35000, 65000) });
        employees.Add(new Employee { Department = "Sales", Salary = rand.Next(30000, 120000) });
    }

                // 2. Configure Binding
    siticoneBoxPlotChart1.DataSource = employees;
    siticoneBoxPlotChart1.CategoryMember = "Department"; // Group by this
    siticoneBoxPlotChart1.ValueMember = "Salary";        // Calculate stats on this
    
                // 3. Styling
    siticoneBoxPlotChart1.Theme = BoxPlotThemePreset.Professional;
    siticoneBoxPlotChart1.BoxWidthPercentage = 0.5f;
    
    siticoneBoxPlotChart1.DataBind();
}

Example 2: Binding Pre-Summarized Data

Use this when your database query or backend logic has already calculated the statistics.

C# - Summarized Data Binding

private void LoadSummarizedData()
{
                DataTable dt = new DataTable();
    dt.Columns.Add("Group", typeof(string));
    dt.Columns.Add("Min", typeof(double));
    dt.Columns.Add("Q1", typeof(double));
    dt.Columns.Add("Median", typeof(double));
    dt.Columns.Add("Q3", typeof(double));
    dt.Columns.Add("Max", typeof(double));

    dt.Rows.Add("Class A", 55, 65, 72, 80, 95);
    dt.Rows.Add("Class B", 40, 50, 60, 70, 85);

    siticoneBoxPlotChart1.DataSource = dt;
    siticoneBoxPlotChart1.CategoryMember = "Group";
    
                // Map the statistical columns
    siticoneBoxPlotChart1.MinimumMember = "Min";
    siticoneBoxPlotChart1.FirstQuartileMember = "Q1";
    siticoneBoxPlotChart1.MedianMember = "Median";
    siticoneBoxPlotChart1.ThirdQuartileMember = "Q3";
    siticoneBoxPlotChart1.MaximumMember = "Max";

    siticoneBoxPlotChart1.Theme = BoxPlotThemePreset.Forest;
    siticoneBoxPlotChart1.DataBind();
}

Enumerations

BoxPlotThemePreset Enum

public enum BoxPlotThemePreset
{
    Custom, 
    Professional, 
    Cool, 
    Warm, 
    Forest, 
    Ocean, 
    Graphite, 
    Sunrise,
                // ... and many more
}