ASP+SGC实现柱状图

很久以前写的东西了

SGC是Structured Graphic Control(结构化图形控件)的缩写,它是Microsoft Internet Explorer中的一组创建和处理矢量图形的ActiveX控件。使用SGC创建图表的步骤如下:

 

 

 

 

1)        插入CLASSID属性为CLSID:369303C2-D7AC-11D0-89D5-00A0C90833E6的OBJECT标记,此操作代表对SGC的引用。同时设置OBJECT标记的style属性确定图表的显示样式;

 

 

 

 

2)        通过插入一系列PARAM标记绘制图表,PARAM标记是OBJECT的子标记,它的基本语法是:<PARAM NAME="Linexxxx" VALUE="method(parameters)">,其中,“xxxx”必须是形如“0001”、“0002”的整数序列,“method(parameters)”指定了操作要以哪些参数执行哪个方法。在SGC中,可用的方法分为四类:绘制基于点阵的矢量形状,控制线条效果,控制填充效果和其它方法。结合使用这四种方法可以方便地实现图表主体、坐标、图例等的绘制。至于图表标题,可以直接使用HTML中的常用标记在SGC对象的外部体现。





 

 

 

diaocha.asp:

<%@LANGUAGE="VBSCRIPT"%>
<!--#include file="conndiaocha.asp" -->
<%
set Recordset1 = Server.CreateObject("ADODB.Recordset")
Recordset1.ActiveConnection = MM_conndiaocha_STRING
Recordset1.Source = "SELECT * FROM diaocha"
Recordset1.CursorType = 0
Recordset1.CursorLocation = 2
Recordset1.LockType = 3
Recordset1.Open()
Recordset1_numRows = 0
%>
<html>
<head>
<title>调查</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<link rel="stylesheet" href="../includes/ao.CSS" type="text/css">
</head>
<body bgcolor="#FFFFFF" text="#000000">
<%
dim score(4)
dim yscore(4)
dim tscore(4)
Recordset1.MoveFirst
dim total
For i=1 to 3
 score(i)=Recordset1("票数")
 tscore(i)=score(i)
 total=total+score(i)
 Recordset1.MoveNext
 If Recordset1.Eof then Exit For
Next
average=int(total/3)
tscore(4)=average
score(4)=average
dim max
max=0
For i=1 to 4
 If max<score(i) then max=score(i)
Next
For i=1 to 4
 score(i)=int(80/max*score(i))
Next
For i=1 to 4
 If score(i)>=400 then
  yscore(i)=0-(score(i)-40)
 else
  yscore(i)=40-score(i)
 End IF
Next
%>
<OBJECT ID=SCORE STYLE="POSITION:absolute;width:120;height:80;left:-2px;top:9px" CLASSID="CLSID:369303C2-D7AC-11D0-89D5-00A0C90833E6">
  <PARAM NAME='Line0001' VALUE='PolyLine(2,-40,-40,-40,40,0)'>
<PARAM NAME='Line0002' VALUE='SetFillStyle(3)'>
<PARAM NAME='Line0003' VALUE='SetHatchFill(1)'>
<PARAM NAME='Line0004' VALUE='SetFillColor(204,0,0,204,0,0)'>"
<%
Response.write "<PARAM NAME='Line0005' VALUE='Rect(" & -30 & "," & yscore(1) & "," & 10 & "," & score(1) & ",0)'>"
%>
<PARAM NAME='Line0006' VALUE='SetFillStyle(4)'>
<PARAM NAME='Line0007' VALUE='SetHatchFill(11)'>
<PARAM NAME='Line0008' VALUE='SetFillColor(204,0,66,204,0,66)'>
<%
Response.write "<PARAM NAME='Line0009' VALUE='Rect(" & -10 & "," & yscore(2) & "," & 10 & "," & score(2) & ",0)'>"
%>
<PARAM NAME='Line0010' VALUE='SetFillStyle(5)'>
<PARAM NAME='Line0011' VALUE='SetHatchFill(1)'>
<PARAM NAME='Line0012' VALUE='SetFillColor(204,0,204,204,0,204)'>
<%
Response.write "<PARAM NAME='Line0013' VALUE='Rect(" & 10 & "," & yscore(3) & "," & 10 & "," & score(3) & ",0)'>"
%>
<PARAM NAME='Line0014' VALUE='SetFillStyle(6)'>
<PARAM NAME='Line0015' VALUE='SetHatchFill(1)'>
<PARAM NAME='Line0016' VALUE='SetFillColor(255,66,33,255,66,33)'>
<%
Response.write "<PARAM NAME='Line0017' VALUE='Rect(" & 30 & "," & yscore(4) & "," & 10 & "," & score(4) & ",0)'>"
%>
<PARAM NAME='Line0018' VALUE='PolyLine(2,-40,39,120,40,0)'>
</OBJECT>
<div id="Layer1" style="position:absolute; width:224px; height:79px; z-index:1; left: 14px; top: 104px">
  <table width="50%" border="1" height="35" bordercolor="#FFFFFF" cellpadding="0" cellspacing="0">
    <tr>
      <td class="font9" bgcolor="#CC0000" width="10%">&nbsp;</td>
      <td class="font9" width="90%">整体布局(<%=tscore(1)%>)</td>
    </tr>
    <tr>
      <td class="font9" bgcolor="#CC0066" width="10%">&nbsp;</td>
      <td class="font9" width="90%">美工制作(<%=tscore(2)%>)</td>
    </tr>
    <tr>
      <td class="font9" bgcolor="#CC00CC" width="10%">&nbsp;</td>
      <td class="font9" width="90%">应用程序(<%=tscore(3)%>)</td>
    </tr>
    <tr>
      <td class="font9" bgcolor="#FF6633" width="10%">&nbsp;</td>
      <td class="font9" width="90%">平均票数(<%=tscore(4)%>)</td>
    </tr>
  </table>
 
  <br>
  &nbsp;&nbsp;&nbsp;<a href="javascript:window.close()">关闭窗口</a> </div>
</body>
</html>
<%
Recordset1.Close()
%>
posted @ 2005-04-03 19:36  蜡人张  阅读(1005)  评论(0编辑  收藏  举报