使用后面的代码（.cs文件）中的asp.net高清图将sql server datatable数据显示为图表形式 [英] show sql server datatable data into chart form using asp.net highchart from code behind (.cs file )

问题描述

我有一个数据表进入sql server数据库，我想用代码隐藏文件后面的asp.net高图显示该表的数据。如何将sql server数据表的数据显示为图表形式。

解决方案

看看下面的文章：



使用jquery ajax在asp.net中的Highcharts [ ^ ]。



它提供了如何使用ASP.NET显示SQL Server数据的详细说明在High Charts。



...希望它有所帮助。

 static string conString = ConfigurationManager。的ConnectionStrings [ 连接]的ConnectionString。 
 protected void Page_Load（object sender，EventArgs e）
 {
 if（！IsPostBack）
 {
 List< PieSeriesData> PieDataList = new List< PieSeriesData>（）; 
 DataTable dt = piedatatable; 
 
 if（dt！= null&& dt.Rows.Count> 0）
 {
 foreach（DataRow dr in dt.Rows）
 { 
 Double count = Convert.ToDouble（dr [CountColumn]）; 
 String Name = Convert.ToString（dr [NameColumn]）; 
 PieDataList.Add（new PieSeriesData {Name = Name，Y = count}）; 
} 
 
 
 Highcharts higcharts = new Highcharts 
 {
 Chart = new Chart 
 {
 Type = ChartType.Pie， 
高度= 350，
 Options3d = new ChartOptions3d 
 {
 Enabled = true，
 Alpha = 25，
 Beta = 0 
} 
}，
 
 
 Credits = {Enabled = false}，
 PlotOptions = new PlotOptions 
 {
 Pie = new PlotOptionsPie 
 {
 AllowPointSelect = true，
 SlicedOffset = 20，
 Cursor = PlotOptionsPieCursor.Pointer，
 Depth = 45，
 DataLabels = new PlotOptionsPieDataLabels 
 {
 Enabled = true，
 Format = {point.name} < br /> {point.count}
}，
 ShowInLegend = false 
 
 
} 
 
 } 
 
，
标题=新标题
 {
文字= pietittle，
 X = -20 
}，
图例=新传奇
 {
布局= LegendLayout.Horizo​​ntal，
 Align = LegendAlign.Center，
 
 BorderWidth = 0 
}，
导航= {
 ButtonOptions = 
 {
启用= false 
 } 
}，
系列=新列表<系列> 
 {
 new PieSeries 
 {
 Name = pieseriesname，
 Data = PieDataList as List< PieSeriesData>，
 Size =80％
} 
} 
}; 
 HighsoftNamespace Highsoft = new HighsoftNamespace（）; 
 string result = Highsoft.GetHighcharts（higcharts，chart）。ToHtmlString（）; 
 //Pichartseries.Text = result; 
 Response.Write（result）; 
} 
} 
} 
 public DataTable piedatatable {get;组; } 
 public String pietittle {get;组; } 
 public String pieseriesname {get;组; } 
 public bool showinlegend {get;组; } 
 public String CountColumn {get;组; } 
 public String NameColumn {get;组; } 
} 

这是你如何从asp.net highchart中的代码绑定pichart

 static string conStr = ConfigurationManager.ConnectionStrings [Connections]。ConnectionString; 
