package com.laq.chart.dao.impl;
import com.laq.bean.ResultData;
import com.laq.chart.dao.EChartDao;
import com.laq.chart.model.EChart;
import com.laq.chart.model.EChartSeries;
import com.laq.common.util.BigDecimalUtils;
import com.laq.common.util.BigDecimalUtils.NumericZoom;
import com.laq.common.util.DateUtils;
import com.laq.dao.DaoException;
import com.laq.dao.impl.AbstractDao;
import com.joyintech.jupiter.workflow.commons.utils.CommonUtil;
import oracle.jdbc.OracleTypes;
import org.hibernate.HibernateException;
import org.hibernate.JDBCException;
import java.sql.CallableStatement;
import java.sql.ResultSet;
import java.sql.SQLException;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;
/**
* EChartDaoImpl EChart图表
*
* @author laq
* @version 1.0
* @since 2022-11
*/
@SuppressWarnings("all")
public class EChartDaoImpl extends AbstractDao implements EChartDao {
@Override
public ResultData callProcedure_CHART_DB_TERM_RATE(EChart eChart) throws DaoException {
String methodName = "callProcedure_CHART_DB_TERM_RATE";
info(methodName, "图表-折线图 param[eChart]:" + eChart);
ResultData resultData = new ResultData();
resultData.setSuccess(false);
try {
// 获取数据集合-形式可自行选择
CallableStatement statement = this.getSession().connection().prepareCall("{call PROC_CHART_DB_TERM_RATE(?,?,?)}");
if (CommonUtil.isNotEmpty(eChart.getDatePoint())) {
statement.setDate(1, new java.sql.Date(eChart.getDatePoint().getTime()));
} else {
statement.setDate(1, null);
}
statement.registerOutParameter(2, OracleTypes.CURSOR);
statement.registerOutParameter(3, OracleTypes.CURSOR);
statement.execute();
ResultSet rs1 = (ResultSet) statement.getObject(2);
ResultSet rs2 = (ResultSet) statement.getObject(3);
// x轴
Map<String, Object> xAxis = new HashMap<>();
List<String> xAxisData = new ArrayList<>();
while (rs1 != null && rs1.next()) {
xAxisData.add(DateUtils.formatDateString(rs1.getDate("cdate")));// 日期
}
xAxis.put("type", "category");
xAxis.put("data", xAxisData);
eChart.setxAxis(xAxis);
// legend 属性
Map<String, Object> legend = new HashMap<>();
legend.put("orient", "vertical");
legend.put("left", "right");
legend.put("right", "50");
eChart.setLegend(legend);
// y轴
Map<String, Object> yAxis = new HashMap<>();
Map<String, Object> axisLabel = new HashMap<>();
axisLabel.put("formatter", "{value} %");
yAxis.put("type", "value");
yAxis.put("axisLabel", axisLabel);
eChart.setyAxis(yAxis);
// series数据组
List<EChartSeries> eChartSeriesList = new ArrayList<>();// 线合集
EChartSeries eChartSeries = new EChartSeries();// 一条线
List<String> seriesData = new ArrayList<>();// 线上点
String name = "";
while (rs2 != null && rs2.next()) {
if (CommonUtil.isEmpty(name)) {// 初次进入
name = rs2.getString("termtype");
}
else if (name.equals(rs2.getString("termtype"))) {// 同一条线name相同
} else {// 当线发生变更时,将当前线放入图表
eChartSeries.setName(name);// 类型
eChartSeries.setType("line");
eChartSeries.setData(seriesData);// 线上点集合
eChartSeriesList.add(eChartSeries);// 加上线
seriesData = new ArrayList<>();
eChartSeries = new EChartSeries();
name = rs2.getString("termtype");
}
// 追加线上的点
seriesData.add(BigDecimalUtils.formatNumeric(rs2.getBigDecimal("weightrate"), NumericZoom.Percent, 4));// 权重利率
}
// 最后一组名称已经不会再变化
eChartSeries.setName(name);// 类型
eChartSeries.setType("line");
eChartSeries.setData(seriesData);// 线上点集合
eChartSeriesList.add(eChartSeries);// 加上线
eChart.setEChartSeriesList(eChartSeriesList);
resultData.setObject(eChart);
resultData.setSuccess(true);
resultData.setResultMessage("调用 " + methodName + " 成功");
} catch (JDBCException ex) {
error(methodName, "Error call proc By Param Query method " + methodName, ex);
throw new DaoException(DaoException.ERROR_GENERIC_JDBC_EXCEPTION, ex);
} catch (HibernateException ex) {
error(methodName, "Error call proc Param Query method " + methodName, ex);
throw new DaoException(DaoException.ERROR_HIBERNATE, ex);
} catch (IllegalStateException ex) {
error(methodName, "Error call proc Param Query method " + methodName, ex);
throw new DaoException(DaoException.ERROR_UNKNOWN_EXCEPTION, ex);
} catch (SQLException ex) {
error(methodName, "Error call proc Param Query method " + methodName, ex);
throw new DaoException(DaoException.ERROR_SQL_GRAMMAR_EXCEPTION, ex);
} catch (Exception e) {
resultData.setSuccess(false);
resultData.setResultMessage("调用 " + methodName + " 异常");
error(methodName, e.getMessage());
e.printStackTrace();
}
return resultData;
}
@Override
public ResultData callProcedure_CHART_RZJE(EChart eChart) throws DaoException {
String methodName = "callProcedure_CHART_RZJE";
info(methodName, "图表-柱状图 param[eChart]:" + eChart);
ResultData resultData = new ResultData();
resultData.setSuccess(false);
try {
// 获取数据集合-形式可自行选择
CallableStatement statement = this.getSession().connection().prepareCall("{call PROC_CHART_RZJE(?,?,?)}");
if (CommonUtil.isNotEmpty(eChart.getDatePoint())) {
statement.setDate(1, new java.sql.Date(eChart.getDatePoint().getTime()));
} else {
statement.setDate(1, null);
}
statement.registerOutParameter(2, OracleTypes.CURSOR);
statement.registerOutParameter(3, OracleTypes.CURSOR);
statement.execute();
ResultSet rs1 = (ResultSet) statement.getObject(2);
ResultSet rs2 = (ResultSet) statement.getObject(3);
// legend 属性
Map<String, Object> legend = new HashMap<>();
legend.put("orient", "vertical");
legend.put("left", "right");
legend.put("right", "0");
eChart.setLegend(legend);
// x轴
Map<String, Object> xAxis = new HashMap<>();
List<String> xAxisData = new ArrayList<>();
while (rs1 != null && rs1.next()) {
xAxisData.add(rs1.getString("datename"));// 日期
}
xAxis.put("type", "category");
xAxis.put("data", xAxisData);
eChart.setxAxis(xAxis);
// y轴
Map<String, Object> yAxis = new HashMap<>();
Map<String, Object> axisLabel = new HashMap<>();
axisLabel.put("formatter", "{value} 亿元");
yAxis.put("type", "value");
yAxis.put("axisLabel", axisLabel);
eChart.setyAxis(yAxis);
// series数据组
List<EChartSeries> eChartSeriesList = new ArrayList<>();// 线合集
EChartSeries eChartSeries = new EChartSeries();// 一条线
List<String> seriesData = new ArrayList<>();// 线上点
String name = "";
while (rs2 != null && rs2.next()) {
if (CommonUtil.isEmpty(name)) {// 初次进入
name = rs2.getString("termtype");
}
else if (name.equals(rs2.getString("termtype"))) {// 同一条线name相同
} else {// 当线发生变更时,将当前线放入图表
eChartSeries.setName(name);// 类型
eChartSeries.setType("bar");
eChartSeries.setStack("rzje");// 堆叠组
eChartSeries.setData(seriesData);// 线上点集合
eChartSeriesList.add(eChartSeries);// 加上线
seriesData = new ArrayList<>();
eChartSeries = new EChartSeries();
name = rs2.getString("termtype");
}
// 追加线上的点
seriesData.add(BigDecimalUtils.formatNumeric(rs2.getBigDecimal("dealamt"), NumericZoom.Billion, 4).replace(",", ""));// 交易金额
}
// 最后一组名称已经不会再变化
eChartSeries.setName(name);// 类
Javaweb JavaScript EChart 图表插件 echarts.min.js 与与后台交互等资源
需积分: 0 76 浏览量
更新于2023-03-22
收藏 2.17MB ZIP 举报
在JavaWeb开发中,JavaScript库ECharts是一款广泛使用的数据可视化工具,特别适合创建各种复杂的图表。ECharts由百度开发,提供了丰富的图表类型,如折线图、柱状图、饼图、散点图等,同时支持自定义配置,使得图表具有高度的可定制性。在给定的资源中,我们可以看到不同版本的`echarts.min.js`,这些是ECharts的压缩版本,用于在实际项目中减小加载时间。
`EChartDaoImpl.java`、`EChartSeries.java`、`EChart.java`、`EChartDao.java` 这些文件可能是Java后端与ECharts交互的接口或实现类。在JavaWeb应用中,通常会通过Ajax技术来实现在前端展示的数据与后端服务器的交互。例如,`EChartDao`可能是一个数据访问对象(DAO),负责与数据库交互获取需要绘制图表的数据;而`EChartSeries`和`EChart`可能代表ECharts图表的配置对象,封装了图表的系列数据和属性设置。
在使用ECharts时,首先需要在HTML页面中引入`echarts.min.js`,这是ECharts库的核心文件。然后,可以初始化一个ECharts实例,指定用于显示图表的DOM元素,并设置图表的配置项。例如:
```javascript
var myChart = echarts.init(document.getElementById('main'));
var option = {
title: {
text: '示例图表'
},
xAxis: {
data: ["数据1", "数据2", "数据3", "数据4"]
},
yAxis: {},
series: [{
name: '销量',
type: 'bar',
data: [5, 20, 36, 10]
}]
};
myChart.setOption(option);
```
在上述代码中,`option`对象定义了图表的基本结构和样式。一旦有了数据,可以通过调用`setOption`方法更新图表。如果数据来自后端,可以通过异步请求(如jQuery的`$.ajax`或fetch API)获取,然后将返回的数据填充到`option`中。
ECharts支持多种方式与后端交互,包括但不限于以下几种:
1. **Ajax请求**:使用XMLHttpRequest或fetch API发送GET或POST请求,获取JSON格式的数据,然后在回调函数中处理数据并更新图表。
2. **WebSocket**:如果需要实时更新数据,可以使用WebSocket建立持久连接,后端推送数据时前端直接更新图表。
3. **Server-Sent Events (SSE)**:服务器推模式,后端通过HTTP响应流持续向客户端发送事件,前端收到事件后更新图表。
在实际开发中,为了适应不同的需求,我们需要根据项目情况选择合适的交互方式。同时,为了提高性能,可以利用ECharts的动态加载和缓存机制,避免不必要的数据重新加载。
ECharts作为一款强大的JavaScript图表库,结合Java后端提供的数据,能够创建出富有视觉吸引力的图表,实现数据的高效呈现。在实际的JavaWeb项目中,我们需要理解如何正确地集成ECharts,以及如何设计后端接口以满足前端的数据请求,从而实现两者之间的流畅交互。
![avatar](https://profile-avatar.csdnimg.cn/93ba1d465bfb4371a0b11ca06a78b3f2_qq_57226198.jpg!1)
Raphael-laq
- 粉丝: 67
- 资源: 4
最新资源
- jdk1.8 Windows版本
- 智能网联实验小车的实验指导文档
- dwg cad 字体 shx 字体
- 智能网联实验小车的实验指导文档
- 智能网联实验小车的实验指导文档
- 智能网联实验小车的实验指导文档
- 智能网联实验小车的实验指导文档
- 快手无人直播变现项目玩法教程,直播间人气轻松破千上热门
- 智能网联实验小车的实验指导文档
- 智能网联实验小车的实验指导文档
- 智能网联实验小车的实验指导文档
- 智能网联实验小车的实验指导文档
- 智能网联实验小车的实验指导文档
- Rust 编程语言的入门教程,适合有一定编程基础的学习者快速上手 教程分为基础语法、核心概念和实用工具三个部分
- 美妆产品进销存管理系统的设计与开发ssm.zip
- 同城绘本馆的设计与开发ssm.zip