分享
 
 
 

ASP.NET实现数据图表

王朝c#·作者佚名  2006-12-17
窄屏简体版  字體: |||超大  

在ASP中插入图表,常用的方法是使用MSChart控件。那么在ASP.NET是否也是这样呢?答案是不可以的。

我们知道ASP.NET是一种编译语言,当客户端第一次调用ASP.NET页面的时候,其实是经过了一种比较复杂的编译过程,编译生产MSIL文件,存储到本地机,MSIL文件其实是一个中间语言的文件,然后此文件又通过JIT(Just in time)编译器进行再编译,生成机器语言,这样你所调用的ASP.NET页面才展现出来,对于不同的机器,有着不同的JIT,也就被编译成不同机器语言,这就是微软公司大力鼓吹ASP.NET的所谓跨平台的原理。

当ASP.NET页面被编译成MSIL文件的时候,编译所使用的类库必须是受管代码文件(Managed Code),而ActiveX控件是已经被编译成机器语言的文件,他属于非受管代码文件(Unmanaged Code)。所以直接在ASP.NET调用MSChart组件是不可能的。虽然你可以利用.Net框架提供的工具把此MSChart组件转换成受管代码文件,但这个过程相对比较复杂,并且利用这种方法产生的图表速度相当慢,还有就是由MSChart组件自身所限制,对于复杂的图表,是无法利用他来生成的。

本文将以股市的行情图表为例,介绍如何在ASP.NET中实现图表。其实我们看到的行情图并不是一个图表,而是一个图片。在服务器端产生图片,然后在图片上面画出想要显示给用户的各种信息,然后通过浏览器发送图片到客户端,从而形成图表,这就是本文要探讨的方法。这种方法虽然实现起来比较复杂,但操作灵活,非常实用,尤其适用于互联网上的图表,下面就来介绍具体的实现方法。

一.本文中介绍的程序设计及运行环境

(1).微软视窗2000 服务器版

(2)..Net Framework SDK Beta 2以上版本

二.在ASP.NET中实现数据图表的关键步骤以及解决方法:

在ASP.NET页面中画出图表的关键步骤主要有两步,其一,创建一个图片对象(Bitmap)。然后利用.Net FrameWork SDK所提供的方法在此图片对象上面画出自己想要的图形,譬如画线,画点等。其二,就是为了更适合传输,把此图片对象,以'Jpeg'格式保存,并显示出来。下面我们就来看看这二步的具体实现方法。

(1).首先我们来看看如何在ASP.NET页面创建一个动态图片,并显示出来。

创建一个图片对象其实非常容易的,利用命名空间'System.drawing'中的'Bitmap'类来实现的,下列语句可以创建一个位图对象:

//创建一个'Bitmap'对象

Bitmap image = new Bitmap ( 400 , 400 ) ;

修改'Bitmap'对象的二个参数来改变创建的位图对象的长和宽。通过Bitmap类的Save方法就可以显示已经创建的位图对象。由于位图文件要占用很多的空间,为了便于网络传输,一般转换成'Jpeg'或者'Gif'文件来保持。下面语句是把已经创建的位图对象,转换成'Jpeg'文件显示:

//以'Jpeg'格式保存此图片对象,在客户端显示出来

image . Save ( Response . OutputStream , ImageFormat . Jpeg );

稍加修改,就可以把位图对象以'Gif'文件来显示,具体如下:

//以'Jpeg'格式保存此图片对象,在客户端显示出来

image . Save ( Response . OutputStream , ImageFormat . Gif ) ;

下面代码(chart3.aspx)的作用就是ASP.NET动态创建一个图片并显示出来:

<%@ Page Language = 'C#' ContentType = 'image/jpeg' %>

<%@ Import Namespace = 'System' %>

<%@ Import Namespace = 'System.Drawing' %>

<%@ Import Namespace = 'System.Drawing.Drawing2D' %>

<%@ Import Namespace = 'System.Drawing.Imaging' %>

<html >

<head >

<script language = 'C#' runat = 'server' >

void Page_Load ( object sender , EventArgs e )

{

//创建一个'Bitmap'对象

Bitmap image = new Bitmap ( 400 , 400 ) ;

//以'Jpeg'格式保存此图片对象,在客户端显示出来

image . Save ( Response . OutputStream , ImageFormat . Jpeg ) ;

}

</script >

</head >

<body >

</body >

</html >

