利用JSP技术和Chart组件实现基于WEB的统计图表

chart|js|web|统计|图表

JSP（Java Server Pages）[1]是由Sun微系统公司于1999年6月推出的一项新技术，是基于JavaServlet以及整个java体系的Web开发技术，利用这一技术可以建立先进、安全和跨平台的动态网站。JSP 与Microsoft的ASP（Active Server Pages）技术非常相似。两者都提供在HTML 代码中混合某种程序代码、由语言引擎解释执行程序代码的能力。在ASP或JSP 环境下，HTML代码主要负责描述信息的显示样式，而程序代码则用来描述处理逻辑。ASP下的编程语言是 vb script 之类的脚本语言，而JSP 使用的是Java。

Microsoft? Office Web 组件[2]首次包含在 Microsoft? Office 2000 中。它们是用于向 Web 页添加电子表格、图表和数据处理功能的 ActiveX? 控件的集合。在使用 Microsoft? Internet Explorer 浏览包含 Office Web 组件的 Web 页时，您可以直接在 Internet Explorer 中处理显示的数据，如对数据进行排序和筛选，输入新的数值，展开和折叠明细数据，进行行列旋转以查看源数据的不同汇总信息等。Microsoft? Office Web 控件能够提供所有这些功能，共有三种 Office Web 组件：Spreadsheet 组件、Chart 组件和 PivotTable? 组件。本文将使用其中的Chart 组件。

1、JSP技术与Chart组件

JSP技术是一种在服务器端编译执行的Web设计语言，其脚本语言采用Java，完全继承了Java的所有优点。它能将网页的动态部分与静态部分有效分开，你只要用任何一种你熟悉的网页制作工具，编写规则的HTML，然后通过JSP标记（tag）[3]将动态部分包含进来就可以了,tag绝大部分是以"<%"开始，以"%>"结束的。

Chart组件是 Microsoft Office 使用的数据绑定 ActiveX 控件，用于向 Web 页添加图表功能。我们在安装微软的Office 2000时会缺省安装一个组件Office Web Components，Chart组件就含在这个组件中，对应的文件是msowc.dll。

2、实现实例

本文的运行环境是：Jbuilder7＋Oracle8i，同时运用了JAVABEAN技术来实现与Oracle数据库的连接[4]。

下面的程序graph.jsp实现了从数据库中读出一段时间内内燃机车和电力机车的数值，然后用统计图表显示，用户可以选择图形方式。(以下斜体部分为JSP代码)

<%@page contentType="text/html;charset=gb2312" %>

<%@ page import="java.sql.*,java.io.*,java.util.*,java.util.Date"%>

<jsp:useBean id="zzjwbean" scope="page" class="jsp.zzjw"/>

<!-- 用JAVABEAN实现与数据库连接（本段代码略） -->

<%

/*变量定义略*/

/*获得查询的年,月,起始日期,即: year,month,f_gk_startdate和截至日期f_gk_enddate，本段代码略*/

%>

<html>

<head>

<title>

</title>

<form name=fm action="" method="post">

</form>

<body bgcolor="#DAFAFC">

<script language="vb script">

sub window_onload()

Dim categories(34) '将横坐标的值赋给vb script环境下的数组categories

Dim values(34) '将纵坐标的值赋给vb script环境下的数组values

<%

i = 0;

rs = zzjwbean.executeQuery("select * from T_zzj_dw"); /*获得单位名称*/

while(rs.next())

{

%>

categories(<%=i%>)=<%="\""+rs.getString("f_fjmc")+"\""%>

<%

i++;

}

%>

ChartSpace1.Charts.Add‘将图表添加到图表工作区中

'将变量c设置为 Constants 属性所返回的对象, 因为在 vb script 中不能使用已命名的常量

Set c = ChartSpace1.Constants

ChartSpace1.Charts(0).hastitle=true '图表有标题

ChartSpace1.Charts(0).Title.Font.Name = "仿宋_GB231280" '标题字体

ChartSpace1.Charts(0).Title.Font.size=11 '标题字体大小

ChartSpace1.Charts(0).Title.Font.color="blue" '标题字体颜色

ChartSpace1.Charts(0).Title.caption="<%=year%>年<%=month%>月机车概况月报表统计图" '标题内容

ChartSpace1.Charts(0).HasLegend = True '指定图表具有图例

'指定图表的图形方式为列状图

ChartSpace1.Charts(0).type=c.chChartTypeColumnClustered

'给图表赋横坐标的值

ChartSpace1.Charts(0).SetData c.chDimCategories, c.chDataLiteral,categories

'系列0对应内燃机车统计数值

