纯ASP画折线图 龚鸣table2新版（支持负数，小数）

 

<%  
function table2(total,table_x,table_y,all_width,all_height,line_no)  
'参数含义(传递的数组，横坐标，纵坐标，图表的宽度，图表的高度,折线条数)  
'纯ASP代码生成图表函数2——折线图  

'@version:2.0
'@brief:  增加负数支持，并修正小数不能正常显示的BUG, 增加部分注释
'@date:   10/29/2010
'@author: 李玉宝(yubaolee/.cpp/anglecloudy) 
'@contact BaiDuHI: http://hi.baidu.com/anglecloudy
'         javaeye：http://dotcpp.iteye.com
'         cnblogs: http://www.cnblogs.com/dotcpp
'@remarks:
'         数组情况分布：【！ASP中dim[m][n]，有[m+1]*[n+1]个元素！】
'         total[0][0]未使用 第一行为线条信息，第一列为X轴显示的内容
'         ________________________________
'         | NULL|  线条的颜色等信息      |
'         -------------------------------|
'         | x   |                        |
'         | 轴  |       曲线内容         |
'         |     |                        |
'		  --------------------------------
' 
'
'作者：龚鸣(Passwordgm) QQ:25968152 MSN:[e-mail] Email:[e-mail]  
'本人非常愿意和ASP,VML,FLASH的爱好者在HTTP://topclouds.126.com进行交流和探讨  
'版本1.0  2003-8-11  
'非常感谢您使用这个函数，请您使用和转载时保留版权信息，这是对作者工作的最好的尊重。 

line_color="#69f"  
left_width=70  
total_no=ubound(total,1)  

temp1=0       'save the maximum value
minvalue = 0  'save the minimum value
for i=1 to total_no  
	for j=1 to line_no  
	   if temp1<int(total(i,j)) then temp1=int(total(i,j))  
	   if minvalue > int(total(i,j)) then minvalue = int(total(i,j))
	next  
next  

'caculate the y axis max value, and save it to temp3
if temp1>9 then  
	temp2=mid(cstr(temp1),2,1)  
	if temp2>5 then  
	temp3=(int(temp1/(10^(len(cstr(temp1))-1)))+1)*10^(len(cstr(temp1))-1)  
	else  
	temp3=(int(temp1/(10^(len(cstr(temp1))-1)))+0.5)*10^(len(cstr(temp1))-1)  
	end if  
else  
    if temp1>4 then temp3=10 else temp3=5  
end if  

'if the minimum value is minus, you should caculate the y axis min value, and save it to mintemp3
mintemp3 = 0
if minvalue<0 then
    minvalue = -minvalue
    if minvalue > 9 then
		mintemp2 = mid(cstr(minvalue),2,1)
		if(mintemp2 > 5) then
		   mintemp3=(int(minvalue/(10^(len(cstr(minvalue))-1)))+1)*10^(len(cstr(minvalue))-1)  
		else  
		   mintemp3=(int(minvalue/(10^(len(cstr(minvalue))-1)))+0.5)*10^(len(cstr(minvalue))-1)  
		end if  
    else
	    if minvalue> 4 then mintemp3= 10 else mintemp3=5  
    end if  
    minvalue = -minvalue
	mintemp3 = -mintemp3
	
end if

temp4=temp3
response.write "<v:rect id='_x0000_s1027' alt='' style='position:absolute;left:"&table_x+left_width&"px;top:"&table_y&"px;width:"&all_width&"px;height:"&all_height&"px;z-index:-1' fillcolor='#9cf' stroked='f'><v:fill rotate='t' angle='-45' focus='100%' type='gradient'/></v:rect>"  

for i=0 to all_height-1 step all_height/20  
	response.write "<v:line id='_x0000_s1027' alt='' style='position:absolute;left:0;text-align:left;top:0;flip:y;z-index:-1' from='"&table_x+left_width+length&"px,"&table_y+all_height-length-i&"px' to='"&table_x+all_width+left_width&"px,"&table_y+all_height-length-i&"px' strokecolor='"&line_color&"'/>"  
	response.write "<v:line id='_x0000_s1027' alt='' style='position:absolute;left:0;text-align:left;top:0;flip:y;z-index:-1' from='"&table_x+(left_width-15)&"px,"&table_y+i&"px' to='"&table_x+left_width&"px,"&table_y+i&"px'/>"  
	response.write ""  
	response.write "<v:shape id='_x0000_s1025' type='#_x0000_t202' alt='' style='position:absolute;left:"&table_x&"px;top:"&table_y+i&"px;width:"&left_width&"px;height:18px;z-index:1'>"  
	response.write "<v:textbox inset='0px,0px,0px,0px'><table cellspacing='3' cellpadding='0' width='100%' height='100%'><tr><td align='right'>"&temp4&"</td></tr></table></v:textbox></v:shape>"  
	temp4=temp4-(temp3-mintemp3)/20  'the per step of y axis is (temp3-mintemp3)/20
