2
13693261870
2022-09-16 653761a31dfeb50dd3d007e892d69c90bf0cdafc
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
71
72
73
74
75
76
77
78
79
80
81
82
83
<!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:740px; height:420px;"></div>    <!--海岛监视监测-->
</body>
</html>
<script type="text/javascript">
    //海岛监视监测
    var divJC = document.getElementById("div_JianCe");
    var JianCe = echarts.init(divJC);
    var JCoption = {
        title : {
            text: '海岛监视监测',
            x:'left'
        },
        tooltip: {
            trigger: "item",
            formatter: "{a} <br/>{b} : {c}"
        },
        legend: {
            x: 'center',
            data: ['自然(km)','人工(km)','砂质(km)']
        },
        xAxis: [
            {
                type: "category",
                data: ['辽宁省','天津市','河北省','山东省','江苏省','上海市','浙江省','福建省','广东省','广西区','海南省'],
                boundaryGap: false
            }
        ],
        yAxis: [
            {
                type: "value",
                splitNumber: 10,
            }
        ],
        toolbox: {
            orient:'vertical',
            y:'center',
            show: true,
            feature: {
                mark: {
                    show: true
                },
                dataView: {
                    show: true,
                    readOnly: true
                },
                restore: {
                    show: true
                },
                saveAsImage: {
                    show: true
                }
            }
        },
        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>