使用XML技術實現OWC對數據庫的展示

　　本文档介绍了如何借助XML语言实现在Web页面上的OWC对数据库中的数据进行展示的方法。由于XML数据可以跨越防火墙，因此该方式可以实现在Internet上对数据进行展现。 
　　在基于WEB的数据库分析应用中，常常借助OWC控件结合HTML实现对数据的表格和图表两种方式的展现。一般应用往往采用OWC直接连接数据库的方式，这会使数据库连接口令暴露在客户端，而使数据库的安全性降低。本文介绍的采用XML作为OWC和数据库之间数据交换介质的方式，能够避免这种对数据库造成的不安全危险。同时，这也能带来其他一些好处，例如：使浏览器与WEB服务器及数据库间的交互次数减少，从而加快排序等操作的响应速度，并减少了服务器的负荷。
一、获取XML数据
将数据库中的数据转化为XML格式的方法很多，本文档不过多对此进行介绍。从性能、通用性角度考虑，这里我们采用了ADO直接序列化(持久化Persist)数据的方式，代码如下：   

Code
<!--GetData.asp  --> 
<% 
dim strConn 
strConn="Provider=SQLOLEDB.1;Persist Security Info=False;User ID=sa;Initial Catalog=test;Data Source=jlwz" 
'----------读取数据---------------- 
dim conn,rs 
set conn=server.CreateObject("adodb.connection") 
set rs=server.CreateObject("adodb.recordset") 
conn.Open strConn 
rs.Open "Select Stat_Date,Call_Num,Call_Fee From CallStat",conn 
  
'将ADO转化为xml dom 
Const adPersistXML=1 
  
dim objXMLDom 
set objXMLDom=server.CreateObject("MSXML2.DOMDocument.3.0") 
rs.Save objXMLDom,adPersistXML  
set rs=nothing 
%> 

这种方式得到的的XML并不够简洁，其中包含了Schema信息。 
尽管对于OWC中的DataSourceControl控件来说，可以直接采用这种形式的XML数据，但考虑到数据从服务器向客户端传输的效率，我们使用XSLT对这种XML数据进行了转化。为此，编写了如下的Clean.xsl文件：

Clean.xsl
<?xml version="1.0"?> 
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" 
    xmlns:s="uuid:BDC6E3F0-6DA3-11d1-A2A3-00AA00C14882" 
    xmlns:dt="uuid:C2F41010-65B3-11d1-A29F-00AA00C14882" 
    xmlns:rs="urn:schemas-microsoft-com:rowset" xmlns:z="#RowsetSchema"> 
    <xsl:output omit-xml-declaration="yes"/> 
    <xsl:template match="/"> 
        <xsl:element name="data"> 
            <xsl:for-each select="/xml/rs:data/z:row"> 
                <xsl:element name="row"> 
                    <xsl:for-each select="@*"> 
                        <xsl:element name="{name()}"> 
                        <xsl:value-of select="."/> 
                        </xsl:element> 
                    </xsl:for-each> 
                </xsl:element> 
            </xsl:for-each> 
        </xsl:element> 
    </xsl:template> 
</xsl:stylesheet> 

然后，在GetData.asp中通过如下代码对前面的XML数据进行转化： 

用XSLT清理转化XML数据
'用XSLT清理转化XML数据 
Dim strCleanXML,objXSLT 
  
set objXSLT=server.CreateObject("MSXML2.DOMDocument") 
objXSLT.load(server.MapPath("Clean.xsl")) 
strCleanXML=objXMLDom.transformNode(objXSLT) 

 
此时，就得到了我们想要的比较简洁的XML结构的字符串，可以简单地将其Response.Write到客户端：

HTML Code
<data> 
  <row> 
     <Stat_Date>2003-06-01</Stat_Date>  
     <Call_Num>100</Call_Num>  
     <Call_Fee>200</Call_Fee>  
  </row> 
  <row> 
     <Stat_Date>2003-07-01</Stat_Date>  
     <Call_Num>200</Call_Num>  
     <Call_Fee>400</Call_Fee>  
  </row> 
  …… 
