（jsp+servlet+mvc）jsp页面如何统计数据库表的不同count并显示（简易的echart）

最新推荐文章于 2022-04-07 11:09:09 发布

置顶菜鸡锻炼法则

最新推荐文章于 2022-04-07 11:09:09 发布

阅读量1.6k

点赞数 3

分类专栏： java 文章标签： mysql java jquery jsp

本文链接：https://blog.youkuaiyun.com/qq_44807346/article/details/106616018

版权

java 专栏收录该内容

7 篇文章

订阅专栏

从数据库中count不同的数据给servlet传到jsp页面上

最近在做一个java+servlet+mvc的一个项目，为了在jsp页面上显示数据库当中的统计的数据，我做了以下的方法

获取数据库.

// 获取数据库，保存到javabean中
public ArrayList<count> countN() throws Exception
	{			//统计用户

			ArrayList<count> al = new ArrayList<count>();
			//1加载驱动
			Class.forName(DBDRIVER);
			//2连接
			this.conn = DriverManager.getConnection(DBURL, DBUSER, DBPASS);
			try 
			{
				count f = new count();
				ps = conn.prepareStatement("SELECT count(case when sex = '男' then 1 end) ,count(case when sex = '女' then 1 end)  ,count(*) FROM userinfo ");//不同性别的统计
				rs = ps.executeQuery();
				while(rs.next()) 
				{
					f.setFsex(String.valueOf(rs.getString(1)));
					f.setMsex(String.valueOf(rs.getString(2)));
					f.setCountU(String.valueOf(rs.getString(3)));				
				}
				ps = conn.prepareStatement("SELECT count(*) FROM friendinfo");
				rs = ps.executeQuery();
				while(rs.next())
				{
					f.setCountUb(String.valueOf(rs.getString(1)));
				}
				
				ps = conn.prepareStatement("SELECT count(*) FROM feedback");
				rs = ps.executeQuery();
				while(rs.next())
				{
					f.setMessageC(String.valueOf(rs.getString(1)));
				}
				
				ps = conn.prepareStatement("SELECT count(case when year(now())-YEAR(birthday) < 20 then 1 end) ,count(case when year(now())-YEAR(birthday) BETWEEN 20 and 40 then 1 end)  ,count(case when year(now())-YEAR(birthday) >40 then 1 end) FROM userinfo ");//不同的年龄进行统计
				rs = ps.executeQuery();
				while(rs.next())
				{
					f.setTw(rs.getString(1));
					f.setFo(rs.getString(2));
					f.setSi(rs.getString(3));
				
				}
				al.add(f);
				
				
				return al;
				
				
				
			} catch (SQLException e) {
				// TODO Auto-generated catch block
				e.printStackTrace();
			} finally {
				if(this.ps!=null) {
					this.ps.close();
				}
				if(this.conn!=null) {
					this.conn.close();
				}
				if(this.rs !=null) {
					this.rs.close();
				}
			}
			return al;
		
	}

servlet调用方法

// 调用获取数据库保存在javabean中的数据
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		// TODO Auto-generated method stub
ArrayList<count> al = new ArrayList<count> ();
	userCheck uc = new userCheck();
		try 
		{
			al = uc.countN();
		} 
		catch (Exception e) {
			// TODO Auto-generated catch block
			e.printStackTrace();
		}
		request.setAttribute("count", al);//获取的值，保存在count里
		RequestDispatcher dis = request.getRequestDispatcher("admin/echart.jsp");//跳转到jsp页面上
		dis.forward(request, response);

下面展示一些 内联代码片。

jsp显示

<body>
	<c:forEach var = "user" items = "${requestScope.count }">
	<div class="title" id="main3" style="width: 400px;height: 160px;">
    </script>
		<script type="text/javascript">
        // 基于准备好的dom，初始化echarts实例
        var myChart = echarts.init(document.getElementById('main3'));
        var nv = ${user.fsex };//获取到的男生数量
        var nan = ${user.msex };//获取到的女生数量
        option = {
            title: {
                text: '饼状图',
                backgroundColor:"red",
                borderColor: 'black',
            },
            tooltip : {  
                    trigger: 'item',  
                    formatter: "{a} <br/>{b} : {c} 个"  
                },  
            legend: {
                data:['比例'],
                color:'#FE0000'
            },
          series : [
          {
            name: '男女比例',
            type: 'pie',
            radius: '65%',
            data:[

                {value:nan, name:'男生',itemStyle:{normal:{color:'#3300CC'}}},
                {value:nv, name:'女生',itemStyle:{normal:{color:'#6633CC'}}}
            ],
            label:{            //饼图图形上的文本标签
                   normal:{
                       show:true,
                       position:'inner', //标签的位置
                       textStyle : {
                           fontWeight : 300 ,
                           fontSize : 12    //文字的字体大小
                       },
                       formatter:'{d}%'

                       
                   }
               },
        }
    ],
        itemStyle: {
        emphasis: {
            shadowBlur: 200,
            shadowColor: 'rgba(0, 0, 0, 0.5)'
        }
    }
};
        // 使用刚指定的配置项和数据显示图表。
        myChart.setOption(option);
    </script>
    </c:forEach>
		
</body>