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
69
70
| <!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} + 'media/js/jquery-1.11.1.js'}"></script>
| <script th:src="@{${pubzyWebRoot} + 'echarts/echarts.min-3.0.js'}" type="text/javascript"></script>
| </head>
| <body style="margin:0;background-color:#E9F8FE;">
| <div id="div_HYSYQQZSZHMJ" style="width:100%;margin-top: 10px;"></div> <!--海域使用确权证书宗海面积统计-->
| </body>
| </html>
| <script type="text/javascript">
| $("#div_HYSYQQZSZHMJ").css("height", window.innerHeight-10);
| //海域使用确权证书宗海面积统计
| var div_HYSYQQZSZHMJ = document.getElementById("div_HYSYQQZSZHMJ");
| var HYSYQQZSZHMJ = echarts.init(div_HYSYQQZSZHMJ);
| var HYSYQQZSZHMJoption = {
| title : {
| text: '海域使用确权证书宗海面积统计',
| x:'center',
| textStyle:{
| fontWeight:"normal",
| color: "#008acd"
| }
| },
| tooltip : {
| trigger: 'item',
| formatter: "{a} <br/>{b} : {c}公顷 ({d}%)"
| },
| series : [
| {
| name: '宗海面积',
| type: 'pie',
| radius : '70%',
| center: ['50%', '55%'],
| startAngle:320,
| minAngle:5,
| selectedMode: 'single',
| selectedOffset: 20,
| data:[
| {value:2393979.692, name:'渔业用海'},
| {value:109430.5935, name:'工业用海'},
| {value:133889.8633, name:'交通运输用海'},
| {value:18203.5468, name:'旅游娱乐用海'},
| {value:17366.1125, name:'海底工程用海'},
| {value:1875.0323, name:'排污倾倒用海'},
| {value:43944.3423, name:'造地工程用海'},
| {value:12526.0135, name:'特殊用海'},
| {value:5552.3476, name:'其它用海'}
| ],
| itemStyle: {
| emphasis: {
| shadowBlur: 10,
| shadowOffsetX: 0,
| shadowColor: 'rgba(0, 0, 0, 0.5)'
| },
| normal:{
| label: {
| formatter: '{b} {d}%'
| }
| }
| },
| color: ['#85CFFF', '#DD71D4', '#FF7D53', '#6496EF', '#31CF32','#D87A80','#2EC7C9','#97B552','#E5CF0D']
| }
| ]
| };
| HYSYQQZSZHMJ.setOption(HYSYQQZSZHMJoption);
| </script>
|
|
