teeChart资料一

设计背景

基于服务器/浏览器架构的解决方案在越来越多的领域得到应用。使用ASP脚本,我们可以方便地访问各种数据库,生成与用户交互的动态页面。一般情况下,由浏览器解释要显示的结果,其中统计数据的显示结果一般采用HTML表格形式。
笔 者在铁路车站Intranet系统的开发过程中,遇到要把数据库中的统计结果用统计图表(柱状图、折线图、饼图等)方式输出的问题。因为统计图表在美观 和易于理解等方面有着表格所不具备的优越性,所以这个问题具有一定的普遍性。目前,针对这个问题,主要有3种可行的解决方案:
1.在浏览器端安装使用图表控件如MsChart等。这样做的缺点是在客户端要安装和注册ActiveX控件,操作较为复杂,并且把客户端系统限制在Windows的范围内。
2.使用Java Applet显示图形。这样做开发难度较高,需要针对具体的应用要求编制Java绘图程序。
3.在服务器端使用控件动态生成图形文件(JPEG格式),此方法可以适用于任何流行的客户端浏览器。
本文讨论第3种方案,使用的控件是TeeChart Pro ActiveX 4.0版。
TeeChart控件
TeeChart Pro ActiveX是西班牙Steema SL公司开发的图表类控件,主要用来生成各种复杂的图表。熟悉Delphi和C++ Builder的编程人员对它不会陌生,因为在Delphi和C++ Builder里包括了TeeChart的VCL版本。本文使用的是TeeChart Pro ActiveX 4.0,它的测试版可以从www.teechart.com网站下载。
TeeChart Pro ActiveX 4.0的主要特性如下:
●是32位ActiveX控件,可以在VB、Delphi、MS Office等多种编程环境下使用;
●可以直接存取ODBC数据源;
●具有11种标准的和9种扩展的Series类型;
●提供16种统计函数;
●支持2D和3D效果,支持缩放和滚动;
●可以将图表输出为Bitmap、Metafile、JPEG 或者Native Chart 格式;
●支持用户绘图和打印;
●是集成化的设计工具;
●提供例子和在线帮助。
TeeChart Pro ActiveX 4.0的这些特性使得它具有极大的灵活性,并且使用起来非常方便,只要写很少的代码,就可以做出各种复杂、漂亮的图表。
TeeChart类的属性和方法
TeeChart的主类是TChart。TChart中使用了56个类、325个属性、125个方法以及28个事件,这使得TChart具有非常强大的功能。本文仅简单地介绍其中一些重要类的属性和方法。
●TChart.Height:图表的高度(像素);
●TChart.Width:图表的宽度(像素);
●TChart.Header:图表的题头(Ititles类);
●TChart.Series:序列(Series类的数组);
●TChart.Axes:坐标轴(Iaxes类);
●TChart.Legend:图例(Legend类);
●TChart.Panel:面板(Ipanel类);
●TChart.Canvas:画布(Canvas类)。
Series是要显示的数据的主体。在一个图表中可以有一个或多个序列,每个序列可以有不同的显示类型,如Line、Bar、Pie等等。
Axes控制图表坐标轴的属性,在缺省的情况下,坐标轴可以自动地根据不同的数据设置好标度范围和间隔,当然也可以手工调整。
Legend控制图表的图例显示。Legend是图表中的一个长方形的用来显示图例标注的区域。可以标注Series的名称或者Series中的项目和数值。
Panel可以设置图表的背景。可以使用渐变的颜色或者图像文件作为整个图表的背景
Canvas可以让设计者绘制自己的图形。使用方法和Delphi中的Canvas一样。有TextOut、LineTo、Arc等各种画图的方法可以调用。
TChart的一些属性实际上是其他类的变量,这些类又具有自己的属性和方法。如Ititles类又具有Text、Color、Font等属性,我们可以用这些属性来设置题头的文本、颜色和字体。
TeeChart和其他的图表控件相比,有一个非常重要的特点是TeeChart可以把图表保存为一个JPEG格式的图形文件。调用格式如下:
TChart.Export.SaveToJPEGFile (FileName,Gray,Performance,Quality,Width,Height)
其 中FileName是JPEG文件的保存路径和文件名,路径应该是操作系统中的绝对路径,而不是IIS中的相对路径,IIS对相应的保存目录应该具有写 权限。Gray指明是否保存为黑白图像。Performance指明JPEG是生成质量优先还是速度优先。Quality是一个0到100的整数,100 时JPEG质量最好,但文件最大;Quality越小则生成的文件越小,但图像质量也随之下降。
为了解决在多用户并发访问Web的情况下,JPEG文件互相覆盖的问题,我们使用了如下所示的一种JPEG文件的命名机制:
OutputJPEGFile =“Chart” & Session.Sessionid &
Replace(Time,“.”,“”) & “.jpg”
在文件名中包括了Sessionid和当前时间,并使用后台进程定期删除过期文件。
应用实例
下面是一个简单的ASP程序,从中可以看到TeeChart在ASP中的使用方法。程序的运行环境为:Windows 2000 Professional、IIS5.0和TeeChart Pro ActiveX 4.0测试版。
 
