`
lauphai
  • 浏览: 22947 次
  • 性别: Icon_minigender_1
  • 来自: 北京
文章分类
社区版块
存档分类
最新评论

画图jsp

JSPzkSQLJavaAjax 
阅读更多 

<%@ page import="java.text.DateFormat,java.text.ParseException,java.text.SimpleDateFormat,tools.*"%>
<%@page import="java.sql.Connection,java.sql.DriverManager,java.sql.PreparedStatement,java.sql.ResultSet,java.sql.SQLException,java.util.ArrayList,java.util.Date"%>
<%@ page import="java.util.Calendar"%>
<%@ page contentType="text/html; charset=gb2312"%> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<% 
request.setCharacterEncoding("gb2312");

String bt = request.getParameter("bt");
String et = request.getParameter("et");

long ltoday = System.currentTimeMillis();
long lyesday = ltoday-24*60*60*1000l;
long l7day = ltoday-7*24*60*60*1000l;
java.sql.Timestamp todaytimes = new java.sql.Timestamp(ltoday);
java.sql.Timestamp yesdaytimes = new java.sql.Timestamp(lyesday);
java.sql.Timestamp day7times = new java.sql.Timestamp(l7day);
String day7 = day7times.toString().substring(0,10).replace("-","");
//昨天日期
String yesteday = yesdaytimes.toString().substring(0,10).replace("-","");
//今天日期
//String today = todaytimes.toString().substring(0,10).replace("-","");

if(bt==null) bt=day7;
if(et==null) et=yesteday;


//画图
String sql_chart = "select date_format(logday,'%Y-%m-%d') as logday,sum(u_1) as u_1,sum(u_2) as u_2,pt,p_type,pubid from T_CLIENT_STAT_DAY where (p_type=6 or p_type=1 or p_type=8) and date_format(logday,'%Y%m%d')='"+todaytimes.toString().substring(0,10)+"' group by date_format(logday,'%Y%m%d'),p_type order by p_type,date_format(logday,'%Y%m%d')";

// 时间轴
StringBuffer dlist = new StringBuffer();
// 时间
if(bt!=null && et!=null)
{
	// 画图
	sql_chart = "select date_format(logday,'%Y-%m-%d') as logday,sum(u_1) as u_1,sum(u_2) as u_2,pt,p_type,pubid from T_CLIENT_STAT_DAY where (p_type=6 or p_type=1 or p_type=8) and date_format(logday,'%Y%m%d')<='"+et+"' and date_format(logday,'%Y%m%d')>='"+bt+"' group by  date_format(logday,'%Y%m%d'),p_type order by p_type,date_format(logday,'%Y%m%d') ";
		
}

Connection conn_tv = null;
PreparedStatement stmt_chart = null;
ResultSet rs_chart = null;
 
try {
		conn_tv = getConnection();
		
		// 画图
		stmt_chart = conn_tv.prepareStatement(sql_chart);
		rs_chart = stmt_chart.executeQuery();
		
		ArrayList<String> l_ydt_u_1 = new ArrayList<String>();
		
		StringBuffer bf_ydt_u_1 = new StringBuffer();
		ArrayList<String> timelist = new ArrayList<String>();
		while (rs_chart.next())
		{ 
			if(!timelist.contains(rs_chart.getString("logday")))
			{
				timelist.add(rs_chart.getString("logday"));
			}
			switch(Integer.parseInt(rs_chart.getString("p_type")))
			{
			case 6:
				l_ydt_u_1.add(rs_chart.getString("u_1"));
				l_ydt_u_2.add(rs_chart.getString("u_2"));
				break;
			case 1:				
				l_zk_u_1.add(rs_chart.getString("u_1"));
				l_zk_u_2.add(rs_chart.getString("u_2"));
				break;
			case 8:
				l_news_u_1.add(rs_chart.getString("u_1"));
				l_mews_u_2.add(rs_chart.getString("u_2"));
				break;
			}
		}
		
		dlist.append("[");
		//out.print(timelist.size());
		for (int i = 0; i < timelist.size(); i++)
		{
			dlist.append(timelist.get(i).toString().substring(8,10));
			if (i < (timelist.size()-1)) 
			{
				dlist.append(",");
			}
		}
		dlist.append("]");
		//out.print(dlist+"<br/>");
		
		bf_ydt_u_1.append("[");

		for (int i = 0; i < l_ydt_u_1.size(); i++) 
		{
			bf_ydt_u_1.append(l_ydt_u_1.get(i));
				if (i < (l_ydt_u_1.size()-1)) 
				{
					bf_ydt_u_1.append(",");
				}
		}
		bf_ydt_u_1.append("]");
		
%>



</title>
 <link href="style/style.css" rel="stylesheet" type="text/css" />
<!-- 1. Add these JavaScript inclusions in the head of your page 
<script type="text/javascript" src="js/modules/jquery.min.js"></script>
 -->
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/highcharts.js"></script>
<script type="text/javascript" src="js/modules/exporting.js"></script>

<script type="text/javascript">
			var chart;
			var date_d = <%=dlist%>;
			var v_name_new = '用户数';
			var v_name_act = '活跃数';
			var u_1 = <%=bf_ydt_u_1%>;
			  function changechart(i){
            	switch(i){
            	case 1:
            		v_name_new = '111';
            		u_1 = <%=bf_ydt_u_1%>;
					u_2 = <%=bf_ydt_u_2%>;
					chart = new Highcharts.Chart({chart: {renderTo: 'container_new',defaultSeriesType: 'line'},
				title: {text: v_name_new},
				xAxis: {categories: date_d,title: {text: "日期/天"}},
				yAxis: {title: {text: ''}},
				tooltip: {formatter: function() {return '<b>'+ this.series.name +'</b><br/>'+this.x +'号: '+ this.y ;}},
				legend: {layout: 'vertical',align: 'right',verticalAlign: 'top',x: -10,y: 100,borderWidth: 0},
				series: [{name: '新增用户数',data: u_1}]});
            		break;
            	case 2:
            		v_name_new = '222';
            		u_1 = <%=bf_zk_u_1%>;
					u_2 = <%=bf_zk_u_2%>;
					chart = new Highcharts.Chart({chart: {renderTo: 'container_new',defaultSeriesType: 'line'},
				title: {text: v_name_new},
				xAxis: {categories: date_d,title: {text: "日期/天"}},
				yAxis: {title: {text: ''}},
				tooltip: {formatter: function() {return '<b>'+ this.series.name +'</b><br/>'+this.x +'号: '+ this.y ;}},
				legend: {layout: 'vertical',align: 'right',verticalAlign: 'top',x: -10,y: 100,borderWidth: 0},
				series: [{name: '新增用户数',data: u_1}]});
            		break;
            	case 3:
            		v_name_new = '333';
            		u_1 = <%=bf_news_u_1%>;
					u_2 = <%=bf_news_u_2%>;
					chart = new Highcharts.Chart({chart: {renderTo: 'container_new',defaultSeriesType: 'line'},
				title: {text: v_name_new},
				xAxis: {categories: date_d,title: {text: "日期/天"}},
				yAxis: {title: {text: ''}},
				tooltip: {formatter: function() {return '<b>'+ this.series.name +'</b><br/>'+this.x +'号: '+ this.y ;}},
				legend: {layout: 'vertical',align: 'right',verticalAlign: 'top',x: -10,y: 100,borderWidth: 0},
				series: [{name: '新增用户数',data: u_1}]});
            		break;
            	}
            }
            
		</script>
<script type="text/javascript" src="js/highslide-full.min.js"></script>
<script type="text/javascript" src="js/highslide.config.js" charset="utf-8"></script>
<link rel="stylesheet" type="text/css" href="css/highslide.css" />
<script type="text/javascript"> 
var example = 'line-ajax',
	theme = 'grid';
</script>


</head>

<body>

<!-- 框架:最外层DIV start-->
<div style="width:100%;">

<!-- 第1层 查询1 DIV start -->
<div>
	<table width="100%" border="0" class="xian" >
		<form id="fm_ver" name="fm_ver" method="get"  action="chart.jsp" onSubmit="return check();">
		<tr>
			<td height="30" valign="middle" bgcolor="#367DC9" class="txt3">&nbsp;<font face="微软雅黑">数据图形</font>：<span class="txt1">
			<span class="txt1">&nbsp;从&nbsp;<input size="8" type="text" name="bt" style="border:1px solid #999;" onclick="fPopCalendar(event,this,this)" onfocus="this.select()" readonly="readonly" class="text ui-widget-content ui-corner-all" value="<%=bt==null?yesteday:bt%>"/>
				到&nbsp;<input size="8" type="text" name="et" style="border:1px solid #999;" onclick="fPopCalendar(event,this,this)" onfocus="this.select()" readonly="readonly" class="text ui-widget-content ui-corner-all" value="<%=et==null?yesteday:et%>"/>
				&nbsp;<input type="submit" value="查 询" />&nbsp;<a href="/client/chart.jsp"><font style="font-size:15px;" face="微软雅黑"><b/>复位</b></font></a>
			</span></td>
			</tr>
			</tr>
			 
		</form>
	</table>
<div>
<!-- 第1层 查询1 DIV end -->

<!-- 空行 -->
<table><tr height="2"><td></td></tr></table>

<!-- 第3层 DIV start -->
<div>
<!-- 画图 -->
	<table border="0" cellpadding="0" cellspacing="0" width="100%">
		<tr>
			<td align="left" width="60%"><img src="images/chart2.gif" width="117" height="19" /></td>
			<td align="right" style="font-size:12px;"><font color="#367DC9">按平台:</font>
			<img src="images/jiao2.gif" width="6" height="5" /><a href="javascript:changechart(6);" >1111</a>&nbsp;&nbsp;
			<img src="images/jiao2.gif" width="6" height="5" /><a href="javascript:changechart(7);" >2222</a>&nbsp;&nbsp;
			<img src="images/jiao2.gif" width="6" height="5" /><a href="javascript:changechart(8);" >3333</a>&nbsp;&nbsp;
			</td>
			<td align="right" style="font-size:12px;"><font color="#367DC9">按用户数:</font>
			<img src="images/jiao2.gif" width="6" height="5" /><a href="javascript:changechart(5);" >活跃用户数</a>
			</td>
		</tr>
	</table>
	<table border="1" cellpadding="0" cellspacing="0" width="100%">
		<tr>
			<td>
			<!-- 3. Add the container_act -->
			<div id="container_act" style="width: 100%; height: 250px; margin: 0 auto"></div>
			</td>
		</tr>
	</table>
<div>
<!-- 第3层  DIV end -->

</div>
<%
	} catch (Exception e) {
		e.printStackTrace();
	}finally{
		// 画图
		if (rs_chart != null) {
			try {
				rs_chart.close();
				rs_chart = null;
			} catch (SQLException e) {
				rs_chart = null;
			}
		}
		if (stmt_chart != null) {
			try {
				stmt_chart.close();
				stmt_chart = null;
			} catch (SQLException e) {
				e.printStackTrace();
				stmt_chart = null;
			}
		}
		if (conn_tv != null) {
			try {
				conn_tv.close();
				conn_tv = null;
			} catch (SQLException e) {
				e.printStackTrace();
				conn_tv = null;
			}
		}
	}
%>

</body>
</html>
分享到：
| 时间选择js
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    JSP画图程序简介

    文档中包含了用java画图的程序代码，在jsp环境中进行过测试没有问题

    jsp写的画图小程序，

    jsp写的画图小程序，角斗士大奖赛饿爱的 爱的饿的

    在jsp中用awt类来画图

    可以模仿此例子来画自己喜欢的图像，也可以画自己的扑克牌。

    JSP的两种设计模式 Model1和Model2

    ML文件解析 系统在工作时，需要配置文件信息（XML），但是，一般情况下，系统会在初始化的时候，一次将配置文件中的信息加载到内存中，用系统定义的配置对象来封装。所谓配置对象就是专门的用于封装配置信息的对象，...

    图画和文字并交jsp教程

    学习实例，图画和文字并用，想了解的快下下来看看吧

    jsp检测内存，并绘制曲线图.rar

    jsp检测内存，并绘制曲线图，画图程序，基于JSP环境，生成直方图的程序代码，一个检测JSP服务器内存的Ajax程序，动态显示服务器上的数据，并且一图像的方式直观显示数据。

    JFreeChart画图

    用JFreeChart设计各种基于java的图形界面，如曲线图，柱状图，折线图，甘特图等，并且在JSP页面显示

    jsp统计图（xml解析数据）

    习惯了使用Office Web Component(OWC)，Report Viewer控件，以及GDI+进行绘制图标，下面介绍下可以生成图表更生动的FusionCharts Free画图，它可以更简洁地与用户进行交互，更重要的是，这基本上是一个完全免费的...

    js控制图片的翻转 放大 缩小 还原 调用window画图

    js控制图片的翻转 放大 缩小 还原 调用window画图js控制图片的翻转 放大 缩小 还原 调用window画图

    论文:JSP绘图聊天室系统设计与实现.nh

    本设计通过综合使用JAVA网络编程技术，JAVA的Applet技术，JSP技术， JavaBean，JavascriPt以及数据库访问技术来完整构建一个网络聊天室系统项 目，从而进一步研究web项目开发的系统分析过程，通过与相关的编程技术相...

    超市进销存管理系统(SSM,MYSQL,VUE,JSP)

    超市管理系统(JAVA,SSM,JSP,MYSQL)(毕业论文12360字...（1）系统架构设计：主要写系统所使用的架构，画图说明。 （2）系统功能模块设计：主要写出系统主要的功能模块。 （3）系统工作流程设计：主要写系统工作运行流程

    js 画图--简单的直线图

    NULL 博文链接：https://wrong1111.iteye.com/blog/475350

    java 画图jfreechart

    java 画图jfreechart.JFreeChart是JAVA平台上的一个开放的图表绘制类库。它完全使用JAVA语言编写，是为applications, applets, servlets 以及JSP等使用所设计。JFreeChart可生成饼图（pie charts）、柱状图（bar ...

    JFreeChart画图 饼状图 单组柱状图 多组柱状图 堆积柱状图 折线图

    这个是我特地开发的一个用JFreeChart开发的用来画图的项目，已经开发成形了各种项目的各种需求的项目，并且自己可以拓展，根据需求修改代码，完成项目的需要。 可以直接下载解压后，import到myeclipse里面，运行： ...

    web 绘图插件

    利用易方数码笔 在web中绘图, 用于远程主观题考试，判卷。

    JS画UML图工具MyGraph整合例子

    因工作需求，从网上下载了MyGraph的源代码，与本地一个例子做了一个demo，目前已实现UML图形编辑、本地打开、保存功能（google浏览器已测） ...http://localhost:8080/Student/stuMngr/mygraph.jsp 即可使用

    jspchart_java_shorter3ah_

    jsp检测内存，并绘制曲线图，画图程序，基于JSP环境，生成直方图的程序代码

    工作流设计器工作流设计器

    多比图形控件是一款基于Web的矢量图形控件， 类似于网页上的Visio控件，是目前国内外最佳的基于web的工作...工作流设计器, jsp工作流设计器, asp.net工作流设计器，工作流设计器, jsp工作流设计器, asp.net工作流设计器

    web项目引入bpmn-js

    在web项目中引入bpmnjs流程画图功能，实现节点点击事件，用户可以自行画流程图，直接放到tomcat下，就可以访问了

    axure 使用文档

    此文档主要描述axure软件的使用说明，包括画图、流程图等相关JSP页面设计常用的一些内容。

Magicbox
Global site tag (gtag.js) - Google Analytics