静态字符串TokenID = string.Empty; 
 AuthenticateToken oauth = new AuthenticateToken（）; 
 protected void Page_Load（object sender，EventArgs e）
 {
 try 
 {
 if（！IsPostBack）
 {
 Crypto crypto =新的Crypto（）; 
 string requestUrl = Request.Url.ToString（）; 
 string [] token = Regex.Split（requestUrl，tokenId =）; 
 if（！string.IsNullOrEmpty（token [1]））
 {
 TokenID = crypto.DecryptFromString（token [1]）; 
 String SiteCode = GetComaSeperaredSiteCode（new Guid（TokenID））; 
 DataTable dt = new DataTable（）; 
 dt = GetAssetTotal（SiteCode）; 
 GridViewReports.DataSource = dt; 
 GridViewReports.DataBind（）; 
 Pichartcontrol.piedatatable = dt; 
 Pichartcontrol.pieseriesname =MEP Total; 
 Pichartcontrol.pietittle =资产总额; 
 Pichartcontrol.NameColumn =SiteCode; 
 Pichartcontrol.CountColumn =TotalAssetCount; 
} 
} 
} 
 catch 
 {
 Response.Redirect（〜/ Reports / Oops.aspx）; 
} 
} 
 #region获取Coma Seperated站点代码
 protected string GetComaSeperaredSiteCode（Guid TokenID）
 {
 string SiteCodes = string.Empty; 
 try 
 {
 if（oauth.ValidateTokenId（TokenID.ToString（）））
 {
 using（SqlConnection con = new SqlConnection（conStr））
 {
 using（SqlCommand cmd = new SqlCommand（））
 {
 cmd.Connection = con; 
 if（con.State == ConnectionState.Closed）
 {
 con.Open（）; 
} 
 cmd.CommandText =[Intelligios]。[UspGetSiteCodes]; 
 cmd.CommandType = CommandType.StoredProcedure; 
 cmd.Parameters.AddWithValue（@ TokenID，TokenID）; 
 SqlDataAdapter da = new SqlDataAdapter（cmd）; 
 DataTable dt = new DataTable（）; 
 da.Fill（dt）; 
 if（dt.Rows.Count> 0）
 {
 SiteCodes = String.Join（，，dt.AsEnumerable（）。Select（x => x.Field<串GT（ SITECODE）的ToString（））ToArray的（））。。 
} 
} 
} 
} 
其他
 {
 Response.Redirect（〜/ Reports / Invalid.aspx，false） ; 
} 
} 
 catch 
 {
 Response.Redirect（〜/ Reports / Oops.aspx）; 
} 
返回SiteCodes; 
} 
 #endregion 
 #region获取总资产数
 protected DataTable GetAssetTotal（string SiteCodes）
 {
 DataTable dt = new DataTable（）; 
 try 
 {
 if（oauth.ValidateTokenId（TokenID.ToString（）））
 {
 using（SqlConnection con = new SqlConnection（conStr））
 {
 using（SqlCommand cmd = new SqlCommand（））
 {
 cmd.Connection = con; 
 cmd.CommandType = CommandType.StoredProcedure; 
 cmd.CommandText =[Intelligios]。[UspGetAssetTotal]; 
 cmd.Parameters.AddWithValue（@ IsBME，0）; 
 cmd.Parameters.AddWithValue（@ GroupCode，SiteCodes）; 
 SqlDataAdapter da = new SqlDataAdapter（cmd）; 
 da.Fill（dt）; 
} 
} 
} 
其他
 {
 Response.Redirect（〜/ Reports / Invalid.aspx，false）; 
} 
} 
 catch 
 {
 Response.Redirect（〜/ Reports / Oops.aspx）; 
} 
返回dt; 
} 
 #endregion 
} 

您需要使用此代码填充数据表

i have one data table into sql server database and i want to show the data of that table using asp.net high chart from code behind file . how can i show the data of sql server data table into charts form.

解决方案

Hi,

Have a look at the following article:

Highcharts in asp.net using jquery ajax[^].

It provides a detailed explanation of how to use ASP.NET to show SQL Server data in High Charts.

... hope it helps.

static string conString = ConfigurationManager.ConnectionStrings["Connections"].ConnectionString;
        protected void Page_Load(object sender, EventArgs e)
        {
            if (!IsPostBack)
            {
                List<PieSeriesData> PieDataList = new List<PieSeriesData>();
                DataTable dt = piedatatable;

                if (dt != null && dt.Rows.Count > 0)
                {
                    foreach (DataRow dr in dt.Rows)
                    {
                        Double count = Convert.ToDouble(dr[CountColumn]);
                        String Name = Convert.ToString(dr[NameColumn]);
                        PieDataList.Add(new PieSeriesData { Name = Name, Y = count });
                    }


                    Highcharts higcharts = new Highcharts
                    {
                        Chart = new Chart
                        {
                            Type = ChartType.Pie,
                            Height = 350,
                            Options3d = new ChartOptions3d
                            {
                                Enabled = true,
                                Alpha = 25,
                                Beta = 0
                            }
                        },


                        Credits = { Enabled = false },
                        PlotOptions = new PlotOptions
                        {
                            Pie = new PlotOptionsPie
                            {
                                AllowPointSelect = true,
                                SlicedOffset = 20,
                                Cursor = PlotOptionsPieCursor.Pointer,
                                Depth = 45,
                                DataLabels = new PlotOptionsPieDataLabels
                                {
                                    Enabled = true,
                                    Format = "{point.name}<br/>{point.count}"
                                },
                                ShowInLegend = false


                            }

                        }

                        ,
                        Title = new Title
                        {
                            Text = pietittle,
                            X = -20
                        },
                        Legend = new Legend
                        {
                            Layout = LegendLayout.Horizontal,
                            Align = LegendAlign.Center,

                            BorderWidth = 0
                        },
                        Navigation = {
                        ButtonOptions=
                        {
                            Enabled= false
                        }
                    },
                        Series = new List<Series>
                {
                    new PieSeries
                    {
                        Name = pieseriesname,
                        Data = PieDataList as List<PieSeriesData>,
                      Size="80%"
                    }
                }
                    };
                    HighsoftNamespace Highsoft = new HighsoftNamespace();
                    string result = Highsoft.GetHighcharts(higcharts, "chart").ToHtmlString();
                    //Pichartseries.Text = result;
                    Response.Write(result);
                }
            }
        }
        public DataTable piedatatable { get; set; }
        public String pietittle { get; set; }
        public String pieseriesname { get; set; }
        public bool showinlegend { get; set; }
        public String CountColumn { get; set; }
        public String NameColumn { get; set; }
    }

