目录
由于最近参加一些其他活动,没有学习更新电商项目,今天继续。
本篇文章将介绍用户访问session分析-session聚合统计之计算统计结果可视化。
由于前面的项目创建的时候没有考虑到可视化可能遇到的问题,后面发现写网页的时候有问题,所以我就将项目从新迁移了一下。
创建WEB项目
创建步骤详情参考:IntelliJ IDEA创建maven web项目
完善后续:将前面所写的代码迁移过来。
可视化结果
测试可视化环境
在数据库中创建一张Goods表
create table goods( id int auto_increment primary key, name varchar(255), price int(4), sales int(11), stock int(11), detail varchar(255) );
插入一些数据
insert into goods(name,price,sales,stock,detail) values('短袖',88,600,150,'潮流时尚大方'); insert into goods(name,price,sales,stock,detail) values('茶叶',50,500,500,'健康的生活'); insert into goods(name,price,sales,stock,detail) values('矿泉水',3,1000,1000,'大自然的搬运工'); insert into goods(name,price,sales,stock,detail) values('香飘飘',3,200,500,'绕地球一周'); insert into goods(name,price,sales,stock,detail) values('王老吉',4,400,700,'红罐凉茶');
dao目录下
GoodsDao.java
package graduation.java.dao; import graduation.java.domain.Goods; import java.sql.SQLException; import java.util.Map; /** * FileName: GoodsDao * Author: hadoop * Email: 3165845957@qq.com * Date: 19-3-19 上午11:14 * Description: * 测试可视化环境所用的Goods表查询借口 */ public interface GoodsDao { List<Goods> queryAllGoods() throws SQLException; }
domain目录下
Goods.java
package graduation.java.domain; /** * FileName: Goods * Author: hadoop * Email: 3165845957@qq.com * Date: 19-3-19 上午11:15 * Description: * 测试可视化环境所用的Goods类 * */ public class Goods { private int id; private String name; private int price; private int sales; private int stock; private String detail; public int getId() { return id; } public void setId(int id) { this.id = id; } public String getName() { return name; } public void setName(String name) { this.name = name; } public int getPrice() { return price; } public void setPrice(int price) { this.price = price; } public int getSales() { return sales; } public void setSales(int sales) { this.sales = sales; } public int getStock() { return stock; } public void setStock(int stock) { this.stock = stock; } public String getDetail() { return detail; } public void setDetail(String detail) { this.detail = detail; } @Override public String toString() { return "Goods{" + "id=" + id + ", name='" + name + '\'' + ", price=" + price + ", sales=" + sales + ", stock=" + stock + ", detail='" + detail + '\'' + '}'; } }
impl目录下
DAOFactory.java
/** * 获取测试可视化环境Goods管理DAO * @return */ public static GoodsDAOImpl getGoodsDAO(){ return new GoodsDAOImpl(); }
GoodsDAOImpl.java
package graduation.java.impl; import graduation.java.dao.GoodsDao; import graduation.java.domain.Goods; import graduation.java.jdbc.JDBCHelper; import java.sql.ResultSet; import java.sql.SQLException; import java.util.ArrayList; import java.util.List; import java.util.Map; /** * FileName: GoodsDAOImpl * Author: hadoop * Email: 3165845957@qq.com * Date: 19-3-19 上午11:20 * Description: * 测试可视化环境所用的Goods表查询借口实现类 */ public class GoodsDAOImpl implements GoodsDao { @Override public List<Goods> queryAllGoods() throws SQLException { String sql = "select * from goods where id >=1"; Object[] param = new Object[]{}; List<Goods> list = new ArrayList<Goods>(); JDBCHelper jdbcHelper = JDBCHelper.getInstance(); jdbcHelper.executeQuery(sql, param, new JDBCHelper.QueryCallback() { @Override public void process(ResultSet rs) throws Exception { while (rs.next()){ Goods goods = new Goods(); goods.setId(rs.getInt("id")); goods.setName(rs.getString("name")); goods.setPrice(rs.getInt("price")); goods.setSales(rs.getInt("sales")); goods.setStock(rs.getInt("stock")); goods.setDetail(rs.getString("detail")); list.add(goods); } } }); return list; } }
创建目录servlet
ServletQueryAllGoods.java //servlet用来实现数据的提取,并发送到前端 jsp进行显示
package graduation.java.servlet; import graduation.java.dao.GoodsDao; import graduation.java.domain.Goods; import graduation.java.impl.GoodsDAOImpl; import javax.servlet.ServletException; import javax.servlet.annotation.WebServlet; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; import java.io.IOException; import java.sql.SQLException; import java.util.List; import java.util.Map; /** * FileName: ServletQuaryAllGoods * Author: hadoop * Email: 3165845957@qq.com * Date: 19-3-19 下午3:30 * Description: * servlet用来实现数据的提取,并发送到前端 jsp进行显示 */ @WebServlet(name = "ServletQueryAllGoods", value = "/ServletQueryAllGoods") public class ServletQueryAllGoods extends HttpServlet { protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { doGet(request, response); } protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { GoodsDao goodsDao = new GoodsDAOImpl(); List<Goods> goodsList; try { goodsList = goodsDao.queryAllGoods(); System.out.println(goodsList.get(0).toString()); request.setAttribute("goodsList", goodsList); request.getRequestDispatcher("/WEB-INF/jsp/goodssales.jsp").forward(request, response); } catch (SQLException e) { e.printStackTrace(); } } }
test目录下
GoodsQuaryTest.java //测试测试可视化环境中数据库是否连接成功
package graduation.java.test; import graduation.java.dao.GoodsDao; import graduation.java.domain.Goods; import graduation.java.impl.DAOFactory; import java.sql.SQLException; import java.util.List; /** * FileName: GoodsQuaryTest * Author: hadoop * Email: 3165845957@qq.com * Date: 19-3-19 上午11:32 * Description: * 测试测试可视化环境中数据库是否连接成功 */ public class GoodsQuaryTest { public static void main(String[] args){ Goods goods = new Goods(); GoodsDao goodsDao = DAOFactory.getGoodsDAO(); try { List<Goods> list = goodsDao.queryAllGoods(); for (Goods goods1: list){ System.out.println(goods1.toString()); } } catch (SQLException e) { e.printStackTrace(); } } }
编写网页
目录结构
jsp目录下
goodssales.jsp //展示结果
<%@ page import="java.util.List" %> <%@ page import="graduation.java.domain.Goods" %> <%@ page import="java.util.Arrays" %> <%@ page import="java.util.ArrayList" %> <%@ page import="java.util.Map" %><%-- Created by IntelliJ IDEA. User: hadoop Date: 19-3-19 Time: 下午4:19 To change this template use File | Settings | File Templates. --%> <%@ page contentType="text/html;charset=UTF-8" language="java" %> <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %> <% List<Goods> list = (List<Goods>) request.getAttribute("goodsList"); List<String> goodsName = new ArrayList<>(); int[] sales = new int[list.size()]; for (int i = 0; i < list.size();i++){ goodsName.add("\'"+list.get(i).getName()+"\'"); //goodsName[i] = "\""+list.get(i).getName()+"\""; sales[i] = list.get(i).getSales(); System.out.println("name: "+ list.get(i).getName()+" , sales: "+ list.get(i).getSales()); } System.out.println(goodsName.toString()); System.out.println(sales.toString()); %> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>ECharts</title> <!-- 引入 echarts.js --> <script type="text/javascript" src="http://echarts.baidu.com/gallery/vendors/echarts/echarts-all-3.js"></script> </head> <body> <!-- 为ECharts准备一个具备大小(宽高)的Dom --> <div id="main" style="width: 600px;height:400px;">1111111111</div> <script type="text/javascript"> // 基于准备好的dom,初始化echarts实例 var myChart = echarts.init(document.getElementById('main')); var name = <%=goodsName.toString()%>; window.alert(5555); var arr = <%=Arrays.toString(sales)%>; // 指定图表的配置项和数据 var option = { title: { text: 'ECharts 入门示例' }, tooltip: {}, legend: { data:['销量'] }, xAxis: { data: ['短袖', '茶叶', '矿泉水', '香飘飘', '王老吉'] }, yAxis: {}, series: [{ name: '销量', type: 'bar', data: arr }] }; // 使用刚指定的配置项和数据显示图表。 myChart.setOption(option); </script> </body> </html>