下面是此代码运行后的界面:

图01:利用ASP.NET动态创建图片

产生的是一个黑色的图片,很不美观,下面就来给此图片上色,并且在此图片上面画线、写字等。

(2).如何给产生得图片上色:

其实给产生得图片上色是比较容易的,首先根据'Bitmap'对象创建一个'Graphic'对象,然后根据此'Graphic'对象的方法来确定上色的图形类型(譬如显示的图片为椭圆、正方形等)。下面代码(chart4.aspx)的作用就是给chart3.aspx代码产生的图片上淡绿色:

<%@ Page Language = 'C#' ContentType = 'image/jpeg' %>

<%@ Import Namespace = 'System' %>

<%@ Import Namespace = 'System.Drawing' %>

<%@ Import Namespace = 'System.Drawing.Drawing2D' %>

<%@ Import Namespace = 'System.Drawing.Imaging' %>

<html >

<head >

<script language = 'C#' runat = 'server' >

void Page_Load ( object sender , EventArgs e )

{

//创建一个'Bitmap'对象

Bitmap image = new Bitmap ( 400 , 400 ) ;

Graphics g = Graphics . FromImage ( image ) ;

g . FillRectangle ( new SolidBrush ( Color . LightGreen ) , 0 , 0 , 400 , 400 ) ;

//以'Jpeg'格式保存此图片对象,在客户端显示出来

image . Save ( Response . OutputStream , ImageFormat . Jpeg ) ;

}

</script >

</head >

<body >

</body >

</html >

下图是chart4.aspx运行的界面:

图02:给产生的图片上色

当然你不仅可以定制所产生的图片颜色,还可以定制产生的图片的形状,下面代码段的功能就是定制图片的形状为椭圆:

<%@ Page Language = 'C#' ContentType = 'image/jpeg' %>

<%@ Import Namespace = 'System' %>

<%@ Import Namespace = 'System.Drawing' %>

<%@ Import Namespace = 'System.Drawing.Drawing2D' %>

<%@ Import Namespace = 'System.Drawing.Imaging' %>

<html >

<head >

<script language = 'C#' runat = 'server' >

void Page_Load ( object sender , EventArgs e )

{

//创建一个'Bitmap'对象

Bitmap image = new Bitmap ( 400 , 400 ) ;

Graphics g = Graphics . FromImage ( image ) ;

g . FillRectangle ( new SolidBrush ( Color . LightGreen ) , 0 , 0 , 400 , 400 ) ;

//以'Jpeg'格式保存此图片对象,在客户端显示出来

image . Save ( Response . OutputStream , ImageFormat . Jpeg ) ;

}

</script >

</head >

<body >

</body >

</html >

下图是此代码的运行界面:

图03:定制图片的形状

当然还可以使用'Graphic'对象的其他方法把图片定制成其他形状,这就不一一介绍了。(3).如何在图片上实现画线和写字:

在图片上写字是通过产生的'Graphic'对象的DrawString ( )方法来实现的,在调用此方法前,必须设置字体和刷子,具体调用方法是:

public void DrawString (

string s ,

Font font ,

Brush brush ,

float x ,

float y

) ;

's'是要输出的字符串,'font'是字符串的字体,'brush'是定义刷子,后面二个参数是产生字符串的位置坐标。在程序中产生字符串的具体语句如下:

Font axesFont = new Font ( 'arial' , 10 ) ;

Brush blackBrush = new SolidBrush ( Color . Red ) ;

g . DrawString ( '在图片上面写入文字,呵呵' , axesFont , blackBrush , 90 , 20 ) ;

要在图片上画线要使用到'Graphic'对象的DrawLine ( )方法,具体的使用语法如下:

public void DrawLines (

Pen pen ,

Point [ ] points

) ;

其中'points'是定义点的位置,当然你也可以使用本文中使用的方法来调用,就是定义每画一道线,这样我感觉更方法些。下面是在产生的图片上画出三条线:

Pen redPen = new Pen ( Color . Red , 1 ) ;

Pen blackPen = new Pen ( Color . Blue , 2 ) ;

//以下语句是在此图片对象上画出各种线条,可以定义线条的粗细、起点、终点等

g . DrawLine ( blackPen , 0 , 2 , 210 , 250 ) ;

g . DrawLine ( blackPen , 210 , 250 , 310 , 50 ) ;

