利用ECharts可视化mysql数据库中的数据
技术实现背景
在我们的日常开发中我们经常使用到各种各样的数据进行相关的功能的开发,在这个过程中我们可以用到各种各样的图表来分析和实现我们的需求,很多的时候我们可以进行相关的功能的分析和判断,在这个过程中我们就需要从数据库中读取的数据使用Echarts来进行相关的功能的分析,下图所示即为我们要实现的细节性,在这个过程中我们注意是Echarts的相关的功能的研究,然后是我们的进行相关的分析功能,下图即为我们要把我们的功能进行相关的数据库中的数据在前端进行相关的功能进行展示。
准备工作
- 开发工具主要是包含mysql数据库,echarts,ssm框架(也可以使用servlet和ssh)均可以,idea编辑器和Tomcat等
- 数据表的建立,为了大家的入门的方便,这里博主还是选择了以单表的功能进行相关的功能的开发给大家进行相关的功能的讲解。
CREATE TABLE `bookinfo` (
`id` bigint(20) NOT NULL AUTO_INCREMENT COMMENT '主键id',
`bid` varchar(40) NOT NULL COMMENT '图书编号',
`bookName` varchar(40) NOT NULL COMMENT '书名',
`author` varchar(30) NOT NULL COMMENT '作者',
`publisher` varchar(40) NOT NULL COMMENT '出版社',
`classifyCode` varchar(40) NOT NULL COMMENT '分类名称',
`createTime` datetime DEFAULT CURRENT_TIMESTAMP COMMENT '创建时间',
`bookAge` int(11) NOT NULL COMMENT '书龄',
`isBorrowed` varchar(2) NOT NULL COMMENT '是否可借',
`status` varchar(2) NOT NULL COMMENT '状态',
`number` int(11) NOT NULL COMMENT '图书数量',
`qrCode` varchar(100) NOT NULL COMMENT '二维码',
`location` varchar(100) NOT NULL COMMENT '位置',
PRIMARY KEY (`id`)
) ENGINE=InnoDB AUTO_INCREMENT=6 DEFAULT CHARSET=utf8mb4 COMMENT='图书表';
-- ----------------------------
-- Records of bookinfo
-- ----------------------------
INSERT INTO `bookinfo` VALUES ('1', '0001', 'Java编程思想', '马丁', '新华出版社', '科技类', '2020-08-02 10:48:23', '5', '1', '1', '7', '111', '1111');
INSERT INTO `bookinfo` VALUES ('2', '0002', 'Java核心',