This is how you can bind a pichart from code behind in asp.net highchart

static string conStr = ConfigurationManager.ConnectionStrings["Connections"].ConnectionString;
        static string TokenID = string.Empty;
        AuthenticateToken oauth = new AuthenticateToken();
        protected void Page_Load(object sender, EventArgs e)
        {
            try
            {
                if (!IsPostBack)
                {
                    Crypto crypto = new Crypto();
                    string requestUrl = Request.Url.ToString();
                    string[] token = Regex.Split(requestUrl, "tokenId=");
                    if (!string.IsNullOrEmpty(token[1]))
                    {
                        TokenID = crypto.DecryptFromString(token[1]);
                        String SiteCode = GetComaSeperaredSiteCode(new Guid(TokenID));
                        DataTable dt = new DataTable();
                        dt = GetAssetTotal(SiteCode);
                        GridViewReports.DataSource = dt;
                        GridViewReports.DataBind();
                        Pichartcontrol.piedatatable = dt;
                        Pichartcontrol.pieseriesname = "MEP Total";
                        Pichartcontrol.pietittle = "Asset Total";
                        Pichartcontrol.NameColumn = "SiteCode";
                        Pichartcontrol.CountColumn = "TotalAssetCount";
                    }
                }
            }
            catch
            {
                Response.Redirect("~/Reports/Oops.aspx");
            }
        }
        #region Get Coma Seperated Site Code
        protected string GetComaSeperaredSiteCode(Guid TokenID)
        {
            string SiteCodes = string.Empty;
            try
            {
                if (oauth.ValidateTokenId(TokenID.ToString()))
                {
                    using (SqlConnection con = new SqlConnection(conStr))
                    {
                        using (SqlCommand cmd = new SqlCommand())
                        {
                            cmd.Connection = con;
                            if (con.State == ConnectionState.Closed)
                            {
                                con.Open();
                            }
                            cmd.CommandText = "[Intelligios].[UspGetSiteCodes]";
                            cmd.CommandType = CommandType.StoredProcedure;
                            cmd.Parameters.AddWithValue("@TokenID", TokenID);
                            SqlDataAdapter da = new SqlDataAdapter(cmd);
                            DataTable dt = new DataTable();
                            da.Fill(dt);
                            if (dt.Rows.Count > 0)
                            {
                                SiteCodes = String.Join(",", dt.AsEnumerable().Select(x => x.Field<string>("SiteCode").ToString()).ToArray());
                            }
                        }
                    }
                }
                else
                {
                    Response.Redirect("~/Reports/Invalid.aspx", false);
                }
            }
            catch
            {
                Response.Redirect("~/Reports/Oops.aspx");
            }
            return SiteCodes;
        }
        #endregion
        #region Get Total Asset Count
        protected DataTable GetAssetTotal(string SiteCodes)
        {
            DataTable dt = new DataTable();
            try
            {
                if (oauth.ValidateTokenId(TokenID.ToString()))
                {
                    using (SqlConnection con = new SqlConnection(conStr))
                    {
                        using (SqlCommand cmd = new SqlCommand())
                        {
                            cmd.Connection = con;
                            cmd.CommandType = CommandType.StoredProcedure;
                            cmd.CommandText = "[Intelligios].[UspGetAssetTotal]";
                            cmd.Parameters.AddWithValue("@IsBME", 0);
                            cmd.Parameters.AddWithValue("@GroupCode", SiteCodes);
                            SqlDataAdapter da = new SqlDataAdapter(cmd);
                            da.Fill(dt);
                        }
                    }
                }
                else
                {
                    Response.Redirect("~/Reports/Invalid.aspx", false);
                }
            }
            catch
            {
                Response.Redirect("~/Reports/Oops.aspx");
            }
            return dt;
        }
        #endregion
    }

and you need to populate the datatable using this code

这篇关于使用后面的代码（.cs文件）中的asp.net高清图将sql server datatable数据显示为图表形式的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！