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
| <!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_YHFSMJTJindex" style="width:100%;margin-top: 10px;"></div> <!--海域使用确权证书用海方式面积统计-->
| </body>
| </html>
| <script type="text/javascript">
| $("#div_YHFSMJTJindex").css("height", window.innerHeight-10);
| //海域使用确权证书用海方式面积统计
| var div_YHFSMJTJindex = document.getElementById("div_YHFSMJTJindex");
| var YHFSMJTJ = echarts.init(div_YHFSMJTJindex);
| var YHFSMJTJoption = {
| 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:350,
| minAngle:5,
| selectedMode: 'single',
| selectedOffset: 20,
| data:[
| {value:140253.5314, name:'填海造地'},
| {value:27079.14273, name:'构筑物'},
| {value:234228.7619, name:'围海'},
| {value:2292763.458, name:'开放式'},
| {value:45484.2351, name:'其它方式'}
| ],
| itemStyle: {
| emphasis: {
| shadowBlur: 10,
| shadowOffsetX: 0,
| shadowColor: 'rgba(0, 0, 0, 0.5)'
| },
| normal:{
| label: {
| formatter: '{b} {d}%'
| }
| }
| },
| color: ['#FF7D53', '#6496EF', '#DD71D4', '#85CFFF', '#31CF32']
| }
| ]
| };
| YHFSMJTJ.setOption(YHFSMJTJoption);
| </script>
|
|