</data> 
 

 

二、使用OWC控件和HTML表格展现XML数据
2.1 基本功能的实现
这里新建了另外一个HTML页面。为了使用刚才得到的XML数据，在HTML页面中，采用XML 数据岛： 

< XML  id ="dbXML"  src ="getData.asp"  onreadystatechange ="init()" ></ XML >

 
然后，可以利用HTML表格的绑定功能展现数据： 

HTML Code
<table  datasrc="#dbXML" style="width:100%;BORDER-COLLAPSE: collapse;" border=1 cellpadding=0 cellspacing=0>   
   <tr>   
    <td><div  type=text  datafld=Stat_Date></div></td>   
    <td><div  type=text  datafld=Call_Num></div></td> 
    <td><div type=text datafld=Call_Fee></div></td>   
   </tr>   
</table> 

 
在刚才的XML数据岛的onreadystatechange事件对应的init()函数中，我们通过如下代码实现OWC的图表： 

Code
<OBJECT id=CS1 style="WIDTH:400px;TOP:0px;HEIGHT:280px"  
classid=clsid:0002E556-0000-0000-C000-000000000046 VIEWASTEXT> 
</OBJECT> 
<script lanaguage=vbscript> 
Sub init() 
    if(dbXML.readyState="complete") then  
        dim strXML 
        set strXML=dbXML.XMLDocument 
        createChart strXML,CS1 
    end if 
End Sub 
Sub createChart(byref oxml,cspace) '根据传入的XML生成图表 
        Dim xdoc,xroot,cCnt 
        Dim ndx,cnode,txtData,txtCat,txtData2 
             
        Set xdoc=dbXML.XMLDocument 
        Set xroot = xdoc.documentElement 
        cCnt = xroot.childNodes.length 
        txtData = "":txtCat = "" 
  
        ' 从XML数据中得到相应的子符串 
        For ndx = 0 To cCnt - 1 
            Set cnode = xroot.childNodes(ndx) 
            txtCat = txtCat & cnode.childNodes(0).text 
            txtData = txtData & cnode.childNodes(1).text 
            txtData2=txtData2 & cnode.childNOdes(2).text 
            if ndx <> (cCnt -1) then 
                txtCat = txtCat & "," 
                txtData = txtData & "," 
                txtData2 = txtData2 & "," 
            end if 
        Next 
         
        '---下面开始绘图----------  
       '添加数据序列1 
       set ch =cspace.Charts.Add()  
       set s = ch.SeriesCollection.Add()  
       s.name="通话费用（元）"  
       s.Caption=s.name  
       s.SetData c.chDimCategories,c.chDataLiteral, txtCat  
       s.SetData c.chDimValues, c.chDataLiteral, txtData  
       s.type=8 '曲线图  
        
       '设定时间刻度轴格式  
       Set axCategory = cspace.Charts(0).Axes(c.chAxisPositionCategory) 
        with axCategory  
           .GroupingUnitType = c.chAxisUnitMonth '月  
           .GroupingUnit = 1 '单位  
           .NumberFormat="Short Date" '短日期  
       end with  
        
       '添加数据序列2  
       set s2 = ch.SeriesCollection.Add()  
        s2.name="通话次数（次）"  
       s2.Caption=s2.name  
       s2.SetData c.chDimValues, c.chDataLiteral, txtData2  
  
       '标题  
       ch.HasTitle = true  
       ch.Title.Caption="通话情况月报"  
       ch.Title.font.color="black"  
       ch.Title.font.size=10  
       ch.Title.font.bold=true  
        
       'ChartSpace属性 
       cspace.Border=c.chLineDash  
       cspace.HasSelectionMarks=true 
       cspace.AllowFiltering=true '允许命令与分组 
       cspace.AllowPropertyToolbox=true  
        
       '设置图例及位置 
       ch.Legend.Position=c.chLegendPositionRight  
       ch.HasLegend=false  
  
       '分成不同的组,显示双坐标轴 
       s2.UnGroup TRUE  
       Set axIncomeAxis = ch.Axes.Add(s2.Scalings(c.chDimValues)) 
       axIncomeAxis.Position = c.chAxisPositionRight 
       axIncomeAxis.HasMajorGridlines=false  
       s2.type=0 '柱形图 
    End Sub 

 
