Java基础编程2—利用bootstrap和highcharts制作图表（柱状图）

来源：互联网发布：二战英国巡洋舰知乎编辑：程序博客网时间：2024/05/22 17:28

开发环境：eclipse MRS.2；

数据库：MySQL5；

jar包：gson-2.2.2.jar，mysql-connector-java-5.1.37-bin.jar；

css文件：bootstrap-theme.css.map，bootstrap-theme.min.css，bootstrap.min.css；

js文件：jquery-2.2.3.min.js，bootstrap.min.js，highcharts-3d.js，highcharts-more.js，highcharts.js

highCharts.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"pageEncoding="UTF-8"%><!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><title>图表_柱状图</title><head><link rel="stylesheet" href="css/bootstrap.min.css"><script type="text/javascript" src="js/jquery-2.2.3.min.js"></script><script type="text/javascript" src="js/bootstrap.min.js"></script><script type="text/javascript" src="js/highcharts.js"></script><script>$(document).ready(function() {$.ajax({url : "getStuAgeInterval",type : "get",success : function(csv) {$('#container').highcharts({chart : {type : 'column'},title : {text : '学生信息年龄分布柱状图'},subtitle : {text : 'CCIT'},xAxis : {crosshair : true},yAxis : {min : 0,title : {text : '人数 (个)'}},series : csv});//highcharts},//ajax successerror : function(XMLHttpRequest, data, textStatus) {alert("status:" + XMLHttpRequest.status);alert("readyState:" + XMLHttpRequest.readyState);alert("textStatus:" + textStatus);}});//ajax});//</script><style>div {border: 1px solid grey;}</style></head><body><h1>显示学生年龄分布信息</h1><div id="container"></div></body></html>

DBHelper.java

package com.highCharts.Util;import java.sql.Connection;import java.sql.DriverManager;import java.sql.SQLException;/** * 数据库连接 *  * @author xingyang * */public class DBHelper {private static Connection conn = null;public static Connection getConnection() {try {// 加载MySql的驱动类Class.forName("com.mysql.jdbc.Driver");} catch (ClassNotFoundException e) {System.out.println("找不到驱动程序类 ，加载驱动失败！");e.printStackTrace();}String url = "jdbc:mysql://localhost:3306/test"; // 数据库：testString username = "root"; // 数据库连接名String password = "123456"; // 数据库连接密码try {conn = DriverManager.getConnection(url, username, password);// System.out.println(conn);} catch (SQLException se) {System.out.println("数据库连接失败！");se.printStackTrace();}return conn;}}

Student.java

package com.highCharts.model;/** * 学生信息类 *  * @author xingyang * */public class Student {private int id;private String name;private int age;public Student() {super();}public Student(String name, int age) {super();this.name = name;this.age = age;}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 getAge() {return age;}public void setAge(int age) {this.age = age;}@Overridepublic String toString() {return "student [id=" + id + ", name=" + name + ", age=" + age + "]";}}

Interval.java

package com.highCharts.model;import java.util.ArrayList;import java.util.List;/** * 图表获取学生信息的数据类 *  * @author xingyang * */public class Interval {private String name;private List<Integer> data;public String getName() {return name;}public void setName(String name) {this.name = name;}public List<Integer> getData() {return data;}public void setData(ArrayList<Integer> data) {this.data = data;}public Interval(String name, List<Integer> data) {super();this.name = name;this.data = data;}}

StuDao.java

package com.highCharts.dao;import java.util.List;import com.highCharts.model.Interval;public interface StuDao {// 取到所有学生的年龄数据List<Interval> getAgeCount();}

StuDaoImpl.java

package com.highCharts.daoImpl;import java.sql.Connection;import java.sql.PreparedStatement;import java.sql.ResultSet;import java.sql.SQLException;import java.util.ArrayList;import java.util.List;import com.highCharts.Util.DBHelper;import com.highCharts.dao.StuDao;import com.highCharts.model.Interval;/** *  * @author xingyang * */public class StuDaoImpl implements StuDao {private ResultSet rs = null;private Connection connection = null;@Overridepublic List<Interval> getAgeCount() {List<Interval> list = new ArrayList<>();for (int i = 3; i < 130; i++) { // 获取学生3岁-129岁的年龄阶段try {connection = DBHelper.getConnection();String sql = "select Count(* ) from student where age BETWEEN ? and ?";PreparedStatement pStatement = connection.prepareStatement(sql);pStatement.setInt(1, i);pStatement.setInt(2, i + 1);rs = pStatement.executeQuery();while (rs.next()) {String name = i + "-" + (i + 1);int data = rs.getInt(1);List<Integer> datas = new ArrayList<Integer>();datas.add(data);Interval interval = new Interval(name, datas);list.add(interval);}} catch (SQLException e) {e.printStackTrace();}}return list;}}

GetStuAgeInterval.java

package com.highCharts.control;import java.io.IOException;import java.io.PrintWriter;import java.lang.reflect.Type;import java.util.List;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 com.google.gson.Gson;import com.google.gson.reflect.TypeToken;import com.highCharts.dao.StuDao;import com.highCharts.daoImpl.StuDaoImpl;import com.highCharts.model.Interval;/** * Servlet implementation class getStuAgeInterval */@WebServlet("/getStuAgeInterval")public class GetStuAgeInterval extends HttpServlet {private static final long serialVersionUID = 1L;       private StuDao sDao;private List<Interval> list;private PrintWriter out;    public GetStuAgeInterval() {        sDao=new StuDaoImpl();    }protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {out=response.getWriter();response.setContentType("text/json;charset=utf-8");list=sDao.getAgeCount();Gson gson=new Gson();Type type=new TypeToken<List<Interval>>(){}.getType();String users=gson.toJson(list, type);System.out.println(users);out.print(users);}protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {doGet(request, response);}}

阅读全文

0 0