ASP.NET2.0轻松搞定统计图表【月儿原创】

ASP.NET2.0轻松搞定统计图表

作者：清清月儿

主页：http://blog.csdn.net/21aspnet/           时间：2007.3.27

本文讲述如何绘制条形图，折线图，柱形图，面积图等常见图形。

效果图：

手把手教程：

原理：OWC是Office   Web   Compent的缩写，即Microsoft的Office   Web组件，它为在Web中绘制图形提供了灵活的同时也是最基本的机制。在一个intranet环境中，如果可以假设客户机上存在特定的浏览器和一些功能强大的软件（如IE6和Office   2000/XP/2003），那么就有能力利用Office   Web组件提供一个交互式图形开发环境。这种模式下，客户端工作站将在整个任务中分担很大的比重。理论上说Excel能做的图都可以通过OWC画。

第一步：
右键点击网站根目录引用。如图所示：

第二步：
点击“添加引用”后弹出一个窗口，添加OWC的引用。如图所示：

点“确定”。

第三步：
代码中引用Microsoft.Office.Interop.Owc11。

全部代码
后台代码：
using System;
using System.Data;
using System.Configuration;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;

using System.Data.SqlClient;   //添加数据操作引用
using Microsoft.Office.Interop.Owc11;//添加Office组件引用

public partial class OWCdrawing : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {

        //连接数据库并获取特定字符串
        string strSeriesName = "图例1";
        string ConnectString = "Server=(local);DataBase=web;Uid=sa;Pwd=sa";
        string Sql = "SELECT month,Allcount FROM Chart";
        SqlConnection myConn = new SqlConnection(ConnectString);
        myConn.Open();
        SqlDataAdapter Da = new SqlDataAdapter(Sql, myConn);
        DataSet ds = new DataSet();
        Da.Fill(ds);

        //存放月
        string[] MonNum = new string[12];
        //存放数据
        string[] MonCount = new string[12];
        //为数组赋值
        for (int i = 0; i < ds.Tables[0].Rows.Count; i++)
        {
            MonNum[i] = ds.Tables[0].Rows[i][0].ToString();
            MonCount[i] = ds.Tables[0].Rows[i][1].ToString();
        }
        //为x轴指定特定字符串，以便显示数据
        string strXdata = String.Empty;
        foreach (string strData in MonNum)
        {
            strXdata += strData + "/t";
        }
        string strYdata = String.Empty;
        //为y轴指定特定的字符串，以便与x轴相对应
        foreach (string strValue in MonCount)
        {
            strYdata += strValue + "/t";
        }

        //创建ChartSpace对象来放置图表
        ChartSpace laySpace = new ChartSpaceClass();

        //在ChartSpace对象中添加图表
        ChChart InsertChart = laySpace.Charts.Add(0);

        //指定绘制图表的类型。类型可以通过OWC.ChartChartTypeEnum枚举值得到
        //InsertChart.Type = ChartChartTypeEnum.chChartTypeLine;//折线图
        //InsertChart.Type = ChartChartTypeEnum.chChartTypeArea;//面积图
        //InsertChart.Type = ChartChartTypeEnum.chChartTypeBarClustered;//条形图
        InsertChart.Type = ChartChartTypeEnum.chChartTypeColumnClustered;//柱形图

 

        //指定图表是否需要图例标注
        InsertChart.HasLegend = false;

       
        InsertChart.HasTitle = true;//为图表添加标题
        InsertChart.Title.Caption = "2006年清清月儿每个月花销流水账";//标题名称

        //为x,y轴添加图示说明
        InsertChart.Axes[0].HasTitle = true;
        InsertChart.Axes[0].Title.Caption = "";//月份
        InsertChart.Axes[1].HasTitle = true;
        InsertChart.Axes[1].Scaling.SplitMinimum = 200;
        InsertChart.Axes[1].Title.Caption = "数量";

        //添加一个series系列
        InsertChart.SeriesCollection.Add(0);

        //给定series系列的名字
        InsertChart.SeriesCollection[0].SetData(ChartDimensionsEnum.chDimSeriesNames, +(int)ChartSpecialDataSourcesEnum.chDataLiteral, strSeriesName);

        //给定分类
        InsertChart.SeriesCollection[0].SetData(ChartDimensionsEnum.chDimCategories, +(int)ChartSpecialDataSourcesEnum.chDataLiteral, strXdata);

        //给定值
        InsertChart.SeriesCollection[0].SetData(ChartDimensionsEnum.chDimValues, (int)ChartSpecialDataSourcesEnum.chDataLiteral, strYdata);
        //输出文件.
        string strAbsolutePath = (Server.MapPath(".")) + "//ShowData.gif";
        laySpace.ExportPicture(strAbsolutePath, "GIF", 400, 250);

        //创建GIF文件的相对路径.
        string strRelativePath = "./ShowData.gif";

        //把图片添加到placeholder中，并在页面上显示
        string strImageTag = "<IMG SRC='" + strRelativePath + "'/>";
        this.PlaceHolder1.Controls.Add(new LiteralControl(strImageTag));
    }
}

前台代码：
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="OWCdrawing.aspx.cs" Inherits="OWCdrawing" %>

