实现 从数据库读取数据显示在前台echarts图表里,图表可根据数据库数据实时更新。效果如图
实现步骤
- 1.创建数据表
- 2.建立Java Web Project
- 3.创建Bean对象
- 4.创建DAO
- 5.创建Servlet对象
- 6.配置web.xml
- 7.编写JSP前台并简单配置ECharts
1 创建数据表
首先新建test数据库,然后创建表bar,插入数据。代码如下
USE test;
CREATE TABLE bar(NAME VARCHAR(50),num INT);
INSERT INTO bar VALUES("pc",50);
INSERT INTO bar VALUES("tv",65);
INSERT INTO bar VALUES("电冰箱",50);
INSERT INTO bar VALUES("洗衣机",99);
2
2.建立Java Web Project
新建项目Dynamic Web Project,命名为echarts_demo,其他的默认即可。
下载
把lib文件中的所有jar文件拷贝到项目webroot/web-ing/lib 文件夹下, 并把每个jar文件 加入项目的构造路径。
3.创建Bean对象
在src目录下新建包com.bean,并创建对象Bar,代码如下:
4.创建DAO
使用的是最原始也是最简单的JDBC的方式连接MySQL数据库,也是为了更专注于交互实现。在src目录下新建包com.dao,并创建对象BarDao,代码如下:
5.创建Servlet对象,实现服务器后台向前台JSP响应数据
在src目录下新建包com.servlet,并创建对象BarService,JsoService,代码如下
创建JsoService
6.配置web.xml
7. 下载
并拷贝到WebRoot根目录下;
编写JSP前台echarts.jsp,并简单配置ECharts
最后部署运行