这样，我们就得到了数据表格和图表。
这样，借助于XML技术和IE绑定技术，我们就实现了OWC对数据库中数据的展示，而在客户端并没有暴露任何数据连接信息。
 
2．2 其他功能
OWC可以很容易的实现将所见到的图表保存为本地图片，大大方便了使用者。同时，OWC提供了多种图表类型，如：饼图、曲线图、柱形图等，适合在不同的情况下展现数据。  
如果借助COM组件、以及对XSL的灵活运用，我们这个页面能得到更好的性能和更强的功能。比如：对HTML表格的排序（参见附件中的HTML源代码）、数据分页等。此外，我们还可以实现通用的数据访问、搜索功能。

Code
<%@ Language=VBScript codepage=65001 %>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>在ASP中用OWC控件动态生成图表显示</title>
</head>
<body>
<%
'测试数据
categories=Array("10","20","30","40")   
values=Array(11,22,3,5)

'创建owc对象
set chart=Server.CreateObject("OWC10.ChartSpace")
chart.clear
set chartShow=chart.Charts.Add
set chartConst = chart.Constants

'设定图表类型，图表类型有很多种，详见OWC帮助文件ChartChartTypeEnum
chartShow.type=chartConst.chChartTypeColumnClustered  'chChartTypeColumnStacked/chChartTypeColumnClustered

''设定图表是否有图例(Legend)
chartShow.Has%egend=false '(显示图例)
'以下为图表标题设定
chartShow.HasTitle=true  
chartShow.Title.Caption="学习成绩记录"  
set fnt=chartShow.title.font
fnt.size=13
fnt.bold=true
fnt.color="blue"

chartShow.Axes(0).HasTitle=True
chartShow.Axes(0).Title.Caption="关数"
chartShow.Axes(1).HasTitle=True
chartShow.Axes(1).Title.Caption="成绩"
chartShow.Axes(1).Title.font.size=10

chartShow.SetData chartConst.chDimCategories, chartConst.chDataLiteral, categories
chartShow.SeriesCollection(0).SetData chartConst.chDimValues, chartConst.chDataLiteral, values

chartShow.SeriesCollection(0).Interior.Color = "Red"
'chartShow.Axes(chartConst.chAxisPositionLeft).NumberFormat = "0.00%"
'chartShow.Axes(chartConst.chAxisPositionLeft).MajorUnit = 25
'chartShow.Axes(chartConst.chAxisPositionLeft).GroupingUnit=1
chartShow.Axes(chartConst.chAxisPositionValue).Scaling.Maximum=100

With chartShow.SeriesCollection(0).DataLabelsCollection.Add
            .HasValue = true
            .Font.Size = 9
           ' .Column.Color = RGB(255, 255, 0)
End With

strChartAbsPath=Server.MapPath("temp")'将图保存到当前路径下的temp文件夹。
strChartRelPath = "temp"

strChart = ExportChartToGIF(chart, strChartAbsPath, strChartRelPath,400,300)
'*****************************
'生成图片的函数
'*****************************
Function ExportChartToGIF(objCSpace, strAbsFilePath, strRelFilePath,picHigh,picWidth)

Dim strFileName

Randomize

strFileName = Timer&Rnd&".gif"

objCSpace.ExportPicture strAbsFilePath&"/"&strFileName,"gif",picHigh, picWidth 
ExportChartToGIF = strRelFilePath &"/" & strFileName

End Function
%>
<br>
<img src="<%=strChart%>" border="0" />
</body>
</html>