常州网络公司首页 >>> WEB编程 >> ASP

在ASP里使用Google图表API来实现自己的折线图

发布时间:2010-1-9 9:34:17   浏览次数:7972

最近要做下网站,需要一个图表来显示一段时间的价格变化,之前找了很久,没有找到一个好的组件,要么就是要给钱的,后来找了个国外的组件,还有个广告,有广告就有广告吧,组件运行一段时间后,服务器总是出现资源不占的现象,很郁闷。

最后,一个客户说,有个GOOGLE CHART可以做图表,我看了一下,的确可以。
网址:http://code.google.com/intl/zh-CN/apis/chart/

但在用GOOGLE CHART的时候要注意,GOOGLE CHART并不是直接把数据提交给GOOGLE,它直接显示你所需要的图表,GOOGLE图表的所有数量,都是0-100之间的数,超过100的都视为100。也就是说,如果你在数据里显示的数据大于100的,那么,你需要把所有数据同比缩小成100以内的整数。

原因是,在GOOGLE CHART里,一个图表里,不管你的图片大小是多少,GOOGLE都把一个图表分成100个点,标注点时,就是这个数来注的。


下面以折线图为例给一个从数据库里读出数据,然后计算成100以内的数据,在图片表上标注。

<%
set list=server.CreateObject("adodb.recordset")
list.open "select * from Table order by id asc",conn,1,1
dim num
num=list.recordcount-1 '记得有多少数据,以且定义数组

'下面是定义动态数组
dim exNum
dim imNum
dim exMon
dim imMon
dim labels
redim exNum(num)
redim imNum(num)
redim exMon(num)
redim imMon(num)
redim labels(num)


i=0
mxNum=0
mxMon=0

do while not list.eof
 '读出数据
 exNum(i)=list("exportNum")
 imNum(i)=list("importNum")
 exMon(i)=list("exportMoney")
 imMon(i)=list("importMoney")

 labels(i)=right(list("gyear"),2)&"."&list("gmonth")
 
 '计算出第组的最大数据  
 if mxNum<exNum(i) then mxNum=exNum(i)
 if mxNum<imNum(i) then mxNum=imNum(i)
 if mxMon<exMon(i) then mxMon=exMon(i)
 if mxMon<imMon(i) then mxMon=imMon(i)
 i=i+1
list.movenext
loop
list.close
set list=nothing

'定义在图表上标注点的数组
n=UBound(exNum)
dim exNumDot
dim imNumDot
dim exMonDot
dim imMonDot
redim exNumDot(n)
redim imNumDot(n)
redim exMonDot(n)
redim imMonDot(n)

'以同比的方式,计算出每组数据,最后的结果每组数据都小于100的整数
eeNum=mxNum/100
eeMon=mxMon/100
for j=LBound(exNum) to UBound(exNum)
 exNumDot(j)=int(exNum(j)/eeNum)
 imNumDot(j)=int(imNum(j)/eeNum)
 exMonDot(j)=int(exMon(j)/eeMon)
 imMonDot(j)=int(imMon(j)/eeMon)
next

'
dim exNumStr
dim imNumStr
dim exMonStr
dim imMonStr
dim yStr
for k=LBound(exNum) to UBound(exNum)
 if exNumStr="" then exNumStr=exNumDot(k) else exNumStr=exNumStr&","&exNumDot(k) end if
 if imNumStr="" then imNumStr=imNumDot(k) else imNumStr=imNumStr&","&imNumDot(k) end if
 if exMonStr="" then exMonStr=exMonDot(k) else exMonStr=exMonStr&","&exMonDot(k) end if
 if imMonStr="" then imMonStr=imMonDot(k) else imMonStr=imMonStr&","&imMonDot(k) end if
 if yStr="" then yStr=labels(k) else yStr=yStr&"|"&labels(k) end if
next

'计算X轴的标注
numStep=mxNum/10
monStep=mxMon/10
numX=""
monX=""
for l=1 to 10
 if i=10 then
  numX=numX&"|"&mxNum
  monX=monX&"|"&mxMon
 else
  numX=numX&"|"&int(l*numStep)
  monX=monX&"|"&int(l*monStep)
 end if
next
%>

显示图表
<img src="http://chart.apis.google.com/chart?
cht=lc&chco=ff0000,0000FF
&chs=650x450
&chd=t:<%=exNumStr%>|<%=imNumStr%>
&chxt=x,y
&chxl=0:|<%=yStr%>|1:|<%=numX%>
&chm=s,FF0000,0,-1,5|s,0000FF,1,-1,5
&chg=<%=100/n%>,10,1,5" />


<img src="http://chart.apis.google.com/chart?
cht=lc&chco=ff0000,0000FF
&chs=650x450
&chd=t:<%=exMonStr%>|<%=imMonStr%>
&chxt=x,y
&chxl=0:|<%=yStr%>|1:|<%=monX%>
&chm=s,FF0000,0,-1,5|s,0000FF,1,-1,5
&chg=<%=100/n%>,10,1,5" />

这样,你的图表就能正确显示了。这种方法不会占用自己服务器的资源,而且完全免费,特别是一些没有自己的服务器而用的虚拟主机的朋友,特别方便。
 

上一条:Active Server Pages 错误 'ASP 0245' 代码页值的混合使用 的解决办法
下一条:ASP如何过滤非法关键词以及不良信息
首页 | 在线留言 | 网站地图

CopyRight ©2008-2014   糊涂蛋技术网    苏ICP备05013073号
站长:万创   QQ:54960248  E-mail:xlxcn#126.com