|
Chris Lovett
2000年10月16日张贴
2000年11月20日存档 ASP?URL=/code/sample.asp?url=/msdn-files/026/002/038/msdncompositedoc.XML"> 查看和下载本文的源代码。 你用过 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.AddSet 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 = 0while (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 = 0var 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.Addset chartseries = ChartSpace1.Charts(0).SeriesCollection(<%=j%>)chartseries.Caption = series(<%=j%>) chartseries.Line.Color = colors(<%=j%>)chartseries.SetData c.chDimCategories, c.chDataLiteral, categorieschartseries.SetData c.chDimValues, c.chDataLiteral, values<% } %>ChartSpace1.Charts(0).HasLegend = TrueChartSpace1.Charts(0).Type = c.chChartTypeLineChartSpace1.Charts(0).Axes(c.chAxisPositionLeft).MajorUnit = 25End 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-000000000046style="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> 其结果如下： | 文件 | 说明 |
|---|
| Test.htm（英文） | 显示图表的 HTML 页。如果你安装了 Internet Explorer 5.x 和 Office 2000 Web 组件，就可以查看这个图表。 | | Daily.xml（英文） | 包含错误历史记录的 XML 文件。 | | Chart.xsl（英文） | 以 XML 格式生成图表的 XSL 文件。 | | Tableview.xsl（英文） | 生成原始数据 HTML 表视图的 XSL 文件。 | | CSS技巧">CSS.css">Mycss.css（英文） | 定义 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 版权所有。保留所有权利。使用规定。
|