ChartSpace1.Charts(0).SeriesCollection(0).Caption="内燃机车统计" '系列0的图例

'将内燃机车统计的值赋给vb script环境下的数组values

<%

i = 0;

rs1 = null;

f_fjbm = "";

rs = zzjwbean.executeQuery("select * from T_zzj_dw");

while(rs.next())

{

f_fjbm = rs.getString("f_fjbm");

rs1 = zzjwbean.executeQuery("select sum(f_jc_nrhj) from T_jccwygk where f_jccwy_fj='"+f_fjbm+"' and f_date>='"+f_gk_startdate+"' and f_date<='"+f_gk_enddate+"'");/*统计数据*/

if(rs1.next())

{

%>

values(<%=i%>)=<%=rs1.getInt(1)%>

<%

i++;

}

}

%>

'将内燃机车统计的值赋给图表的系列0

ChartSpace1.Charts(0).SeriesCollection(0).SetData c.chDimValues, c.chDataLiteral, values

ChartSpace1.Charts(0).SeriesCollection.Add '向图表中添加系列1

ChartSpace1.Charts(0).SeriesCollection(1).Caption="电力机车统计" '系列1的图例

'将电力机车统计的值赋给vb script环境下的数组values

<%

i = 0;

rs1 = null;

f_fjbm = "";

rs = zzjwbean.executeQuery("select * from T_zzj_dw");

while(rs.next())

{

f_fjbm = rs.getString("f_fjbm");

rs1 = zzjwbean.executeQuery("select sum(f_jc_dlhj) from T_jccwygk where f_jccwy_fj='"+f_fjbm+"' and f_date>='"+f_gk_startdate+"' and f_date<='"+f_gk_enddate+"'");

if(rs1.next())

{

%>

values(<%=i%>)=<%=rs1.getInt(1)%>

<%

i++;

}

}

%>

'将电力机车统计的值赋给图表的系列1

ChartSpace1.Charts(0).SeriesCollection(1).SetData c.chDimValues, c.chDataLiteral, values

'指定纵坐标轴有标题，并赋值，然后指定数据的显示格式

ChartSpace1.Charts(0).axes(c.chAxisPositionLeft).hastitle=true

ChartSpace1.Charts(0).axes(c.chAxisPositionLeft).title.Font.Name = "黑体"

ChartSpace1.Charts(0).axes(c.chAxisPositionLeft).title.Font.size = 11

ChartSpace1.Charts(0).axes(c.chAxisPositionLeft).title.caption="机车合计(台数)"

ChartSpace1.Charts(0).Axes(c.chAxisPositionLeft).NumberFormat = "0.##"

'指定横坐标轴有标题，并赋值

ChartSpace1.Charts(0).axes(c.chAxisPositionBottom).hastitle=true

ChartSpace1.Charts(0).axes(c.chAxisPositionBottom).title.Font.Name = "黑体"

ChartSpace1.Charts(0).axes(c.chAxisPositionBottom).title.Font.size = 12

ChartSpace1.Charts(0).axes(c.chAxisPositionBottom).title.caption="郑州局机车概况月报表"

end sub

'根据用户选择的图形方式，改变图表的形状

sub dd_onchange()

ChartSpace1.Charts(0).type=dd(dd.selectedIndex).value

end sub

</script>

</head>

<body>

<select name="dd" size="1">

<option value="0" selected>列状图</option>

<option value="3">栏状图</option>

<option value="6">平滑曲线图</option>

<option value="18">饼行图</option>

<option value="29">面积图</option>

</select>

<!-- 创建一个图表工作区对象, 名为“ChartSpace1” -->

<p>

<object id=ChartSpace1 classid=CLSID:0002E500-0000-0000-C000-000000000046 codebase="msowc.dll" style="width:100%;height:350">

</object>

</p>

</body>

</html>

时间： 2024-10-23 05:36:05

利用JSP技术和Chart组件实现基于WEB的统计图表的相关文章

[请教] 如何使用jawin.jar 在jsp中嵌入OWC组件(微软Office Web)?

问题描述 如题,在网上看到有些文章上写用jawin.jar可以驱动Windows的dll文件库,但是都不详细,我现在主要目的是想在jsp页面中嵌入一个office的OWC组件,做数据筛选用的,哪位朋友清楚的话,麻烦帮帮我,感谢!!

利用Ajax技术写一个迷你留言板WEB控件

ajax|web|控件 初学Ajax不久,自己写个小东西,以作学习日记留言板图片如下: 样例地址:http://www.8dao.net/miniguest/ 首先,这里用的是Access数据库,便于移动.数据库很简单,表Guest,字段有ID,Name,Content 要实现Ajax,利用asp.net ajax 1.0 bate是很方便的,在http://ajax.asp.net可以下载到.安装好后打开VS2005,新建一个ASP.net AJAX Enabled Web Site项目在里面

