首页 | 新闻 | 新品 | 文库 | 方案 | 视频 | 下载 | 商城 | 开发板 | 数据中心 | 座谈新版 | 培训 | 工具 | 博客 | 论坛 | 百科 | GEC | 活动 | 主题月 | 电子展
返回列表 回复 发帖

一个用户触手可及的 XPages Web 图表控件(5)

一个用户触手可及的 XPages Web 图表控件(5)

用 Dojo 展现 Domino 统计图的示例示例应用介绍如图 1,一个在软件测试中记录 bug 的 Domino 视图,该视图显示了每一条 bug 文档的“日期”、“作者”、“状态”、“主要描述”等信息。其中第二列是测试经理添加的计算列,根据原来文档的“状态”信息计算出 bug“是否有效”。现在的需求是,经理希望将“有效”和“无效”bug 的百分比以图表的形式展现。
图表生成过程针对这个需求,选择 Dojo 的饼图来展现。
正如我们之前介绍的,首先,分析展现这个饼图需要用到的数据是:“有效”和“无效”bug 的百分比。我们需要得到“有效 bug 的数量”,“无效 bug 的数量”,作为附加的信息,当用户鼠标悬浮到饼图上时,需要“有效 bug 的百分比文字”和“无效 bug 的百分比文字”。
第二步,根据饼图的 JSON 格式,写出所需的字符串形式:[{y: n1, text: "Valid", tooltip: "Valid is p1"},{y: n2, text: "Invalid", tooltip: "Invalid is p2"}]。
第三步,JSON 数据来源于服务器端 Javascript 函数的输出,因此,编辑一个服务器端 Javascript 函数,用来调用 Java 函数读取 Domino 数据。为了使代码具有可扩展性,方便复用,我们以参数的形式传递 Domino 视图的名称和需要统计的列序号。在 Java 函数中,一方面要获得 Domino 数据,另一方面还需要将 Domino 的数据转换成所需的 JSON 字符串。
第四步,在页面中定义一个 XPages“计算域”用来存储服务器端 Javascript 函数输出的数据,这样,这些数据才可以在客户端的 Javascript 中使用。
第五步,在页面中定义一个 DIV 对象,指定它的 id。并且引入 Dojo 包。
第六步,编辑客户端 Javascript 函数,绑定 Dojo 对象和它的 JSON 数据。
至此,一个用 Dojo 饼图展现的“有效”和“无效”bug 的百分信息可得。
图 5. 示例效果图
返回列表