Chris Lovett
2000年10月16日张贴
2000年11月20日存档
 查看和下载本文的源代码。
你用过 Office Web 组件吗？最近我经历了一件十分有趣的事 — 在这里介绍给大家，因为我认为它很好地说明了 XML 与面向对象的 API 之间的区别。
我正在编写一些 Active Server Pages (ASP) 代码，以便将我们小组修改错误的进度制成图表。我们有一个 SQL Server 数据库，其中包括所有的错误，这些错误分配给谁来处理、何时打开、解决或关闭它们，以及它们当前的状态。 
我们的 SQL Server 数据库保留的历史记录不足以生成这样的图形，所以我还得创建一个 XML 文件，用于缓存每日对数据库进行查询的结果。这样，根据该 XML 文件，我就可以生成这样的图形。这个 XML 文件也是一个 ListEditor（英文）文件，因此可以使用数据库外部的其它信息，如要修改错误的目标数（即上面图表中的黑线），直接对它进行编辑。
该 XML 文件中包括的各项如下所示： <item>
<id>32</id><date>8/31/2000</date>
<target>146</target><active>167</active>
<dev>69</dev><pm>19</pm><test>1</test><ue>58</ue>
<resolved>484</resolved>
<rdev>15</rdev><rpm>36</rpm><rtest>396</rtest><rue>0</rue>
<in>33</in><out>36</out>
</item>
初次尝试
我研读了 MSOWCVBA.CHM 中记录的 Office 2000 Web 图表组件 API，发现可以通过多种输入源来生成图表，这些输入源包括数组、字符串、记录集和电子数据表。我浏览了那些示例，确定使用数组是最简便的方式。
于是，我编写了一套 ASP 代码，用于生成客户端 JScript 代码，以便通过这些数组生成图表。这种 ASP 代码如下所示： <object id=ChartSpace1 classid=CLSID:0002E500-0000-0000-C000-000000000046 style="width:100%;height:350"></object>
<script language=vbs>
Sub Window_OnLoad()
' 对于不同图表系列要使用的颜色。
Dim colors(10)
colors(0) = "black"
colors(1) = "blue"
colors(2) = "red"
colors(3) = "green"
colors(4) = "magenta"
colors(5) = "orange"
colors(6) = "brown"
colors(7) = "gray"
colors(8) = "purple"
colors(9) = "yellow"
colors(10) = "lightgreen"
ChartSpace1.Charts.Add
Set c = ChartSpace1.Constants
' 创建描述每个系列的字符串的数组。
<% var xpath = "//Schema/ElementType/element[@view = '']"
var nodes = doc.selectNodes(xpath);%>
Dim series(<%=nodes.length%>)
<%
var series = new Array()
var node = nodes.nextNode();
i = 0
while (node != null) {
var name = node.getAttribute("type");
if (name != "id" && name != "date") {
series[i] = name;
%>
series(<%=i%>) = "<%=name%>"
<% i++;
}
node = nodes.nextNode();
}%>
' 现在获取各类别的名称。
Dim dates()
<% nodes = doc.selectNodes("//item/date");%>
Dim categories(<%=nodes.length%>)
<%
k = 0
var node = nodes.nextNode();
while (node != null) {
d = node.text.substr(0,node.text.length-5)
%> categories(<%=k%>) = "<%=d%>"
<%
k = k + 1
node = nodes.nextNode();
}%>
' 现在获取每个系列的值。
<%
var values = new Array();
for (j = 0; j < i; j++)
{
name = series[j];
nodes = doc.selectNodes("//item[date]");%>
Dim values(<%=k%>)
<%
x = 0
first = true
var node = nodes.nextNode();
while (node != null) {
var child = node.selectSingleNode(name);
if (child && child.text != "") {
values[x] = parseInt(child.text);%>
values(<%=x%>) = <%=child.text%>
<%
first = false;
} else if (first) {
values[x] = 0;%>
values(<%=x%>) = 0
<% }
x = x + 1;
node = nodes.nextNode();
} %>
ChartSpace1.Charts(0).SeriesCollection.Add
set chartseries = ChartSpace1.Charts(0).SeriesCollection(<%=j%>)
chartseries.Caption = series(<%=j%>)
chartseries.Line.Color = colors(<%=j%>)
chartseries.SetData c.chDimCategories, c.chDataLiteral, categories
chartseries.SetData c.chDimValues, c.chDataLiteral, values
<% } %>
ChartSpace1.Charts(0).HasLegend = True
ChartSpace1.Charts(0).Type = c.chChartTypeLine
ChartSpace1.Charts(0).Axes(c.chAxisPositionLeft).MajorUnit = 25
End Sub
</script>
我并不特别喜欢这种解决方案，因为维护 ASP 代码简直太困难了。我对它做了一些改动，这样它可以生成一个 HTML 页，将 XML 下载到客户机，并完全在客户端生成图表。这样还能够为我的 Web 服务器分担一部分负载。
所有事情都进行得很顺利，但是到了为 API 本身制作图表的时候，我却遇到了巨大的障碍。如果你常常使用 Excel 图表，那么你可能看到过一些很棒的组合图表 — 可以在同一图表上显示两条刻度不同的纵轴，如果你仔细观察上文中显示的图表，就会发现这正是我想要实现的。我将图表设定为：线条使用左边的纵轴，其最大刻度为 700；条形则使用右边的纵轴，其最大刻度为 160。结果表明使用 Office 2000 Web 组件中的图表制作 API 无法生成这样的图表。我被难住了，于是给 Office 工作人员发了一封电子邮件，向他们询问是否有什么变通的方法。
Office 的工作人员告诉我，ChartSpace 对象有一个极好的 XmlData 属性，它可以为我生成的图表返回完全的 XML 格式。而我需要做的只是稍稍调整一下 XML，以便在右边的轴上插入另一种刻度，用 XML 的修正版设置 XmlData 属性，瞧，右边的轴就设好了！
该 XML 的格式如下所示： <xml xmlns:x="urn:schemas-microsoft-com:office:excel">
<x:WebChart>
<x:OWCVersion>9.0.0.2710</x:OWCVersion>
<x:Width>20664</x:Width>
<x:Height>9260</x:Height>
<x:Chart>
<x:PlotArea>
<x:Interior>
<x:Color>#F0F0F0</x:Color>
</x:Interior>
<x:Graph>
<x:Type>Line</x:Type>
<x:SubType>Standard</x:SubType>
<x:Series>
<x:Line>
<x:Color>............</x:Color>
</x:Line>
<x:Caption>
<x:DataSource>-1</x:DataSource>
<x:Data>............</x:Data>
</x:Caption>
<x:Index>2</x:Index>
<x:Category>
<x:DataSource>-1</x:DataSource>
<x:Data>............</x:Data>
</x:Category>
<x:Value>
<x:DataSource>-1</x:DataSource>
<x:Data>............</x:Data>
</x:Value>
</x:Series>
...
注意：对于这种编写方式，Office 工作人员不承诺支持这种 XML 格式，因为这种格式可能会发生变化。
使用 XSL/T 应急
我将它们两两放在一起，结果发现我根本不需要所有那些代码。只需要一个简洁的 XSL 样式表，它是根据我真正需要的图表的 XML 显示方式生成的。该 XSL 样式表可以插入我需要的数字，这些数字来自我的小 XML 文件。
客户端代码变得十分简洁： <HTML>
<object id=ChartSpace1 classid=CLSID:0002E500-0000-0000-C000-000000000046
style="width:100%;height:350"></object>
<xml id="XmlDoc" src="daily.xml"></xml>
<xml id="Xsl" src="chart.xsl"></xml>
<script for=window event=onload>
ChartSpace1.XMLData = XmlDoc.transformNode(Xsl.XMLDocument);
</script>
</HTML>
其结果如下：
结论
上述情况说明了什么？用紧密绑定的、面向对象的 API 处理图表功能更强大、更丰富，超过了我的应用程序的要求。
高性能的制作图表 API 遇到了巨大的困难，它无法在多个坐标轴上设置不同的刻度。开发高性能的、紧耦合的 API 成本高昂，需要花费大量的精力和时间，而且 API 测试也很困难。试想一下对几十个类和几百个方法测试所有的调用顺序，这几乎是不可能的，因此本文介绍的这种重要功能就很必要。
我并不需要一个动态的图表，只需要一个由简单的 XML 生成的简单图表 — 除了数据以外，这种 XML 不会随时间发生太大的变化。
幸运的是，应用程序提供了松耦合的、技术要求低的 XML 格式。这种 XML 格式抛开所有 API 内容，使你能够直接访问每一个构成实际图表的数据。它使你可以进入图表的内部，根据需要进行任何调整。
这种方法的代价是：现在的粒度更粗了。你不能以毫秒为单位改变线条的颜色，也不能按消息的频度改变线条的宽度。但是，结果表明，这种较粗的粒度对于 Office Web 图表组件的多数基于 Web 的应用程序恰到好处。
关于松耦合、粗粒度的 XML API 如何还能够在两个组件间（这里是 Office Web 图表组件与我的 ASP 应用程序）实现更深入的集成，这是一个很好的例子，因为它绕开了可能产生妨碍的面向对象的接口。这里假设你的组件的 XML 格式设计良好，而且 XML 格式中提供了所有功能。
生成你的组件的 XML 界面所需的成本也要低得多。因为它不需要剖析调用顺序测试矩阵。它只是按一种具体的架构接受 XML — 若 XML 不符合该架构，就会被拒绝。你必须测试大量不同的 XML 输入，但比起通过功能齐备的 API 测试所有可能的调用顺序，这种工作量还是小多了。
请不要误解我，我喜欢对象，也喜欢功能齐备的 API — 因为我毕竟是个程序员。但是很多情况下，功能齐备的 API 矫枉过正，因此现在观念上已发生转变 — 客户在要求组件间更深入集成的同时，也追求简单易用，而 XML 就能解决这个问题。
Chris Lovett是 Microsoft 的 XML 小组的编程经理。
存档的 Extreme XML 专栏
请以 IE4.0 以上版本 800 * 600 浏览本站
©2001 Microsoft Corporation 版权所有。保留所有权利。使用规定。
|
本类阅读TOP10