Here is an illustration of an ASP.NET sample:
<asp:Chart ID="Chart1" runat="server" Width="600px">
<Series>
<asp:Series Name="Series1" ChartType="BoxPlot" YValuesPerPoint="6">
<Points>
<asp:DataPoint XValue="1" YValues="10,60,20,50,30,40" />
<asp:DataPoint XValue="2" YValues="40,90,50,80,60,70" />
<asp:DataPoint XValue="3" YValues="20,70,30,60,40,50" />
</Points>
</asp:Series>
</Series>
<ChartAreas>
<asp:ChartArea Name="ChartArea1">
<AxisY>
<MajorGrid LineColor="DarkGray" LineDashStyle="Dot" />
<MajorTickMark LineColor="DarkGray" LineDashStyle="Dot" />
</AxisY>
<AxisX>
<MajorGrid LineColor="DarkGray" LineDashStyle="Dot" />
<MajorTickMark LineColor="DarkGray" LineDashStyle="Dot" />
</AxisX>
</asp:ChartArea>
</ChartAreas>
</asp:Chart>
https://i.sstatic.net/yTmpl.png
To find more information about this presentation, please visit: MSDN - Box Plot Chart
UPDATE:
You have the option to dynamically bind data as seen below:
protected void Page_Load(object sender, EventArgs e)
{
MyDataCollection data = new MyDataCollection();
Chart1.Series[0].Points.DataBind(data, "XValue", "LowWhisker,UpWhisker,LowWBox,UpBox,Average,Median", null);
}
public class MyDataCollection : List<MyData>
{
public MyDataCollection()
{
Add(new MyData { XValue = 1, LowWhisker = 10, UpWhisker = 60, LowWBox = 20, UpBox = 50, Average = 30, Median = 40 });
Add(new MyData { XValue = 2, LowWhisker = 40, UpWhisker = 90, LowWBox = 50, UpBox = 80, Average = 60, Median = 70 });
Add(new MyData { XValue = 3, LowWhisker = 20, UpWhisker = 70, LowWBox = 30, UpBox = 60, Average = 40, Median = 50 });
}
}
public class MyData
{
public double XValue { get; set; }
public double LowWhisker { get; set; }
public double UpWhisker { get; set; }
public double LowWBox { get; set; }
public double UpBox { get; set; }
public double Average { get; set; }
public double Median { get; set; }
}
Remember to call DataBind() when adding or removing data from your collection.
UPDATE 2: You can change XValue to a string by adjusting MyData and MyDataCollection accordingly:
https://i.sstatic.net/ljrKf.png
UPDATE 3: Using a DataTable,
protected void Page_Load(object sender, EventArgs e)
{
MyDataTable dt = new MyDataTable();
foreach (DataRow row in dt.Rows)
Chart1.Series[0].Points.AddXY(row["Status"], new object[] { row["Min"], row["Max"], row["Avg"], row["Percentile25"], row["Percentile50"], row["Percentile75"] });
}
public class MyDataTable : DataTable
{
public MyDataTable()
{
Columns.Add("Title", typeof(string));
Columns.Add("Status", typeof(string));
Columns.Add("Min", typeof(double));
Columns.Add("Max", typeof(double));
Columns.Add("Avg", typeof(double));
Columns.Add("Percentile25", typeof(double));
Columns.Add("Percentile50", typeof(double));
Columns.Add("Percentile75", typeof(double));
DataRow row = NewRow();
row["Status"] = "Status 1";
row["Min"] = 10;
row["Max"] = 60;
row["Avg"] = 20;
row["Percentile25"] = 50;
row["Percentile50"] = 30;
row["Percentile75"] = 40;
Rows.Add(row);
row = NewRow();
row["Status"] = "Status 2";
row["Min"] = 40;
row["Max"] = 90;
row["Avg"] = 50;
row["Percentile25"] = 80;
row["Percentile50"] = 60;
row["Percentile75"] = 70;
Rows.Add(row);
row = NewRow();
row["Status"] = "Status 3";
row["Min"] = 20;
row["Max"] = 70;
row["Avg"] = 30;
row["Percentile25"] = 60;
row["Percentile50"] = 40;
row["Percentile75"] = 50;
Rows.Add(row);
}
}
https://i.sstatic.net/pRCm5.png