next  

response.write "<v:line id='_x0000_s1027' alt='' style='position:absolute;left:0;text-align:left;top:0;flip:y;z-index:-1' from='"&table_x+left_width&"px,"&table_y+all_height&"px' to='"&table_x+all_width+left_width&"px,"&table_y+all_height&"px'/>"  
response.write "<v:line id='_x0000_s1027' alt='' style='position:absolute;left:0;text-align:left;top:0;flip:y;z-index:-1' from='"&table_x+left_width&"px,"&table_y&"px' to='"&table_x+left_width&"px,"&table_y+all_height&"px'/>"  

dim line_code  
redim line_code(line_no,5)  
for i=1 to line_no  
	line_temp=split(total(0,i),",")  
	line_code(i,1)=line_temp(0) 
	line_code(i,2)=line_temp(1)  
	line_code(i,3)=line_temp(2)  
	line_code(i,4)=line_temp(3)  
	line_code(i,5)=line_temp(4)  
next  

for j=1 to line_no  
	for i=1 to total_no-2  
		x1=table_x+left_width+all_width*(i-1)/total_no  
		y1=table_y+(temp3-total(i,j))*(all_height/(temp3-mintemp3)) 
		x2=table_x+left_width+all_width*i/total_no  
		y2=table_y+(temp3-total(i+1,j))*(all_height/(temp3-mintemp3))

		'draw specific lines and illustrating of every color meaning
		response.write "<v:line id=""_x0000_s1025"" alt="""" style='position:absolute;left:0;text-align:left;top:0;z-index:1' from="""&x1&"px,"&y1&"px"" to="""&x2&"px,"&y2&"px"" coordsize=""21600,21600"" strokecolor="""&line_code(j,1)&""" strokeweight="""&line_code(j,2)&""">"  

		' check line type
		select case line_code(j,3)  
			case 1  
			case 2  
			response.write "<v:stroke dashstyle='1 1'/>"  
			case 3  
			response.write "<v:stroke dashstyle='dash'/>"  
			case 4  
			response.write "<v:stroke dashstyle='dashDot'/>"  
			case 5  
			response.write "<v:stroke dashstyle='longDash'/>"  
			case 6  
			response.write "<v:stroke dashstyle='longDashDot'/>"  
			case 7  
			response.write "<v:stroke dashstyle='longDashDotDot'/>"  
			case else  
		end select  

		response.write "</v:line>"&CHR(13)  
		select case line_code(j,4)  
			case 1  
			case 2  
			response.write "<v:rect id=""_x0000_s1027"" style='position:absolute;left:"&x1-2&"px;top:"&y1-2&"px;width:4px;height:4px; z-index:2' fillcolor="""&line_code(j,1)&""" strokecolor="""&line_code(j,1)&"""/>"&CHR(13)  
			case 3  
			response.write "<v:oval id=""_x0000_s1026"" style='position:absolute;left:"&x1-2&"px;top:"&y1-2&"px;width:4px;height:4px;z-index:1' fillcolor="""&line_code(j,1)&""" strokecolor="""&line_code(j,1)&"""/>"&CHR(13)  
		end select  
	next  

	select case line_code(j,4)  
		case 1  
		case 2  
		response.write "<v:rect id=""_x0000_s1027"" style='position:absolute;left:"&x2-2&"px;top:"&y2-2&"px;width:4px;height:4px; z-index:2' fillcolor="""&line_code(j,1)&""" strokecolor="""&line_code(j,1)&"""/>"&CHR(13)  
		case 3  
		response.write "<v:oval id=""_x0000_s1026"" style='position:absolute;left:"&x2-2&"px;top:"&y2-2&"px;width:4px;height:4px;z-index:1' fillcolor="""&line_code(j,1)&""" strokecolor="""&line_code(j,1)&"""/>"&CHR(13)  
	end select  
next  

'show the value of  x axis 
for i=1 to total_no 
	response.write "<v:line id='_x0000_s1027' alt='' style='position:absolute;left:0;text-align:left;top:0;flip:y;z-index:-1' from='"&table_x+left_width+all_width*(i-1)/total_no&"px,"&table_y+all_height&"px' to='"&table_x+left_width+all_width*(i-1)/total_no&"px,"&table_y+all_height+15&"px'/>"  
	response.write ""  
	response.write "<v:shape id='_x0000_s1025' type='#_x0000_t202' alt='' style='position:absolute;left:"&table_x+left_width+all_width*(i-1)/total_no&"px;top:"&table_y+all_height&"px;width:"&all_width/total_no&"px;height:18px;z-index:1'>"  
	response.write "<v:textbox inset='0px,0px,0px,0px'><table cellspacing='3' cellpadding='0' width='100%' height='100%'><tr><td align='left'>"&total(i,0)&"</td></tr></table></v:textbox></v:shape>"  
next  

tb_height=30  
response.write "<v:rect id='_x0000_s1025' style='position:absolute;left:"&table_x+all_width+20&"px;top:"&table_y&"px;width:100px;height:"&line_no*tb_height+20&"px;z-index:1'/>"  
for i=1 to line_no  
response.write "<v:shape id='_x0000_s1025' type='#_x0000_t202' alt='' style='position:absolute;left:"&table_x+all_width+25&"px;top:"&table_y+10+(i-1)*tb_height&"px;width:60px;height:"&tb_height&"px;z-index:1'>"  
response.write "<v:textbox inset='0px,0px,0px,0px'><table cellspacing='3' cellpadding='0' width='100%' height='100%'><tr><td align='left'>"&line_code(i,5)&"</td></tr></table></v:textbox></v:shape>"  
response.write "<v:rect id='_x0000_s1040' alt='' style='position:absolute;left:"&table_x+all_width+80&"px;top:"&table_y+10+(i-1)*tb_height+4&"px;width:30px;height:20px;z-index:1' fillcolor='"&line_code(i,1)&"'><v:fill color2='"&line_code(i,1)&"' rotate='t' focus='100%' type='gradient'/></v:rect>"  
next  
end function  
%>

 

    调用：

 

<html xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office">
<!--[if !mso]>
<style>
v\:*         { behavior: url(#default#VML) }
o\:*         { behavior: url(#default#VML) }
.shape       { behavior: url(#default#VML) }
</style>
<![endif]-->

<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title></title>
<style>
TD {    FONT-SIZE: 9pt}
</style></head>
<body topmargin=5 leftmargin=0 scroll=AUTO>
<script language=javascript>

//=============调用方法=====================

var nameArray = new Array();

nameArray[0]="中国经营报"
nameArray[1]="招聘网"
nameArray[2]="51Job"
nameArray[3]="新民晚报"
nameArray[4]="新闻晚报"
nameArray[5]="南方周末"
nameArray[6]="羊城晚报"

var dataArray1 = new Array()

dataArray1[0]="#FF0000,1.5,1,2,公司1"//参数1线条的颜色，参数2线条的宽度，参数3线条的类型，参数4转折点的类型,参数5线条名称
dataArray1[1]=200.3
dataArray1[2]=40.33
dataArray1[3]=-200
dataArray1[4]=-600
dataArray1[5]=1222
dataArray1[6]=413
dataArray1[7]=800

var dataArray2 = new Array()

dataArray2[0]="#0000FF,1,2,3,公司2"
dataArray2[1]=-200
dataArray2[2]=500
dataArray2[3]=1040
dataArray2[4]=1600
dataArray2[5]=522
dataArray2[6]=813
dataArray2[7]=980

var dataArray3 = new Array()

dataArray3[0]="#004D00,1,1,3,公司3"
dataArray3[1]=300.33
dataArray3[2]=890
dataArray3[3]=1240
dataArray3[4]=40.25
dataArray3[5]=722
dataArray3[6]=833
dataArray3[7]=1280

var total = new Array(nameArray,dataArray1,dataArray2,dataArray3)

table2(total,100,90,600,250,3);
</script>
</body>
</html>