1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
| <!DOCTYPE html>
| <html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.w3.org/1999/xhtml">
| <head>
| <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
| <title></title>
| <meta charset="utf-8" />
| <script th:src="@{${pubzyWebRoot} + 'echarts/echarts.min-3.0.js'}" type="text/javascript"></script>
| </head>
| <body>
| <div id="div_JianCe" style="width:300px; height:160px;"></div> <!--海岛监视监测-->
| </body>
| </html>
| <script type="text/javascript">
| //海岛监视监测
| var divJC = document.getElementById("div_JianCe");
| var JianCe = echarts.init(divJC);
| var JCoption ={
| tooltip: {
| trigger: "item",
| formatter: "{a} <br/>{b} : {c}"
| },
| xAxis: [
| {
| type: "category",
| axisLabel:{
| interval:0,//横轴信息全部显示
| rotate:45,
| },
| textStyle:{
| fontSize:9
| },
| data: ['辽宁省','天津市','河北省','山东省','江苏省','上海市','浙江省','福建省','广东省','广西区','海南省'],
| boundaryGap: false
| }
| ],
| yAxis: [
| {
| type: "value",
| splitNumber: 5,
| }
| ],
| grid:{
| x:40,
| y:10,
| y2:40,
| x2:10
| },
| calculable: true,
| series: [
| {
| name: "自然(km)",
| type: "line",
| data: [26.65,0,0,828.86,2573.2,689.8,0,689.89,132.7,0,72]
| },
| {
| name: "人工(km)",
| type: "line",
| data: [448.67,186,9154,194.3,7849.1,329.6,4317.9,184,156.08,276.1,33.4]
| },
| {
| name: "砂质(km)",
| type: "line",
| data: [530.13,0,4683.9,231.1,0,2494.1,133.2,185.7,5314,201.1,1123.1]
| }
| ]
| };
| JianCe.setOption(JCoption);
| </script>
|
|
