Question

有谁知道如何使用ASP.net，C＃或JavaScript创建Box Plot Chart？

这是我在网上找到的，但我不确定如何将它应用到我的案例中：

代码：

List<String> xValue = new List<String> { "Ala (A)", "Arg (R)", "Asn (N)", "Asp (D)", "Cys (C)", "Gln (Q)", "Glu (E)", "Gly (G)", "His (H)", "Ile (I)", "Leu (L)", "Lys (K)", "Met (M)", "Phe (F)", "Pro (P)", "Ser (S)", "Thr (T)", "Trp (W)", "Tyr (Y)", "Val (V)", "Pyl (O)", "Sec (U)" };
    Chart Chart = new Chart();
    Chart.chart_main.Series.Clear();
    Chart.chart_main.Series.Add("BoxPlotSeries");
    for (Int32 i = 0; i < xValue.Count; i++)
    {
        Chart.chart_main.Series.Add(xValue[i]); 
    }

    for (Int32 i = 0; i < DYL; i++)
    {
        if (Data[i, 0] == null) break;
        Chart.chart_main.Series[xValue[0]].Points.AddY(boxplot_helper(i, Dataslots[0]));
        Chart.chart_main.Series[xValue[1]].Points.AddY(boxplot_helper(i, Dataslots[1]));
        Chart.chart_main.Series[xValue[2]].Points.AddY(boxplot_helper(i, Dataslots[2]));
        Chart.chart_main.Series[xValue[3]].Points.AddY(boxplot_helper(i, Dataslots[3]));
        Chart.chart_main.Series[xValue[4]].Points.AddY(boxplot_helper(i, Dataslots[4]));
        Chart.chart_main.Series[xValue[5]].Points.AddY(boxplot_helper(i, Dataslots[5]));
        Chart.chart_main.Series[xValue[6]].Points.AddY(boxplot_helper(i, Dataslots[6]));
        Chart.chart_main.Series[xValue[7]].Points.AddY(boxplot_helper(i, Dataslots[7]));
        Chart.chart_main.Series[xValue[8]].Points.AddY(boxplot_helper(i, Dataslots[8]));
        Chart.chart_main.Series[xValue[9]].Points.AddY(boxplot_helper(i, Dataslots[9]));
        Chart.chart_main.Series[xValue[10]].Points.AddY(boxplot_helper(i, Dataslots[10]));
        Chart.chart_main.Series[xValue[11]].Points.AddY(boxplot_helper(i, Dataslots[11]));
        Chart.chart_main.Series[xValue[12]].Points.AddY(boxplot_helper(i, Dataslots[12]));
        Chart.chart_main.Series[xValue[13]].Points.AddY(boxplot_helper(i, Dataslots[13]));
        Chart.chart_main.Series[xValue[14]].Points.AddY(boxplot_helper(i, Dataslots[14]));
        Chart.chart_main.Series[xValue[15]].Points.AddY(boxplot_helper(i, Dataslots[15]));
        Chart.chart_main.Series[xValue[16]].Points.AddY(boxplot_helper(i, Dataslots[16]));
        Chart.chart_main.Series[xValue[17]].Points.AddY(boxplot_helper(i, Dataslots[17]));
        Chart.chart_main.Series[xValue[18]].Points.AddY(boxplot_helper(i, Dataslots[18]));
        Chart.chart_main.Series[xValue[19]].Points.AddY(boxplot_helper(i, Dataslots[19]));
        Chart.chart_main.Series[xValue[20]].Points.AddY(boxplot_helper(i, Dataslots[20]));
        Chart.chart_main.Series[xValue[21]].Points.AddY(boxplot_helper(i, Dataslots[21]));     
    }

    Chart.chart_main.Series["BoxPlotSeries"].ChartType = SeriesChartType.BoxPlot;
    Chart.chart_main.Series["BoxPlotSeries"]["BoxPlotSeries"] = xValue[0];

    Chart.chart_main.ChartAreas.Add("BoxPlot");
    Chart.chart_main.Series["BoxPlotSeries"].ChartArea = "BoxPlot";

    Chart.chart_main.Series["BoxPlotSeries"]["BoxPlotWhiskerPercentile"] = "0";
    Chart.chart_main.Series["BoxPlotSeries"]["BoxPlotPercentile"] = "25";
    Chart.chart_main.Series["BoxPlotSeries"]["BoxPlotShowAverage"] = "true";
    Chart.chart_main.Series["BoxPlotSeries"]["BoxPlotShowMedian"] = "true";
    Chart.chart_main.Series["BoxPlotSeries"]["BoxPlotShowUnusualValues"] = "true";
    Chart.chart_main.Series["BoxPlotSeries"]["MaxPixelPointWidth"] = "15";
    Chart.chart_main.Series["BoxPlotSeries"].BorderWidth = 2;
    Chart.Show();

}

private Double boxplot_helper(Int32 i, Int32 slot)
{
    String Santas = Data[i, slot].Replace('.', ',').TrimEnd('%').Trim();
    Double LittleHelper = Convert.ToDouble(Santas);
    return LittleHelper;

感谢有人能帮助我，谢谢！

Answer 1

这是一个ASP.NET示例：

    <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>

您可以在此处查找详细信息：MSDN - Box Plot Chart

修改您可以动态绑定这样的数据：

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; } }

每当您向集合中添加/删除数据时，都需要调用DataBind()。

编辑2 ：您可以相应修改XValue和string，使MyData成为MyDataCollection：

编辑3 ：使用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); } }

Answer 2

我认为第3个示例中有一个错误，编辑3使用DataTable。错误是按对象数组中插入的统计值的顺序。

我认为以下应该是声明，类似于编辑1＆amp;编辑2个示例，而不是正在使用的示例。

Chart1.Series [0] .Points.AddXY（row [＆＃34; Status＆＃34;]，new object [] {row [＆＃34; Min＆＃34;]，row [＆＃34; Max＆＃34;]，行[＆＃34; Percentile25＆＃34;]，行[＆＃34; Percentile75＆＃34;]，行[＆＃34; Avg＆＃34;]，行[＆＃34; Percentile50＆＃34 ]}）;

如何使用ASP.net，C＃或Javascript创建Box Plot Chart

2 个答案: