第21章 在线投票统计系统
本章视频教学录像：16分钟
信息时代，了解用户的需求信息是商业活动必不可少的措施之一。我们经常见到各大网站举行一些投票活动来了解用户信息。本章介绍如何使用OWC11绘图控件来编写在线投票统计系统。
本章要点（已掌握的在方框中打钩）
□ 了解投票统计原理
□ 安装并使用 OWC11 绘图控件
□ 创建数据库和数据表
□ 设计系统前台页面
□ 设计投票统计代码
□ 将在线投票统计系统添加至已有网站中
21.1 系统分析
本节视频教学录像：2分钟
信息统计调查是当今社会必不可少的手段，很多网站为了了解用户的需求都会做一些调查统计。那么如何得到统计的信息并显示给用户参考呢？在线投票系统很好地解决了这个问题。
本章使用ASP.NET和SQL Server 2008来创建一个在线投票统计系统。
21.1.1 系统目标
本系统需要实现的目标有以下3点。
⑴完成对调查信息的统计。
⑵根据统计信息绘制统计图。
⑶在页面上显示统计图。
21.1.2 系统原理
当用户通过网络访问该网站时，可以显示该投票信息。用户如果参与投票调查，选择相应的信息并提交结果，该投票结果将保存到数据库中，并提示用户操作结果信息。用户可以选择查看投票信息了解调查结果，该结果会以图形的方式直观地显示给用户。
21.1.3 技术要点
提示
如何将投票信息制作成图表？
该系统使用Office组件OWC11来完成图形的绘制。OWC11提供了一系列的图形绘制功能，使用该组件可以很方便地绘制出柱状图、饼状图、折线图等一系列的图形。本示例使用柱状图显示结果，其余的图形读者可自行参考相关文档实现。
由于我们使用了外部组件来完成绘图功能，所以在程序中首先要引用OWC11.DLL，读者可从微软网站上下载Office组件安装程序或者使用光盘中提供的owc11.exe安装文件。安装完毕，可以在“C:\Program Files (x86)\Common Files\microsoft shared\Web Components\11”目录中找到 OWC11. DLL，如图所示。
具体引用步骤如下。
⑴在ASP.NET项目名称上右击，在弹出的快捷菜单中选择【添加引用】菜单项。
⑵在弹出的【添加引用】对话框中选择【浏览】选项卡，选择指定的“OWC11.DLL”文件，然后单击【确定】按钮即可。
引用OWC11.DLL文件后，通过使用“Microsoft.Office.Interop.Owc11”命名空间，就可以使用该组件来完成绘图功能，具体代码将在21.3.8小节中完成。
21.2 数据库分析及设计
本节视频教学录像：2分钟
根据分析，本系统需要用到数据库来存储以及统计所记录的数据，所以在系统开发之前，首先要进行数据库的设计。
21.2.1 数据库分析
在在线投票统计系统中，需要统计访问用户的选择信息。为了更好地统计和管理这些数据，我们选择SQL Server 2008数据库来满足系统的需求。在数据库中需要有一张数据表来存储投票的内容和投票的统计信息数据，所以这个数据表中需要包含编号、投票内容以及票数等字段。
21.2.2 创建数据库
在SQL Server 2008中创建数据库的具体步骤如下。
⑴选择【开始】
【所有程序】
【SQL Server Management Studio】，以【Windows身份验证】模式登录。
⑵在【对象资源管理器】窗口中的【数据库】节点上右击，在弹出的快捷菜单中选择【新建数据库】菜单项，弹出【新建数据库】对话框。
⑶在【数据库名称】文本框中输入“ch21DataBase”，在【数据库文件】列表框中使用默认设置“ch21DataBase”和“ch21DataBase_log”文件的路径，单击【确定】按钮即可完成ch21DataBase数据库的创建。
21.2.3 创建数据表
本实例中需要一张记录投票内容和投票结果信息的表，下面来创建数据表。
⑴在【对象资源管理器】中展开ch21DataBase节点，右击【表】节点，在弹出的快捷菜单中选择【新建表】菜单项。
⑵在打开的表编辑窗口中，按照下图所示输入。
⑶在【dbo.Table_1*】选项卡上右击，在弹出的快捷菜单中选择【保存】菜单项，弹出【选择名称】对话框，在【输入表名称】文本框中输入“tabVoteResult”，然后单击【确定】按钮，即可完成表的创建。
21.3 系统设计
本节视频教学录像：8分钟
在21.1.1小节中，我们已经分析了在线投票统计系统需要实现的3个目标，所以在系统设计时需要设计3个模块来实现各个目标。
21.3.1 系统页面设计
首先，设计系统的页面，页面中需要有系统的标题、投票调查的内容、投票的提交按钮以及查看结果按钮等内容。如图所示。
⑴在 Visual Studio 2010 中，新建【语言】为【Visual C #】的 ASP.NET 空网站，添加一个Default.aspx页面。
⑵在Default.aspx页面的设计视图中，如图所示设计系统界面。所用控件及属性设置如表所示。
⑶在网站中添加一个名为“VoteResult.aspx”的Web页面，在页面的设计视图中添加1个标准Image控件，用于显示投票结果，将其ID属性设置为“imgVoteResult”。
21.3.2 配置网站的Web.config
数据库和系统页面都设计好了，如何将它们连接起来呢？这就需要通过配置系统的Web.config文件来连接数据库。
在【解决方案资源管理器】中双击Web.config文件，打开Web.config的代码窗口，然后在<connectionStrings>和< /connectionStrings>之间添加以下代码。
<addname="ch21DataBase" connectionString="DataSource=.\sqlexpress;InitialCatalog=ch21Data Base; User ID=sa;Password=123"/>
【代码详解】
此段代码的作用是添加一个数据库的连接字符串“.\sqlexpress”，表示要连接当前本机的数据库，读者也可设定为数据库所在服务器的IP地址。数据库的名称为“ch21DataBase”。
21.3.3 数据库连接代码设计
在系统保存投票信息时要连接数据库，在保存结束时要关闭此连接。所有的相关数据操作使用一个公共数据类来实现。
新建一个类文件，命名为“DataClass.cs”，添加GetSqlServerConn方法，用于获得数据库连接（代码21-1.txt）。
01 private SqlConnection GetSqlServerConn()
02 {
03 SqlConnection sqlConn; //定义SQl Server连接对象
04 string strConn = WebConfigurationManager.ConnectionStrings["ch21DataBase "].ConnectionString; //读取web.config配置文件的ConnectionString节点获取连接字符串
05 sqlConn= new SqlConnection(strConn); //生成数据库连接对象
06 sqlConn.Open(); //打开数据库连接
07 return sqlConn; //返回数据库连接对象以供调用
08 }
继续添加CloseSqlServerConn方法，用于关闭数据库连接（代码21-2.txt）。
01 private void CloseSqlServerConn(SqlConnection sqlConn)
02 {
03 if (sqlConn.State==ConnectionState.Open) //如果数据库连接处于关闭状态，则打开此连接
04 {
05 sqlConn.Close();
06 }
07 }
21.3.4 获取投票内容代码设计
有了数据库连接，我们就可以通过它访问数据信息，得到需要在线投票的内容信息，用户可以根据此内容做出自己的选择。在公共类中继续添加GetVoteContent方法获取投票的内容（代码21-3.txt）。
01 public DataTable GetVoteContent()
02 {
03 SqlConnection sqlConn; //SQLServer连接对象
04 SqlDataAdapter sqlAdpt; //SQL适配器对象
05 DataTable dtVoteResult; //数据表保存投票内容数据
06 string strComm = "select VoteId,VoteContent from tabVoteResult"; //SQL 语 句， 从tabVoteResult表中读取数据
07 try
08 {
09 sqlConn=GetSqlServerConn(); //获得SQLServer连接对象
10 sqlAdpt= new SqlDataAdapter(strComm, sqlConn); //指定适配器对象要执行的SQL语句和连接的数据库
11 dtVoteResult= new DataTable();
12 sqlAdpt.Fill(dtVoteResult); //将读取到的数据存放到数据表对象中
13 return dtVoteResult;
14 }
15 catch (Exception ex)
16 {
17 throw ex;
18 }
19 }
21.3.5 显示投票内容代码设计
通过数据库获取到投票信息之后，还需要在页面上显示该信息，用户才能根据看到的内容作出选择。在Default.aspx.cs中添加Page_Load事件方法显示投票内容（代码21-4.txt）。
01 protected void Page_Load(object sender,EventArgs e)
02 {
03 if (!IsPostBack)
04 {
05 try
06 {
07 DataClass dc= new DataClass();
08 DataTable dt=dc.GetVoteContent(); //调用公共类方法获取投票内容信息
09 this.lisRbtnVoteContent.DataSource=dt; //指定RadioButtonList控件的数据源
10 this.lisRbtnVoteContent.DataValueField= "VoteId"; //将投票编号绑定到控件的Value属性
11 this.lisRbtnVoteContent.DataTextField= "VoteContent"; //将投票内容绑定到控件的Text属性
12 this.lisRbtnVoteContent.DataBind(); //执行数据绑定
13 this.lisRbtnVoteContent.SelectedIndex= 0; //设置第1条数据被选定
14 }
15 catch (Exception ex)
21 {
17 Response.Write(ex.Message);
18 }
19 }
20 }
21.3.6 保存投票信息代码设计
用户在登录网站后进入投票页面，选择对应的信息后单击投票按钮即可保存此次的投票结果。在公共类中继续添加SaveVoteResult方法将用户选择的信息保存到数据库中（代码21-5.txt）。
01 public bool SaveVoteResult(int voteId)
02 {
03 SqlConnection sqlConn;
04 SqlCommand sqlComm; //SQL命令对象
05 string strComm= "update tabVoteResult set VoteCount=VoteCount+ 1 where VoteId=@VoteId"; //指定带参数的更新语句
06 sqlConn=GetSqlServerConn();
07 try
08 {
09 sqlComm= new SqlCommand(strComm, sqlConn); //指定SQL命令对象要执行的SQL语句和连接的数据库
10 sqlComm.Parameters.AddWithValue("@VoteId", voteId); //为对应的参数赋值
11 sqlComm.ExecuteNonQuery(); //执行对应的SQL语句
12 return true;
13 }
14 catch (Exception ex)
15 {
21 CloseSqlServerConn(sqlConn); //调用关闭数据库连接方法
17 return false;
18 }
19 }
21.3.7 在线投票统计结果代码设计
用户投票之后，所有的统计结果均被保存在数据库中，通过访问数据库的对应信息，就可以得到想要的统计结果。可在公共类中添加GetVoteResult方法获得投票结果（代码21-6.txt）。
01 public DataTable GetVoteResult()
02 {
03 SqlConnection sqlConn;
04 SqlDataAdapter sqlAdpt;
05 DataTable dtVoteResult;
06 string strComm= "selectVoteId,VoteContent,VoteCount from tabVoteResult";
07 try
08 {
09 sqlConn=GetSqlServerConn();
10 sqlAdpt= new SqlDataAdapter(strComm, sqlConn);
11 dtVoteResult= new DataTable();
12 sqlAdpt.Fill(dtVoteResult);
13 return dtVoteResult;
14 }
15 catch (Exception ex)
21 {
17 throw ex;
18 }
19 }
21.3.8 在线投票结果图形代码设计
如果系统只是在后台进行统计，而不显示结果，用户也不知道哪项内容最受欢迎，所以最后一步是将统计的结果显示出来。本系统将最后统计的信息以柱状图的方式显示。
新建一个VoteImageClass.cs类，添加ChartTypeColumn方法绘制柱形图显示投票统计结果（代码21-7.txt）。
01 public void ChartTypeColumn(DataTable dtVoteResult)
02 {
03 ChartSpace chartSpaceColumn= new ChartSpace(); //创建一个图表空间，用于显示图表内容
04 ChChart objChart= chartSpaceColumn.Charts.Add(0); //在图表空间内添加一个图表对象
05 objChart.Type=ChartChartTypeEnum.chChartTypeColumnClustered; //设置图表类型为柱状图
06 objChart.HasLegend= true; //设置图表是否显示图例
07 objChart.HasTitle= true; //设置图表是否显示主题
08 objChart.Title.Caption= "网络投票结果 "; //设置图表显示标题内容
09 objChart.Title.Font.Color= "Red"; //设置图表显示标题颜色
10 objChart.Axes[0].HasTitle= true; //设置 x坐标内容
11 objChart.Axes[0].Title.Caption= "选项 ";
12 objChart.Axes[1].HasTitle= true; //设置Y坐标内容
13 objChart.Axes[1].Title.Caption= "票数 ";
14 for (int i= 0; i<dtVoteResult.Rows.Count; i++) //根据统计内容添加图表中的柱状图个数
15 {
21 objChart.SeriesCollection.Add(0);
17 }
18 for (int i= 0; i<dtVoteResult.Rows.Count; i++) //设置图表对象的属性
19 {
20 objChart.SeriesCollection[i].Caption=dtVoteResult.Rows[i]["VoteContent"].ToString(); //设置图表对象标题
21 objChart.SeriesCollection[i].SetData(ChartDimensionsEnum.chDimCategories, (int)ChartSpecialDataSourcesEnum.chDataLiteral,dtVoteResult.Rows[i]["VoteContent"].ToString()); //设置图表对象X坐标的值属性
22 objChart.SeriesCollection[i].SetData(ChartDimensionsEnum.chDimValues, (int)ChartSpecialDataSourcesEnum.chDataLiteral, int.Parse(dtVoteResult.Rows[i]["VoteCount"].ToString())); //设置图表对象 y坐标的值属性
23 }
24 chartSpaceColumn.ExportPicture(System.Web.HttpContext.Current.Server.MapPath(" ～/VoteResultImage")+ "/imgVote.jpg", "jpg", 500, 450); //生成图片
25 }
21.3.9 在线投票结果显示代码设计
生成柱状图后我们需要把图形结果显示给用户，所以还需要一个页面来显示该结果。新建一个Web页面VoteResult.aspx，从工具箱添加一个标准Image控件，设置ID属性为imgVoteResult。
<asp:Image ID="imgVoteResult" runat="server"/>
在VoteResult.aspx页面空白处双击，添加Page_Load事件方法，输入以下代码（代码21-8.txt）。
01 protected void Page_Load(object sender,EventArgs e)
02 {
03 DataClass dc= new DataClass();
04 VoteImageClass vic= new VoteImageClass();
05 vic.ChartTypeColumn(dc.GetVoteResult()); //调用方法生成投票统计图例
06 imgVoteResult.ImageUrl=Server.MapPath("～/VoteResultImage")+ "/imgVote.jpg"; //图例将用指定的 Image控件显示
07 }
21.4 运行系统
本节视频教学录像：2分钟
系统设计好了，下面来看系统运行的效果。
⑴按快捷键【F5】或【Ctrl+F5】，在浏览器中运行该程序，页面中将显示要投票统计的内容、投票按钮和查看结果按钮。
⑵用户选择相应的投票内容并提交结果时，系统将保存该结果并显示提示信息。
⑶用户选择查看结果时，系统将以图形（柱形图）的方式显示投票统计结果。
21.5 在我的网站中应用本系统
本节视频教学录像：1分钟
将Default.aspx页面中相关的代码拷贝至一个已存在页面作为部分代码，或者将该页面改名后作为一个链接添加至已有的页面中即可。其余相关代码文件无需改动，拷贝至已有网站对应的位置就可以运行。对数据库表，也应该根据具体情况修改，这里不再赘述。
21.6 开发过程中的常见问题及解决方式
本节视频教学录像：1分钟
开发过程中应该注意以下3点。
⑴关于OWC11控件的使用。需要下载OWC11组件安装程序，在项目中应该引用OWC11.DLL文件，只有引用该文件，才能在项目中使用该组件进行图形的绘制。
⑵关于Server.MapPath()的使用。我们在使用Server.MapPath()方法获取网站运行路径的时候，通常是在Web页面的代码中使用，在类中需要导入System.Web命名空间，然后使用HttpContext. Current.Server.MapPath()方法获取路径信息。
⑶在设计数据库的时候，投票统计的结果字段VoteCount应该设置默认值为0，即没有输入数据的时候该值自动保存为0，这样在保存投票结果的时候直接更新该字段的值即可。