jsp网页页面设计，网站用户行为分析

在使用jsp创建网页时报错
org.apache.jasper.JasperException: java.lang.NullPointerException

img

conndb.java文件
package dbtaobao;
import java.sql.*;
import java.util.ArrayList;
 
public class connDb {
    private static Connection con = null;
    private static Statement stmt = null;
    private static ResultSet rs = null;
 
    //连接数据库方法
    public static void startConn(){
        try{
            Class.forName("com.mysql.jdbc.Driver");
            //连接数据库中间件
            try{
                con = DriverManager.getConnection("jdbc:MySQL://localhost:3306/data","root","root");
            }catch(SQLException e){
                e.printStackTrace();
            }
        }catch(ClassNotFoundException e){
            e.printStackTrace();
        }
    }
 
    //关闭连接数据库方法
    public static void endConn() throws SQLException{
        if(con != null){
            con.close();
            con = null;
        }
        if(rs != null){
            rs.close();
            rs = null;
        }
        if(stmt != null){
            stmt.close();
            stmt = null;
        }
    }

        //获取销量前五的商品类别
        public static ArrayList index() throws SQLException{
            ArrayList list = new ArrayList();
            startConn();
            stmt = con.createStatement();
            rs = stmt.executeQuery("select behavior_type,count(*) num from bg_action group by behavior_type");
            while(rs.next()){
                String[] temp={rs.getString("behavior_type"),rs.getString("num")};
                list.add(temp);
            }
            endConn();
            return list;
        }
   
}

index.jsp文件

<%@ page language="java" import="dbtaobao.connDb,java.util.*" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%
ArrayList list = connDb.index();
%>    
html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>ECharts 可视化分析淘宝双11title>
<link href="./css/style.css" type='text/css' rel="stylesheet"/>
<script src="./js/echarts.min.js">script>
head>
<body>
    <div class='header'>
        <p>ECharts 可视化分析淘宝双11p>
    div>
    <div class="content">
        <div class="nav">
            <ul>
                <li class="current"><a href="#">所有买家各消费行为对比a>li>
                
            ul>
        div>
        <div class="container">
            <div class="title">商品类别交易额对比div>
            <div class="show">
                <div class='chart-type'>柱状图div>
                <div id="main">div>
            div>
        div>
    div>
<script>
//基于准备好的dom，初始化echarts实例
var myChart = echarts.init(document.getElementById('main'));
// 指定图表的配置项和数据
var x = []
var y = []
<%
    for(String[] a:list){
        %>
        x.push(<%=a[0]%>);
        y.push(<%=a[1]%>);
        <%
    }
%>
option = {
    color: ['#3398DB'],
    tooltip : {
        trigger: 'axis',
        axisPointer : {            // 坐标轴指示器，坐标轴触发有效
            type : 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
        }
    },
    grid: {
        left: '3%',
        right: '4%',
        bottom: '3%',
        containLabel: true
    },
    xAxis : [
        {
            type : 'category',
            data : x,
            axisTick: {
                alignWithLabel: true
            }
        }
    ],
    yAxis : [
        {
            type : 'value'
        }
    ],
    series : [
        {
            name:'Value',
            type:'bar',
            barWidth: '60%',
            data:y
        }
    ]
};
// 使用刚指定的配置项和数据显示图表。
myChart.setOption(option);
script>
body>
html>
希望大家能帮忙看看，毫无头绪,所有的包和配置文件如下：

img

img

img

img