在 Asp.Net 中使用数据表的 Highcharts答案

【问题标题】：Highcharts using Datatable in Asp.Net在 Asp.Net 中使用数据表的 Highcharts
【发布时间】：2013-10-09 03:03:35
【问题描述】：

实际上，我使用PieChart 或HighCharts 来显示我的数据。
数据正在绑定，但 Tooltips 显示不正确。
当我将相同的数据绑定到LineChart时，它显示完美。但是当谈到PieChart时，这个问题就来了。甚至数据也显示为Slices，如下所示：

我的代码是这样的：

<highchart:PieChart ID="chart1" Width="500" Height="500" runat="server" />

SqlDataAdapter da = new SqlDataAdapter("select * from SURVEY_ORG where USERS<>0", con);
            DataSet ds = new DataSet();
            da.Fill(ds);
            chart1.PlotOptions = new Highchart.Core.PlotOptions.PlotOptionsPie
            {
                allowPointSelect = true,
                cursor = "pointer",
                dataLabels = new Highchart.Core.PlotOptions.DataLabels { enabled = true }
            };
            PointCollection pc = new PointCollection();
            for (int i = 0; i < ds.Tables[0].Rows.Count; i++)
            {
                pc.Add(new Point(ds.Tables[0].Rows[i]["ORG_NAME"], Convert.ToInt64(ds.Tables[0].Rows[i]["USERS"])));
            }            
            var series = new Collection<Serie>();
            series.Add(new Serie() { data = pc.ToArray() });
            chart1.PlotOptions = new Highchart.Core.PlotOptions.PlotOptionsPie
            {
                allowPointSelect = true,
                cursor = "Pointer",
                showInLegend = true,
                dataLabels = new Highchart.Core.PlotOptions.DataLabels
                {
                    enabled = true
                }
            };
            chart1.Tooltip = new ToolTip { formatter = "function() { return '<b>'+ this.point.name +'</b>: '+ this.percentage.toFixed(2) +' %'; }" };
            chart1.Title = new Highchart.Core.Title("Custom Title");
            chart1.PlotOptions.shadow = false;
            chart1.DataSource = series;
            chart1.DataBind()

我想在Legends 和slice 的位置显示“ORG_NAME”

【问题讨论】：

标签： c# jquery .net jquery-ui highcharts

【解决方案1】：

我得到了答案。
PieChart 的绑定方式有点不同。

SqlDataAdapter da = new SqlDataAdapter("select ORG_NAME,USERS from SURVEY_ORG where USERS<>0", con);
            da.Fill(dataSet);
            Int32 totalArraySize = dataSet.Tables[0].Rows.Count;
            Object[] XAxisData = new object[totalArraySize];
            Object[] YAxisServices = new object[totalArraySize];
            int J = 0;
            foreach (DataRow drRow in dataSet.Tables[0].Rows)
            {
                YAxisServices[J] = new object[] { drRow[0].ToString(), Convert.ToInt32(drRow[1].ToString()) };
                J += 1;
            }
            Highchart.Core.SerieCollection series = new Highchart.Core.SerieCollection();
            Highchart.Core.Data.Chart.Serie serieServices = new Highchart.Core.Data.Chart.Serie();
            serieServices.size = 130;
            serieServices.data = YAxisServices;
            serieServices.type = RenderType.pie;
            serieServices.name = "";
            serieServices.showInLegend = false;
            series.Add(serieServices);

            chart1.PlotOptions = new Highchart.Core.PlotOptions.PlotOptionsPie
            {
                allowPointSelect = true,
                cursor = "pointer",
                dataLabels = new Highchart.Core.PlotOptions.DataLabels { enabled = true, formatter = "this.point.name" },
                animation = false
            };
            chart1.Tooltip = new ToolTip("this.point.name +': '+ this.y");
            chart1.DataSource = series;
            chart1.DataBind();
            chart1.Dispose();

【讨论】：

【解决方案2】：

试试吧..

Legend legend = new Legend();    
legend.Layout = Layouts.Vertical;
legend.Align = HorizontalAligns.Left;
legend.VerticalAlign = VerticalAligns.Top;
legend.X = 100;
legend.Y = 70;
legend.Floating = true;
legend.BackgroundColor = ColorTranslator.FromHtml("#FFFFFF");
legend.Shadow = true;
chart1.Legend.enabled = true;
chart1.Legend = legend;

【讨论】：