ASP.NET中的chart控件绑定SQL Server数据库

网上很多的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" οnclick="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();
           * */
       }
}

 

转载于:https://www.cnblogs.com/doudiwen/p/6229518.html

  • 0
    点赞
  • 0
    评论
  • 9
    收藏
  • 一键三连
    一键三连
  • 扫一扫,分享海报

表情包
插入表情
评论将由博主筛选后显示,对所有人可见 | 还能输入1000个字符
©️2021 CSDN 皮肤主题: 大白 设计师:CSDN官方博客 返回首页
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、C币套餐、付费专栏及课程。

余额充值