Spring Boot + Echarts案例

最新推荐文章于 2024-05-13 00:44:50 发布

mu_kui

最新推荐文章于 2024-05-13 00:44:50 发布

阅读量192

点赞数

文章标签： echarts spring boot java

本文链接：https://blog.csdn.net/mu_kui/article/details/125310048

版权

本文详细介绍了如何结合Spring Boot后端与Echarts前端，实现班级人数的柱状图展示。从创建数据库、数据表，到构建Spring Boot项目，设计实体类、映射器、服务类和控制器，再到引入Echarts和jQuery脚本，添加Druid依赖，最后完成页面数据可视化并成功启动应用。

摘要由CSDN通过智能技术生成

一、提出任务

后端利用 spring boot 查询班级表数据，前端利用echarts绘制各班人数柱形图

二、完成任务

（一）创建数据路与表

1.创建数库

创建数据库 bootdb: 执行命令CREATE DATABASE bootdb;

在这里插入图片描述

2.创建数据表

创建表结构 t_class
在这里插入图片描述

插入表记录
在这里插入图片描述

查看班级表记录
在这里插入图片描述

（二）创建Spring Boot项目

利用Spring lnitializr创建spring boot项目 EchartsDemo
在这里插入图片描述
添加依赖

设置项目名称与保存位置

（三）创建班级实体类

在net.lj.echarts包里创建bean子包，在子包里创建Clazz类
在这里插入图片描述

package net.lj.echarts.bean;

public class Clazz {
   
    private int id;
    private String clazz;
    private int boys;
    private int girls;

    public int getId() {
   
        return id;
    }

    public void setId(int id) {
   
        this.id = id;
    }

    public String getClazz() {
   
        return clazz;
    }

    public void setClazz(String clazz) {
   
        this.clazz = clazz;
    }

    public int getBoys() {
   
        return boys;
    }

    public void setBoys(int boys) {
   
        this<