基于JSP技术的数据库连接

js|数据|数据库|数据库连接     相对于基于传统的Client/Server模式的数据库系统,Web数据库系统采用三层浏览器/服务器结构(即网络浏览器/Web服务器/数据库服务器结构),具有极大的优势.Web数据库系统充分发挥了DBMS高效的数据存储与管理能力,以B/S模式为平台,将客户端统一为Web浏览器,为用户提供使用简便.内容丰富的数据库服务,已经成为Internet和Intranet提供的核心服务,为Internet上的电子商务提供技术支持.Web数据库系统的关键技术是Web与数据

利用JSP建立Web站点

js|web|站点 JSP是由Sun微系统公司于1999年6月推出的一项技术,是基于JavaServlet以及整个java体系的Web开发技术,利用这一技术可以建立先进.安全和跨平台的动态网站. JSP 与ASP非常相似.两者都提供在HTML 代码中混合某种程序代码.由语言引擎解释执行程序代码的能力.在ASP或JSP 环境下,HTML代码主要负责描述信息的显示样式,而程序代码则用来描述处理逻辑.ASP下的编程语言是 VBScript 之类的脚本语言,而JSP 使用的是Java. TRS及其Jav

如何利用JSP建立Web站点

JSP 与ASP非常相似.两者都提供在HTML 代码中混合某种程序代码.由语言引擎解释执行程序代码的能力.在ASP或JSP 环境下,HTML代码主要负责描述信息的显示样式,而程序代码则用来描述处理逻辑.ASP下的编程语言是 VBScript 之类的脚本语言,而JSP 使用的是Java.   TRS及其JavaBeans   TRS系统是国际上第一个采用"并行计算"算法的中文全文检索系统,其全文检索引擎可以提供关系型数据库所没有的性能,并可与关系数据库协同使用:因为TRS可对文本内容建立

利用JSP建立Web站点_JSP编程

JSP是由Sun微系统公司于1999年6月推出的一项技术,是基于JavaServlet以及整个java体系的Web开发技术,利用这一技术可以建立先进.安全和跨平台的动态网站.JSP 与ASP非常相似.两者都提供在HTML 代码中混合某种程序代码.由语言引擎解释执行程序代码的能力.在ASP或JSP 环境下,HTML代码主要负责描述信息的显示样式,而程序代码则用来描述处理逻辑.ASP下的编程语言是 VBScript 之类的脚本语言,而JSP 使用的是Java.TRS及其JavaBeansTRS系统是

什么是 JSP 技术?

js JavaServer Pages (JSP) 技术提供了一种简单快速的方法来创建显示动态生成内容的 Web 页面.由业界处于领先地位的 Sun 公司制定了相关的 JSP 技术规范,该规范定义了如何在服务器和 JSP 页面间进行交互,还描述了页面的格式和语法.  JSP 技术的工作原理? JSP 页面使用 XML 标签和 scriptlets(一种使用 Java 语言编写的脚本代码),封装了生成页面内容的逻辑.它将各种格式的标签(HTML 或者 XML)直接传递回响应页面.通过这种方式,JS

用JSP实现基于Web的RSS阅读器

js|rss|web 一: RSS介绍 根据维基百科(http://zh.wikipedia.org/wiki/RSS)的定义,"RSS是一种用于共享新闻和其他Web内容的数据交换规范 ",它是一系列的规范的组合,采用XML格式.目前国内RSS应用最多的是在新闻网站和博客网站上. 许多网站可以用RSS阅读器来个性化自己的网页,比如显示最新的新浪新闻,显示自己好朋友最新的博客文章,显示最新的Google论坛内容.除此之外,利用RSS阅读器还可以实现其它用途,比如: 获得天气预报 接收邮件

Jsp学习笔记（一）！-------理解Jsp技术！

js|笔记 1 利用jsp技术,一个用户可以将一个http请求发送到一个可执行程序而不是一个静态的html文件.服务器将会立即运行这个限定的程序,对用户的输入作出反应,将处理结果返回客户端,或者对数据的记录进行更改.通过这个模型,就可以在服务器和客户之间有效的进行交互.2 Jsp技术的原理是:利用MsSql,Oracle等海量数据库系统作为数据仓库,用Servlet的高性能服务端程序作为后台总控程序,Jsp程序在前台运行,Servlet接受用户的输入,分别调用不同的Jsp程序向客户端反馈信息.J