g . DrawLine ( redPen , 310 , 50 , 210 , 350 ) ;

知道了这些基本知识,在定制图片形状,给图片上色,在图片上写字、画线就显得比较容易了,下面代码(chart2.aspx)的功能就是定制一个正方形图片,并在图片上画线、写字、上色,具体如下:

<%@ Page Language = 'C#' ContentType = 'image/jpeg' %>

<%@ Import Namespace = 'System' %>

<%@ Import Namespace = 'System.Drawing' %>

<%@ Import Namespace = 'System.Drawing.Drawing2D' %>

<%@ Import Namespace = 'System.Drawing.Imaging' %>

<html >

<head >

<script language = 'C#' runat = 'server' >

void Page_Load ( object sender , EventArgs e )

{

Bitmap image = new Bitmap ( 400 , 400 ) ;

Font axesFont = new Font ( 'arial' , 10 ) ;

Brush blackBrush = new SolidBrush ( Color . Red ) ;

Pen redPen = new Pen ( Color . Red , 1 ) ;

Pen blackPen = new Pen ( Color . Blue , 2 ) ;

Graphics g = Graphics . FromImage ( image ) ;

g . Clear ( Color . White ) ;

g . FillRectangle ( new SolidBrush ( Color . LightGreen ) , 0 , 0 , 400 , 400 ) ;

//在此图片对象中画出图片,可以定义文字大小、位置、色彩等

g . DrawString ( '在图片上面写入文字,呵呵' , axesFont , blackBrush , 90 , 20 ) ;

//以下语句是在此图片对象上画出各种线条,可以定义线条的粗细、起点、终点等

g . DrawLine ( blackPen , 0 , 2 , 210 , 250 ) ;

g . DrawLine ( blackPen , 210 , 250 , 310 , 50 ) ;

g . DrawLine ( redPen , 310 , 50 , 210 , 350 ) ;

//以'Jpeg'格式保存此图片对象,在客户端显示出来

// image . Save ( Response . OutputStream , ImageFormat . Jpeg ) ;

image . Save ( Response . OutputStream , ImageFormat . Jpeg ) ;

}

</script >

</head >

<body >

</body >

</html >

图04:在图片上完成画线、写字和上色

 
 
 
免责声明:本文为网络用户发布,其观点仅代表作者个人观点,与本站无关,本站仅提供信息存储服务。文中陈述内容未经本站证实,其真实性、完整性、及时性本站不作任何保证或承诺,请读者仅作参考,并请自行核实相关内容。
2023年上半年GDP全球前十五强
 百态   2023-10-24
美众议院议长启动对拜登的弹劾调查
 百态   2023-09-13
上海、济南、武汉等多地出现不明坠落物
 探索   2023-09-06
印度或要将国名改为“巴拉特”
 百态   2023-09-06
男子为女友送行,买票不登机被捕
 百态   2023-08-20
手机地震预警功能怎么开?
 干货   2023-08-06
女子4年卖2套房花700多万做美容:不但没变美脸,面部还出现变形
 百态   2023-08-04
住户一楼被水淹 还冲来8头猪
 百态   2023-07-31
女子体内爬出大量瓜子状活虫
 百态   2023-07-25
地球连续35年收到神秘规律性信号,网友:不要回答!
 探索   2023-07-21
全球镓价格本周大涨27%
 探索   2023-07-09
钱都流向了那些不缺钱的人,苦都留给了能吃苦的人
 探索   2023-07-02
倩女手游刀客魅者强控制(强混乱强眩晕强睡眠)和对应控制抗性的关系
 百态   2020-08-20
美国5月9日最新疫情:美国确诊人数突破131万
 百态   2020-05-09
荷兰政府宣布将集体辞职
 干货   2020-04-30
倩女幽魂手游师徒任务情义春秋猜成语答案逍遥观:鹏程万里
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案神机营:射石饮羽
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案昆仑山:拔刀相助
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案天工阁:鬼斧神工
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案丝路古道:单枪匹马
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案镇郊荒野:与虎谋皮
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案镇郊荒野:李代桃僵
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案镇郊荒野:指鹿为马
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案金陵:小鸟依人
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案金陵:千金买邻
 干货   2019-11-12
 
推荐阅读
 
 
 
>>返回首頁<<
 
靜靜地坐在廢墟上,四周的荒凉一望無際,忽然覺得,淒涼也很美
© 2005- 王朝網路 版權所有