<HTML>
<HEAD><TITLE>TeeChart JPEG Chart Demo Page</TITLE></HEAD>
<BODY>
<!--引入TeeChart常数 -->
<!--METADATA NAME=“TeeChart Pro 4.0
ActiveX Control” TYPE=“TypeLib”
UUID=“{008BBE7B-C096-11D0-B4E3-00A0C901D681}”-->
<%
<!--建立ActiveX Object -->
Set TChart1 = CreateObject(“TeeChart.TChart”)
<!--设置高度和宽度 -->
TChart1.Height=250
TChart1.Width=500
<!--设置图表题头 -->
TChart1.Header.Text.Clear
TChart1.Header.Text.Add “K180次旅客列车日发送人数统计图”
<!--设置图形背景 -->
TChart1.Panel.Gradient.Visible=True
TChart1.Panel.Gradient.StartColor=RGB(200,255,200)
TChart1.Panel.Gradient.EndColor=#ffffff
<!--添加一个序列 -->
TChart1.AddSeries(scBar)
TChart1.Series(0).Clear
TChart1.Series(0).ColorEachPoint = True
TChart1.Series(0).Add 180, “02/10”,clTeeColor
TChart1.Series(0).Add 240, “02/11”,clTeeColor
TChart1.Series(0).Add 210, “02/12”,clTeeColor
TChart1.Series(0).Add 280, “02/13”,clTeeColor
TChart1.Series(0).Add 218, “02/14”,clTeeColor
TChart1.Series(0).Add 225, “02/15”,clTeeColor
<!--保存为JPEG文件 -->
TChart1.Export.SaveToJPEGFile server.mappath(“/teechart”)+“"MyChart.jpg”,False,JPEGBestQuality, 85,TChart1.Width, TChart1.Height
%>

<img src=“MyChart.jpg”></BODY></HTML>

 

 

 

/web C#语言上/

 

 

为了项目的需要,下面是本人在这段时间学习使用TeeChart控件web曲线绘制
http://php.tech.sina.com.cn/download/d_list.php?f_categoryid=187 下载TeeChart for .NET 3.0控件
或者http://www.steema.com/downloads/download.html 现在TeeChart 控件
如果大家还有其它绘制统计图比较好的控件,可以分享一下
Default.aspx
/// <summary>
    /// 获得数据集
    /// </summary>
    /// <param name="sqlStr">传递查询语句</param>
    /// <returns>返回数据集</returns>
    public static DataSet GetDataSet(string sqlStr)
    {
        string connstring = System.Configuration .ConfigurationSettings.AppSettings["conStr"];
        //string sqlStr = "select * from chart";
        SqlDataAdapter da = new SqlDataAdapter(sqlStr, connstring);
        DataSet ds = new DataSet();
        da.Fill(ds);
        return ds;
    }
