网上很多的chart控件的实例都没有绑定数据库,经过一番摸索后,终于实现了chart控件绑定数据库。
首先,在Visual Studio中建立一个网站,新建一个WebForm项目,名称为ChartTest1.aspx
前台:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="ChartTest1.aspx.cs" Inherits="ChartTest1" %> <%@ Register Assembly="System.Web.DataVisualization, Version=4.0.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" Namespace="System.Web.UI.DataVisualization.Charting" TagPrefix="asp" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title></title> </head> <body> <form id="form1" runat="server"> <div> <asp:Chart ID="Chart1" runat="server"> <Titles> <asp:Title Font="微软雅黑, 16pt" Name="Title1" Text="****统计表"> </asp:Title> </Titles> <borderskin skinstyle="Emboss"></borderskin> <Series> <asp:Series Name="Series1" ChartType="Bubble" MarkerSize="8" MarkerStyle="Circle"> </asp:Series> </Series> <ChartAreas> <asp:ChartArea Name="ChartArea1" BorderColor="64, 64, 64, 64" BackSecondaryColor="Transparent" BackColor="64, 165, 191, 228" ShadowColor="Transparent" BackGradientStyle="TopBottom"> </asp:ChartArea> </ChartAreas> </asp:Chart> <asp:Button ID="Button1" runat="server" onclick="Button1_Click" Text="Button" /> </div> </form> </body> </html>
后台代码:
using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.UI; using System.Web.UI.WebControls; using System.Data; using System.Drawing; using System.Data.SqlClient; using System.Configuration; using System.Data.OleDb; public partial class ChartTest1 : System.Web.UI.Page { public static string conn = "Data Source=(local);Integrated Security=True;Initial Catalog=HESDK1"; protected void Page_Load(object sender, EventArgs e) { } //创建一张二维数据表 /// <summary> /// 创建一张二维数据表 /// </summary> /// <returns>Datatable类型的数据表</returns> DataTable CreatData() { DataTable dt = new DataTable(); //实例化SqlConnection对象 SqlConnection sqlCon = new SqlConnection(); //实例化SqlConnection对象连接数据库的字符串 sqlCon.ConnectionString = conn; //定义SQL语句 //sql公用部分 string sqlQ = "select TO_c,Plc_c from History "; // DataTable tb = ADO.GetDataTable(sqlQ); dt = GetDataTable(sqlQ); return dt; } //数据库查询返回datatable public static DataTable GetDataTable(string Sqlstr) { DataTable dt; SqlDataAdapter sda; SqlConnection sqlCon = new SqlConnection(); //实例化SqlConnection对象连接数据库的字符串 sqlCon.ConnectionString = conn; sqlCon.Open(); sda = new SqlDataAdapter(Sqlstr, conn); //sda.SelectCommand.CommandTimeout = 120; dt = new DataTable(); sda.Fill(dt); sqlCon.Close(); return dt; } protected void Button1_Click(object sender, EventArgs e) { SqlConnection connection = new SqlConnection(conn); // 折线图 DataTable dt = CreatData(); // #region 折线图 Chart1.DataSource = dt;//绑定数据 Chart1.Series["Series1"].ChartType = System.Web.UI.DataVisualization.Charting.SeriesChartType.Line;//设置图表类型 Chart1.Series[0].XValueMember = "TO_c";//X轴数据成员列 Chart1.Series[0].YValueMembers = "Plc_c";//Y轴数据成员列 Chart1.ChartAreas["ChartArea1"].AxisX.Title = "温度";//X轴标题 Chart1.ChartAreas["ChartArea1"].AxisX.TitleAlignment = StringAlignment.Far;//设置Y轴标题的名称所在位置位远 Chart1.ChartAreas["ChartArea1"].AxisY.Title = "压力";//Y轴标题 Chart1.ChartAreas["ChartArea1"].AxisY.TitleAlignment = StringAlignment.Far;//设置Y轴标题的名称所在位置位远 Chart1.ChartAreas["ChartArea1"].AxisX.Interval = 1;//X轴数据的间距 Chart1.ChartAreas["ChartArea1"].AxisX.MajorGrid.Enabled = false;//不显示竖着的分割线 Chart1.Series[0].IsValueShownAsLabel = true;//显示坐标值 // #endregion /* Chart1.Series["Series1"].ChartType = System.Web.UI.DataVisualization.Charting.SeriesChartType.Line;//设置图表类型 string mySelectQuery = "SELECT TO_c,Plc_c FROM History;"; SqlConnection connection = new SqlConnection(conn); SqlCommand myCommand = new SqlCommand(mySelectQuery, connection); myCommand.Connection.Open(); SqlDataReader myReader = myCommand.ExecuteReader(CommandBehavior.CloseConnection); Chart1.DataBindTable(myReader, "TO_c"); myReader.Close(); myCommand.Connection.Close(); * */ } }