1 概述
系统角色：游客：可以根据城市的简拼、全拼、邮编和区号来搜索气象参数收集、浏览天气相关信息。
管理员：拥有系统最高权限，可以添加删除修改气象参数收集，可以管理系统用户，可以添加删除天气相信息、公告等
前台：天气相关信息分类：（天气资讯、气象科普、天气灾害大事件 等等）分类需要从数据库中动态取出（因为后台中有添加删除修改分类的功能）。
气象参数收集搜索：可以根据城市的简拼、全拼、邮编和区号来搜索气象参数收集，使用Ajax功能异步实时读取用户输入的信息并查询数据库显示到搜索框中供用户选择。
公告栏：显示公告信息。
后台：天气信息分类管理，分类列表（包含删除、修改），添加分类。
气象参数收集管理，使用三级联动菜单，添加删除修改气象参数收集信息。
公告管理，添加、删除和修改。
天气信息管理，添加删除修改天气相关资讯信息。
2 数据库表
表4 log天气预报表
| 字段名称 | 自动增长 | 字段类型 | 默认值 | 允许空 | 说明 |
| Id | - | int | - | × | 编号 |
| shen | - | varchar | - | × | 省 |
| shi | - | varchar | - | × | 市 |
| xian | - | varchar | - | × | 县 |
| cnid | - | varchar | - | √ | CNID |
| log_date | - | varchar | - | √ | 预报日期 |
| btqx | - | int | - | √ | 0白天气象 1夜间 |
| qxnr | - | int | - | √ | 0到31，详见程序 |
| zgwd | - | varchar | - | √ | 最高低温度 |
| fx | - | int | - | √ | 风向 |
| fl | - | int | - | √ | 风力 |
| shzs_gm | - | int | - | √ | 生活指数感冒 |
| shzs_cy | - | int | - | √ | 穿衣 |
| shzs_xc | - | int | - | √ | 洗车 |
| shzs_ly | - | int | - | √ | 旅游 |
| createdate | - | varchar | - | √ | 发布时间 |
3 关键代码
<%@ page language="java" import="com.entity.Info,java.text.DecimalFormat" pageEncoding="utf-8"%>
<%@page import="com.util.PublicToolCheckParam"%>
<%@page import="java.util.ArrayList"%>
<%@page import="com.entity.Type"%>
<%@page import="com.util.PublicToolShowlogview"%>
<%@page import="com.entity.log"%>
<%@page import="com.util.PublicToolCheckParam"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!-- saved from url=(0051)http://mall.wl-expo.com/relaxationShop_index.action -->
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>天气预报</title>
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7">
<link rel="stylesheet" href="../webstyle/base.css" type="text/css" media="screen">
<link rel="stylesheet" href="../webstyle/common.css" type="text/css" media="screen">
<link rel="stylesheet" href="../webstyle/mall.css" type="text/css" media="screen">
<script type="text/javascript" src="../js/web/checkGo.js" charset="gb2312"></script>
<link rel="stylesheet" href="../webstyle/base.css" type="text/css" media="screen">
<link rel="stylesheet" href="../webstyle/common.css" type="text/css" media="screen">
<link rel="stylesheet" href="../webstyle/mall.css" type="text/css" media="screen">
<link rel="stylesheet" type="text/css" href="../webstyle/public.css">
<script src="../js/jquery.js" type="text/javascript"></script>
<script src="../js/echarts.common.min.js" type="text/javascript"></script>
<script type="text/javascript" src="../js/main.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body,td,th {
font-family: \5B8B\4F53, Tahoma, arial;
}
</style>
</head>
<body >
<jsp:include flush="true" page="../web/top.jsp"></jsp:include>
<div id="wrap">
<!-- end header-->
<div id="main" class="mt10">
<div class="fl lsort">
<div class="sort">
<h2>选择分类</h2>
<div class="sortbox">
<% ArrayList<Type> TypeList = (ArrayList<Type>)request.getAttribute("TypeList");
if(TypeList == null || TypeList.toString().equals("[]")){
out.println("<td colspan='5' height='30'><div align='center'>暂无信息!</div></td>");
}
else{
for(int i=0;i<TypeList.size();i++){
Type gt = TypeList.get(i);
String typeName = gt.getTypeName();
%>
<h3><A href="typelist?typeid=<%=gt.getTypeId()%>"> <%=typeName%></A></h3>
<% }
}
%>
</div>
</div>
</div>
<div class="fr rightbox">
<div class="position"> 您当前的位置: <a href="../" >首页</a> >>天气预报 </div>
<div class="mt10 listbox">
<%
ArrayList<log> logList = (ArrayList<log>)request.getAttribute("logList");
if(logList == null || logList.toString().equals("[]")){
out.println("暂无天气数据");
}
else{
log gd1 = logList.get(0);
%>
<h2 align="center" style="font-size:16px"><strong><%=gd1.getXian()%> 天气预报</strong></h2>
<div class="weatherYubaoBox">
<table class="position" width="100%" border="1" cellspacing="0" cellpadding="0" align="center">
<tr>
<th width="20%"><div align="center">日期</div></th>
<th width="10%" align="center"><div align="center">天气现象</div></th>
<th width="10%" align="center"><div align="center">气温</div></th>
<th width="10%" align="center"><div align="center">风向</div></th>
<th width="10%" align="center"><div align="center">风力</div></th>
<th width="10%" align="center"><div align="center">感冒指数</div></th>
<th width="10%" align="center"><div align="center">穿衣指数</div></th>
<th width="10%" align="center"><div align="center">洗车指数</div></th>
<th width="10%" align="center"><div align="center">旅游指数</div></th>
</tr>
</table>
<table class="position" width="100%" border="1" cellspacing="0" cellpadding="0">
<%
for(int i=0;i<logList.size();i++){
log gd = logList.get(i);
String Cnid = gd.getCnid();
%>
<!--day 1-->
<tr>
<td width="15%" ><div align="center"><%=gd.getLog_date()%></div></td>
<td width="5%" > <%
String isby = "白天";
if(gd.getBtqx() == 0){
isby = "白天";
}else if(gd.getBtqx() == 1){
isby = "夜晚";
}%>
<div align="center"><%=isby%></div></td>
<td width="10%">
<%
String imgadd = "../webstyle/tq/d00.gif";
//白天图标
if(gd.getBtqx() == 0){
if(gd.getQxnr() < 10){
imgadd = "../webstyle/tq/d0"+gd.getQxnr()+".gif";
}else if(gd.getQxnr() >9){
imgadd = "../webstyle/tq/d"+gd.getQxnr()+".gif";
}
}
//夜间图标
if(gd.getBtqx() == 1){
if(gd.getQxnr() < 10){
imgadd = "../webstyle/tq/n0"+gd.getQxnr()+".gif";
}else if(gd.getQxnr() >9){
imgadd = "../webstyle/tq/n"+gd.getQxnr()+".gif";
}
}
%>
<div align="center"><img src="<%=imgadd%>" /></div> </td>
<td width="10%">
<%
String wd = "";
wd = gd.getZgwd();
%>
<div align="center"><%=wd%>℃</div> </td>
<td width="10%"><div align="center"> <%
String fx = "无持续风向";
if(gd.getFx() == 0){fx = "无持续风向";}
if(gd.getFx() == 1){fx = "北风";}
if(gd.getFx() == 2){fx = "东北风";}
if(gd.getFx() == 3){fx = "东风";}
if(gd.getFx() == 4){fx = "东南风";}
if(gd.getFx() == 5){fx = "南风";}
if(gd.getFx() == 6){fx = "西南风";}
if(gd.getFx() == 7){fx = "西风";}
if(gd.getFx() == 8){fx = "西北风";}
%>
<%=fx%> </div></td>
<td width="10%"><div align="center"><%
String fl = "无风";
if(gd.getFl() == 0){fl = "无风";}
if(gd.getFl() == 1){fl = "微风";}
if(gd.getFl() == 2){fl = "3-4级风";}
if(gd.getFl() == 3){fl = "4-5级风";}
if(gd.getFl() == 4){fl = "5-6级风";}
if(gd.getFl() == 5){fl = "6-7级风";}
if(gd.getFl() == 6){fl = "7-8级风";}
if(gd.getFl() == 7){fl = "8级以上";}
%>
<%=fl%> </div></td>
<td width="10%"><div align="center"><%
String shzs_gm = "少发";
if(gd.getShzs_gm() == 1){shzs_gm = "少发";}
if(gd.getShzs_gm() == 2){shzs_gm = "较易发";}
if(gd.getShzs_gm() == 3){shzs_gm = "易发";}
if(gd.getShzs_gm() == 4){shzs_gm = "极易发";}
%>
<%=shzs_gm%> </div></td>
<td width="10%"><div align="center"><%
String shzs_cy = "一般";
if(gd.getShzs_cy() == 1){shzs_cy = "一般";}
if(gd.getShzs_cy() == 2){shzs_cy = "冷";}
if(gd.getShzs_cy() == 3){shzs_cy = "热";}
%>
<%=shzs_cy%> </div></td>
<td width="10%"><div align="center"><%
String shzs_xc = "适合";
if(gd.getShzs_xc() == 1){shzs_xc = "适合";}
if(gd.getShzs_xc() == 2){shzs_xc = "不宜";}
if(gd.getShzs_xc() == 3){shzs_xc = "建议";}
%>
<%=shzs_xc%> </div></td>
<td width="10%"><div align="center"><%
String shzs_ly = "适合";
if(gd.getShzs_ly() == 1){shzs_ly = "适合";}
if(gd.getShzs_ly() == 2){shzs_ly = "不宜";}
if(gd.getShzs_ly() == 3){shzs_ly = "建议";}
%>
<%=shzs_ly%> </div></td>
</tr>
<%}%>
</table>
</div>
</div>
<div class="clr"></div>
<div class="productpage">
<%
out.println("共有"+request.getAttribute("sumCount")+"条 ");
out.println("第"+request.getAttribute("currentPage")+"/"+request.getAttribute("sumPageCount")+"页 ");
out.println("<a href='../servlet/logview?cp="+request.getAttribute("indexPage")+"&cnid="+request.getAttribute("cnid")+"'>首页</a> ");
out.println("<a href='../servlet/logview?cp="+request.getAttribute("upPage")+"&cnid="+request.getAttribute("cnid")+"'>上一页</a> ");
out.println("<a href='../servlet/logview?cp="+request.getAttribute("nextPage")+"&cnid="+request.getAttribute("cnid")+"'>下一页</a> ");
out.println("<a href='../servlet/logview?cp="+request.getAttribute("lastPage")+"&cnid="+request.getAttribute("cnid")+"'>尾页</a>");
}
%>
</div>
<%
ArrayList<log> logListSeven = (ArrayList<log>)request.getAttribute("logListSeven");
if(logListSeven == null || logListSeven.toString().equals("[]")){
//out.println("暂无天气数据");
}
else {
StringBuilder tianshu = new StringBuilder();
StringBuilder wendu = new StringBuilder();
StringBuilder fengli = new StringBuilder();
for(int i=0;i<logListSeven.size();i++){
log gd2 = logListSeven.get(i);
//out.println(gd2.getLog_date());
if (tianshu.length() > 0) {//该步即不会第一位有逗号，也防止最后一位拼接逗号！
tianshu.append(",");
}
if (wendu.length() > 0) {//该步即不会第一位有逗号，也防止最后一位拼接逗号！
wendu.append(",");
}
if (fengli.length() > 0) {//该步即不会第一位有逗号，也防止最后一位拼接逗号！
fengli.append(",");
}
tianshu.append("\""+gd2.getLog_date()+"\"");
wendu.append(gd2.getZgwd());
fengli.append(gd2.getFl());
}
%>
<div id="qiwen" style="width: 600px;height:400px;"></div>
<script type="text/javascript">
// 基于准备好的dom，初始化echarts实例
var myChart = echarts.init(document.getElementById('qiwen'));
// 指定图表的配置项和数据
var option = {
title: {
text: '气温'
},
tooltip: {},
legend: {
data:['气温']
},
xAxis: {
data: [<%=tianshu%>],
axisLabel:{
rotate:45, //刻度旋转45度角
textStyle:{
color:"red",
fontSize:12
}
}
},
yAxis: {},
series: [{
name: '气温',
type: 'bar',
data: [<%=wendu%>]
}]
};
// 使用刚指定的配置项和数据显示图表。
myChart.setOption(option);
</script>
<div id="fengli" style="width: 600px;height:400px;"></div>
<script type="text/javascript">
// 基于准备好的dom，初始化echarts实例
var myChart = echarts.init(document.getElementById('fengli'));
// 指定图表的配置项和数据
var option = {
title: {
text: '风力'
},
tooltip: {},
legend: {
data:['风力']
},
xAxis: {
data: [<%=tianshu%>],
axisLabel:{
rotate:45, //刻度旋转45度角
textStyle:{
color:"red",
fontSize:12
}
}
},
yAxis: {},
series: [{
name: '风力',
type: 'bar',
data: [<%=fengli%>]
}]
};
// 使用刚指定的配置项和数据显示图表。
myChart.setOption(option);
</script>
<% } %>
</div>
</div>
<!--end footer-->
<iframe src="../web/bottom.jsp" width="100%" frameborder="0"></iframe>
</div>
</body>
</html>4 效果演示
idea或eclipse开发,mysql数据库
扫一扫
628
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
