# echarts2javatag
**Repository Path**: paul.lmc/echarts2javatag
## Basic Information
- **Project Name**: echarts2javatag
- **Description**: 通过自定义标签实现echarts图表展示，借鉴了Android适配器的思想，通过固定的数据源，展现相关图表，无需考虑图表内部实现。
- **Primary Language**: Java
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No
## Statistics
- **Stars**: 0
- **Forks**: 31
- **Created**: 2019-05-21
- **Last Updated**: 2021-06-20
## Categories & Tags
**Categories**: Uncategorized
**Tags**: None
## README
# echarts2javatag
通过自定义标签实现echarts图表展示
**china_weather.db数据库:**
http://git.oschina.net/duhongming/echarts2javatag/attach_files
china_weather.7z >>>解压>>> 放到项目Src下面就行了！
**Maven:**
```xml
com.github.abel533
ECharts
2.2.7
com.google.code.gson
gson
[2.6.2,)
org.xerial
sqlite-jdbc
3.8.11.2
com.j256.ormlite
ormlite-jdbc
4.47
org.springframework
spring-websocket
${spring.version}
org.springframework
spring-messaging
${spring.version}
com.fasterxml.jackson.core
jackson-core
2.4.4
com.fasterxml.jackson.core
jackson-databind
2.4.4
com.fasterxml.jackson.core
jackson-annotations
2.4.4
```
-----------------动态版-----------------
**1 动态仪表盘Gauge的Tag:**
```xml
```
**1 动态仪表盘Gauge的数据格式:**
public class SocketDataGauge {
private String tag;
private Double value;
}
private List
Json数据格式：
[{"tag":"temperature1","value":178.03634028465075},{"tag":"temperature2","value":6482.322904395684},{"tag":"temperature3","value":2495.388315562964},{"tag":"temperature4","value":1358.7228569841902}]
**2 动态折线图Line的Tag:**
```xml
静态部分和以前一样：
var option =;
动态部分：
var uri = "/echarts2javatag/webSocket/line/data";
var ws = new SockJS(uri);
ws.onopen = function () {
//console.log('Info: connection opened.');
};
ws.onmessage = function (event) {
var json=eval("("+event.data+")");//将数据转成json格式
// 动态数据接口 addData
myChart.addData([
[
0, // 系列索引
json.value1, // 新增数据
true, // 新增数据是否从队列头部插入
false // 是否增加队列长度，false则自定删除原有数据，队头插入删队尾，队尾插入删队头
],
[
1, // 系列索引
json.value2, // 新增数据
false, // 新增数据是否从队列头部插入
false, // 是否增加队列长度，false则自定删除原有数据，队头插入删队尾，队尾插入删队头
json.tag // 坐标轴标签
]
]);
console.log('Received: ' + json);
};
```
**2 动态折线图Line的数据格式:**
静态部分：
//X轴的数据
List xAxisData;
//Y轴的数据
Map> yAxisData;
//Y轴双轴情况下的位置定位
Map yAxisIndex;
动态部分：
//X轴数据
private String tag;
//Y轴的1数据
private Double value1;
//Y轴的2数据
private Double value2;
-----------------高级版-----------------
**1 双数值轴折线图lineDoubleNum的Tag:**
```xml
```
**1 双数值轴折线图lineDoubleNum的数据格式:**
//每种类型数据是Double数组
private Map axisDataArr;
**2 搭配时间轴折线图lineTimeLine的Tag:**
```xml
```
**2 搭配时间轴折线图lineTimeLine的数据格式:**
//X轴的数据
List xAxisData;
//Y轴的数据
Map> yAxisData;
//Y轴双轴情况下的位置定位
Map yAxisIndex;
//TimeLine的Y轴数据
List>> timelineAxisData;
//TimeLine的X轴数据
List timelineData;
**3 反转条形图Bar的Tag:**
```xml
```
**3 反转条形图Bar的数据格式:**
//X轴的数据
private List xAxisData;
//Y轴的数据
private Map> yAxisData;
//Y轴双轴情况下的位置定位
private Map yAxisIndex;
**图表单位转换问题：待定**
-----------------基础版-----------------
**1 直线Line的Tag:**
```xml
```
**1 直线Line的数据格式:**
//X轴的数据
List xAxisData;
//Y轴的数据
Map> yAxisData;
//Y轴双轴情况下的位置定位
Map yAxisIndex;
**2 柱状图Bar的Tag:**
```xml
```
**2 柱状图Bar的数据格式:**
//X轴的数据
private List xAxisData;
//Y轴的数据
private Map> yAxisData;
//Y轴双轴情况下的位置定位
private Map yAxisIndex;
**3 饼图Pie的Tag:**
```xml
```
**3 饼图Pie的数据格式:**
//key-value数据
private Map orientData;
**4 玫瑰图Radar的Tag:**
```xml
```
**4 玫瑰图Radar的数据格式:**
//二维表结构数据
private List> orientData;