/// <summary>
    /// 绘制统计图
    /// </summary>
    /// <param name="SelectStr">Sql查询语句</param>
    private void DrawBar(string SelectStr)
    {
        Chart chart = WebChart1.Chart;
        DataSet DS = new DataSet();
        //显示图片的格式,默认PNG
        WebChart1.PictureFormat = Steema.TeeChart.Export.PictureFormats.Bitmap;
        //设置保存数据形式,默认File,一般选session。Chart.Aspect(外观属性)
        WebChart1.TempChart = Steema.TeeChart.Web.TempChartStyle.Session;
        //获取显示图片文件
        WebChart1.GetChartFile = "GetChart.aspx";
        //整个图表的高度
        WebChart1.Height = 300;
        //整个图表的宽度
        WebChart1.Width = 600;

        //显示图片的格式,默认PNG
        WebChart1.PictureFormat = Steema.TeeChart.Export.PictureFormats.Bitmap;      
        //设置保存数据形式,默认File,一般选session。Chart.Aspect(外观属性)
        WebChart1.TempChart = Steema.TeeChart.Web.TempChartStyle.Session;

        //图表底色开始颜色
        //WebChart1.Chart.Panel.Gradient.StartColor = Color.Blue;//图表底色开始颜色

        //设置图形标题
        WebChart1.Chart.Header.Text = "个人每月开销数目柱形图";
        //设置X轴标题
        WebChart1.Chart.Axes.Bottom.Title.Text = "月份(月)";
        //设置Y1轴标题
        WebChart1.Chart.Axes.Left.Title.Text = "金额(元)";
        WebChart1.Chart.Axes.Left.Labels.ValueFormat = "#M/N";
        //参纵坐标轴是否显示
        WebChart1.Chart.Axes.Bottom.Grid.Visible = false ;
        //横坐标字体倾斜角度0~360
        WebChart1.Chart.Axes.Bottom.Labels.Angle= 30;
        //图表左边距
        WebChart1.Chart.Panel.MarginLeft = 15;
        //图例间是否有间隔线
        WebChart1.Chart.Legend.DividingLines.Visible = true;
        //图形显示比例(好像无反应)
        //WebChart1.Chart .Aspect .Zoom  = 10;

        WebChart1.Dispose();

        //是否立体显示
        WebChart1.Chart.Aspect.View3D = false;

        foreach (Steema.TeeChart.Styles.Series s in chart.Series)

        if (styles == 1)
        {
            //画柱状图
            Steema.TeeChart.Styles.Bar sty1 = new Steema.TeeChart.Styles.Bar(WebChart1.Chart);
            Steema.TeeChart.Styles.Bar sty2 = new Steema.TeeChart.Styles.Bar(WebChart1.Chart);
            chart.Series.Add(sty1);
            chart.Series.Add(sty2);
        }
        if (styles == 2)
        {
            //画折线图
            Steema.TeeChart.Styles.Line sty1 = new Steema.TeeChart.Styles.Line(WebChart1.Chart);
            Steema.TeeChart.Styles.Line sty2 = new Steema.TeeChart.Styles.Line(WebChart1.Chart);
            chart.Series.Add(sty1);
            chart.Series.Add(sty2);
        }
        if (styles == 3)
        {
            Steema.TeeChart.Styles.Kagi sty1 = new Steema.TeeChart.Styles.Kagi(WebChart1.Chart);
            //Steema.TeeChart.Styles.Kagi sty2 = new Steema.TeeChart.Styles.Kagi(WebChart1.Chart);
            chart.Series.Add(sty1);
            //chart.Series.Add(sty2);
        }

        //添加第二个纵坐标
        if (YaxixCount == 2)
        {
            Axis axisY2 = new Axis(false, false, WebChart1.Chart);
            chart.Series[1].CustomVertAxis = axisY2;
            //sty2.CustomVertAxis = axisY2;
            //bar2.CustomVertAxis = axisY2;
            WebChart1.Chart.Axes.Custom.Add(axisY2);
            axisY2.AxisPen.Color = Color.DarkGreen;//坐标轴颜色
            axisY2.Title.Text = "数量";
            axisY2.Title.Font.Color = Color.Blue;  //坐标轴标题颜色
            axisY2.Title.Font.Bold = false;
            axisY2.Title.Angle = 90;//旋转90°
            axisY2.RelativePosition = -20;
        }
        //图形颜色
        //sty1.ColorEach = false;
        //sty2.ColorEach = false;


        //查询语句
        //string SelectStr = "select  month,Allcount,fee from chart";

        DS.Clear();
        try
        {
            DS = GetDataSet(SelectStr);
        }
        catch (Exception e)
        {
            Response.Write(e);
        }

        if (SeriesCount == 1)
        {
            chart.Series[0].DataSource = DS.Tables[0];
            chart.Series[0].LabelMember = DS.Tables [0].Columns[0].ToString();
            chart.Series[0].YValues.DataMember = "Allcount";
        }

        if (SeriesCount == 2)
        {
            //第一种方法:(画曲线)
            //添加一个series系列
            //chart.Series.Add(sty1);
            chart.Series[0].DataSource = DS.Tables[0];
            chart.Series[0].LabelMember = "month";
            chart.Series[0].YValues.DataMember = "Allcount";

            //chart.Series.Add(sty2);
            chart.Series[1].DataSource = DS.Tables[0];
            chart.Series[1].LabelMember = "month";
            chart.Series[1].YValues.DataMember = "fee";
        }
}

protected void Button3_Click(object sender, EventArgs e) //查询
    {
        styles = 2;
        YaxixCount = 2;
        SeriesCount = 2;
        string sqlStr = "select  month,Allcount,fee from chart where month between " + DropDownList1.SelectedItem.Text.ToString() + " and " + DropDownList2.SelectedItem.Text.ToString() + "";
        DrawBar(sqlStr);
    }

创建 GetChart.aspx
protected void Page_Load(object sender, EventArgs e)
    {
        string chartName=Request.QueryString["Chart"];              
        if (Session[chartName]!=null)             
        {                 
            System.IO.MemoryStream chartStream = new System.IO.MemoryStream();             
            chartStream=((System.IO.MemoryStream)Session[chartName]);                 
            Response.OutputStream.Write(chartStream.ToArray(),0,(int)chartStream.Length);                 
            chartStream.Close();                 
            Session.Remove(chartName);             
        } 
    }

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值