Echarts|Echarts连接数据库使用Ajax的简单使用开发语言|echarts|java

一、项目环境

IDEA2019.3.3
MySql 5.7
SSM
echarts.js

二、柱状图简单案例 1.创建一个book表

文章图片

2.后台准备 book实体类：

public class Book { private Integer bid; private String bname; private String btype; private Integer bnumber; public Book(Integer bid, String bname, String btype, Integer bnumber) { this.bid = bid; this.bname = bname; this.btype = btype; this.bnumber = bnumber; }public Book() { super(); }public Integer getBid() { return bid; }public void setBid(Integer bid) { this.bid = bid; }public String getBname() { return bname; }public void setBname(String bname) { this.bname = bname; }public String getBtype() { return btype; }public void setBtype(String btype) { this.btype = btype; }public Integer getBnumber() { return bnumber; }public void setBnumber(Integer bnumber) { this.bnumber = bnumber; } }

mapper层：

@Repository public interface BookMapper { List selectAll(); }

service层：

public interface IBookService { List selectAll(); }

【Echarts|Echarts连接数据库使用Ajax的简单使用】service实现类：

@Service public class BookServiceImpl implements IBookService { @Autowired private BookMapper bookMapper; @Override public List selectAll() { return bookMapper.selectAll(); } }

mapper映射文件：

bid, bname, btype, bnumberselect * from book

Controller层：

@Controller public class IndexController {@Autowired private IBookService bookService; @RequestMapping("/All") public String toAll(){ return "echarts"; }@RequestMapping("/getAll") @ResponseBody public List selectAll(){ List books = bookService.selectAll(); System.out.println("books"+books); return books; }; }

三、前台页面