<!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>清清月儿http://blog.csdn.net/21aspnet</title>
</head>
<body>
    <form id="form1" runat="server">
   <div style="text-align: left">
        <table style="width: 600px">
            <tr>
                <td colspan="3" style="height: 20px">
                    <strong>怎么样在ASP.NET2.0中使用OWC组件画图</strong></td>
            </tr>
            <tr>
                <td colspan="3" rowspan="2" style="height: 21px">
        <asp:PlaceHolder ID="PlaceHolder1" runat="server"></asp:PlaceHolder>
                </td>
            </tr>
            <tr>
            </tr>
        </table>
   
    </div>
    </form>
</body>
</html>

数据库SQL脚本：
USE [web]
GO
/****** 对象:  Table [dbo].[Chart]    脚本日期: 03/27/2007 22:26:00 ******/
SET ANSI_NULLS ON
GO
SET QUOTED_IDENTIFIER ON
GO
CREATE TABLE [dbo].[Chart](
 [id] [int] IDENTITY(1,1) NOT NULL,
 [month] [smallint] NULL,
 [Allcount] [int] NULL
) ON [PRIMARY]

在数据库建好表以后要自己手动假想有12条数据，手动添加，最终结果类似下图：

后台程序说明：
最关键就是InsertChart.Type = ChartChartTypeEnum.chChartTypeColumnClustered;

你可以在ChartChartTypeEnum后点出其他方法。如图所示：

下面列出的是其他类型图：

折线图：

 

面积图：

条形图：

OWC什么图形都可以画，还能画立体的，请大家自己尝试。

可以参考OWC手册，具体位置：
C:/Program Files/Common Files/Microsoft Shared/Web Components/11/2052/OWCVBA11.CHM

Trackback: http://tb.blog.csdn.net/TrackBack.aspx?PostId=1543320

[收藏到我的网摘]   清清月儿发表于 2007年03月27日 22:16:00

特别推荐：

• 东方标准
  100万国家"栋梁工程"基金助学已启动！ 国际软件工程师就业班 4月开课安排 asp
• 用友软件急聘.NET开发工程师
  用友软件一直秉持“人才为重”的理念 我们盛情邀您加入…… asp
• 《ASP.NET 2.0入门经典》连载中
  初学者学习ASP.NET的优秀教程 CSDN读书频道独家奉献 asp
• 阿里巴巴急聘Java高级程序员
  阿里巴巴是一家由中国人创办的国际化的互联网公司， 高薪邀请英才 :) asp
• 《ASP.NET Ajax快速开发》连载
  .net平台下ajax解决方案 CSDN读书频道独家奉献 asp

 

#  showrock 发表于2007-03-28 11:25:39  IP: 59.108.6.*

强!

#  cisky 发表于2007-03-28 11:28:26  IP: 218.17.214.*

不错，收藏！

#  gkq8124372 发表于2007-03-28 11:49:47  IP: 125.92.218.*

Good

#  chentianfen 发表于2007-03-28 12:44:18  IP: 203.95.106.*

安全性会出现问题

#  weblogic2009 发表于2007-03-28 13:35:13  IP: 58.31.73.*

不好集成!! ( 水晶报表杀手 -- e表, 它避免了大量的复杂SQL编写以及编程来准备数据。轻松实现复杂的统计报表，详见： http://my5155.meibu.com )

#  DVD_01 发表于2007-03-28 13:44:37  IP: 121.201.27.*

good
学习了

#  菜鸟 发表于2007-03-28 14:35:13  IP: 220.234.107.*

不好集成!! ( 水晶报表杀手 -- e表, 它避免了大量的复杂SQL编写以及编程来准备数据。轻松实现复杂的统计报表，详见： http://my5155.meibu.com )
===============
大量的复杂SQL编写以及编程来准备数据 我用Reporting Services谁用你的什么易表，这个OWC方案是免费的知不知道！！！！！！！！！！！！！！！

Reporting Services是SQLserver2005集成的 功能比e表强1000000000000000000000000倍

#  wangwan 发表于2007-03-28 16:41:43  IP: 219.140.154.*

VS2005可以直接用其提供的REPORTVIEW控件，谁用你的破水晶，烂易表啊

#  ok999ok 发表于2007-03-28 20:57:51  IP: 220.187.35.*

你的CLIENT都是OFFICE吗？幼稚！！！

#  dzj 发表于2007-03-29 09:35:51  IP: 211.157.25.*

徒言

#  querywhy 发表于2007-03-29 11:24:20  IP: 218.14.54.*

good!

#  #XFlame 发表于2007-03-29 13:46:08  IP: 124.117.70.*

用开源的ZedGraph吧,OWC配置很麻烦的,不好控制

#  kkk 发表于2007-03-29 21:29:48  IP: 58.38.96.*

好啊

#  marchonchina 发表于2007-03-30 08:55:52  IP: 220.170.23.*

很有价值

#  shuihan20e 发表于2007-03-30 09:34:38  IP: 59.80.91.*

我怎么没有那个组件啊

#  假正经哥哥 发表于2007-03-30 10:39:50  IP: 222.66.70.*

owc可以做到的效果，^_^
http://www.cnblogs.com/xuanye/archive/2007/03/11/671182.html

#  菜鸟 发表于2007-03-30 11:48:30  IP: 220.234.107.*

# shuihan20e 发表于2007-03-30 09:34:38 IP: 59.80.91.*
我怎么没有那个组件啊
=================
你要装office2003