修改gmap 注释

cesium_manage/remark.md

@@ -16,6 +16,8 @@ cmd: docker run --rm -v /root/gis/data:/root/gis/data osgeo/gdal:latest python3
 
 # sit
     doc: 47.112.166.173:8003/doc.html
+    web: 47.112.166.173:8003/back
+    展示：http://map.4dage.com/3dmap/
     
     需要把执行脚本放到/mnt/bash/ 目录下
     

gmap/pom.xml

@@ -2,8 +2,8 @@
 <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
 	xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
 	<modelVersion>4.0.0</modelVersion>
-	<packaging>war</packaging>
-	<!--<packaging>jar</packaging>-->
+	<!--<packaging>war</packaging>-->
+	<packaging>jar</packaging>
 	<parent>
 		<groupId>org.springframework.boot</groupId>
 		<artifactId>spring-boot-starter-parent</artifactId>

gmap/remark.md

@@ -1 +1,4 @@
-# 粤政图-网关
+# 粤政图-网关
+
+2022-06-29
+https://ztn-data.gdgov.cn:8581/GatewayMsg/http/api/proxy/invoke?PaasId=C90-44000240&PaasToken=6d7c857815ff43369028436c6cef5245&ServerCode&YZT1597746947329

gmap/run.sh

@@ -0,0 +1,60 @@
+#!/bin/sh
+APP_NAME=gmap.jar
+APP_PORT=8001
+APP_EVN=$2   #执行环境 sit|pro
+APP_ORDER=$1   #执行方法  start|stop|restart
+# 获取进程号
+APP_PID=`netstat -ntpl | grep $APP_PORT | grep LISTEN | awk '{print $7}' | awk -F "/" '{print $1}'`
+
+
+# 启动命令
+startApp(){
+    if [ ${APP_PID} ];
+    then
+    	echo "程序已经在运行了"
+    else
+    	echo "执行 start 方法"
+    	nohup java -jar -Xmx3072M -Xms512M ./$APP_NAME --spring.profiles.active=$APP_EVN --server.port=$APP_PORT > logs.log 2>error.log &  # 说明pid为空
+	echo Start Success!
+fi
+}
+
+# 停止命令
+stopApp(){
+    echo "执行 stop 方法"
+    if [ ${APP_PID} ];
+	then
+		echo $APP_NAME "存在，执行 stop 方法"
+			kill -9 ${APP_PID} && echo 'Kill Process!'
+	else
+		echo $APP_NAME 没有运行
+    fi
+}
+
+# 重启命令
+restartApp(){
+    echo " 1 执行 restart 方法"
+	stopApp
+	APP_PID=''  #将进程号置空
+	sleep 2
+	echo "进程号：" ${APP_PID} "端口号：" ${APP_PORT}
+	echo " 2 执行 restart 方法"
+	startApp
+}
+
+# 判断执行命令 取第一个参数
+case $APP_ORDER in
+    "start")
+        startApp
+        ;;
+    "stop")
+        stopApp
+        ;;
+	"restart")
+		restartApp
+        ;;
+        *)
+     ;;
+esac
+
+

gmap/src/main/java/com/geostar/gmap/api/controller/TestController.java

@@ -18,6 +18,7 @@ import java.net.HttpURLConnection;
 import java.net.URL;
 import java.net.URLDecoder;
 import java.net.URLEncoder;
+import java.time.LocalDateTime;
 import java.util.HashMap;
 import java.util.Map;
 
@@ -46,8 +47,20 @@ public class TestController {
 	}
 
 	/**
+	 * 测试服务是否可用
+	 * @return
+	 */
+	@GetMapping(value="/time")
+	public String time() {
+		logger.info("run time");
+		return LocalDateTime.now()+"";
+	}
+
+
+	/**
 	 * 直接文件流响应前端，测试成功
 	 * 浏览器：http://127.0.0.1:8003/gmap/test/stream
+	 * 浏览器：http://127.0.0.1:8001/gmap/test/stream
 	 * http://19.120.11.213:8080/gmap/test/stream
 	 *
 	 * @param resp

gmap/src/main/resources/application-sit.properties

@@ -2,7 +2,7 @@
 
 
 #log
-logging.path=/root/user/${project.name}_log
+logging.path=/root/log/${project.name}_log
 logging.config=classpath:logback-spring.xml
 logging.level.com.gis=debug
 

gmap/src/main/resources/application.properties

@@ -1,17 +1,17 @@
-server.port=8080
+server.port=8001
 server.servlet.context-path=/gmap
-spring.profiles.active=dev
+spring.profiles.active=sit
 
 project.name=gmap
 
-#应用的PaasId,用于智能网关模式
+#\u04E6\uFFFD\u00F5\uFFFDPaasId,\uFFFD\uFFFD\uFFFD\uFFFD\uFFFD\uFFFD\uFFFD\uFFFD\uFFFD\uFFFD\uFFFD\uFFFD\u0123\u02BD
 gateway.paasId=C90-44000240
-#应用的PaasToken,用于智能网关模式
+#\u04E6\uFFFD\u00F5\uFFFDPaasToken,\uFFFD\uFFFD\uFFFD\uFFFD\uFFFD\uFFFD\uFFFD\uFFFD\uFFFD\uFFFD\uFFFD\uFFFD\u0123\u02BD
 gateway.paasToken=6d7c857815ff43369028436c6cef5245
 
-#应用的PaasId,用于数据中台模式
+#\u04E6\uFFFD\u00F5\uFFFDPaasId,\uFFFD\uFFFD\uFFFD\uFFFD\uFFFD\uFFFD\uFFFD\uFFFD\uFFFD\uFFFD\u0328\u0123\u02BD
 bus.paasId=C90-44000240
-#应用的PaasToken,用于数据中台模式
+#\u04E6\uFFFD\u00F5\uFFFDPaasToken,\uFFFD\uFFFD\uFFFD\uFFFD\uFFFD\uFFFD\uFFFD\uFFFD\uFFFD\uFFFD\u0328\u0123\u02BD
 bus.paasToken=6d7c857815ff43369028436c6cef5245
 
 

gmap/src/main/resources/static/arcgis-api3.x/layer/WMTSLayerClass.js

@@ -0,0 +1,80 @@
+define(["dojo/_base/declare", "esri/layers/TiledMapServiceLayer", "esri/geometry/Extent", "esri/SpatialReference", "esri/layers/TileInfo"],
+    function (declare, TiledMapServiceLayer, Extent, SpatialReference, TileInfo) {
+        return declare(TiledMapServiceLayer, {
+            // 构造函数 
+            constructor: function (serviceUrl) {
+                // 图层提供的起始显示范围和整个图层的地理范围
+                this.spatialReference = new SpatialReference({ wkid: 4490 });
+                this.initialExtent = (this.fullExtent = new Extent(-180.0, -90.0, 180.0, 90.0, this.spatialReference));
+                var xml = this.getCapabilities(serviceUrl);
+                var json = $.xml2json(xml);
+                var data = json.Contents.Layer;
+                this.layerParam = {
+                    layerName: data.Abstract,
+                    styleName: data.Style.Identifier,
+                    tilematrixset: Array.isArray(data.TileMatrixSetLink) ? data.TileMatrixSetLink[0].TileMatrixSet : data.TileMatrixSetLink.TileMatrixSet
+                };
+                this.initMapParams = {
+                    origin: {
+                        "x": -180,
+                        "y": 90
+                    },
+                    spatialReference: {
+                        wkid: 4490
+                    },
+                    lods: [
+                        { "level": 0, "resolution": 1.40625, "scale": 591658710.909131 },
+                        { "level": 1, "resolution": 0.703125, "scale": 295829355.454566 },
+                        { "level": 2, "resolution": 0.3515625, "scale": 147914677.727283 },
+                        { "level": 3, "resolution": 0.17578125, "scale": 73957338.8636414 },
+                        { "level": 4, "resolution": 0.087890625, "scale": 36978669.4318207 },
+                        { "level": 5, "resolution": 0.0439453125, "scale": 18489334.7159103 },
+                        { "level": 6, "resolution": 0.02197265625, "scale": 9244667.35795517 },
+                        { "level": 7, "resolution": 0.010986328125, "scale": 4622333.67897759 },
+                        { "level": 8, "resolution": 0.0054931640625, "scale": 2311166.83948879 },
+                        { "level": 9, "resolution": 0.00274658203125, "scale": 1155583.4197444 },
+                        { "level": 10, "resolution": 0.001373291015625, "scale": 577791.709872198 },
+                        { "level": 11, "resolution": 0.0006866455078125, "scale": 288895.854936099 },
+                        { "level": 12, "resolution": 0.00034332275390625, "scale": 144447.92746805 },
+                        { "level": 13, "resolution": 0.000171661376953125, "scale": 72223.9637340248 },
+                        { "level": 14, "resolution": 8.58306884765625E-05, "scale": 36111.9818670124 },
+                        { "level": 15, "resolution": 4.29153442382813E-05, "scale": 18055.9909335062 },
+                        { "level": 16, "resolution": 2.14576721191406E-05, "scale": 9027.9954667531 },
+                        { "level": 17, "resolution": 1.07288360595703E-05, "scale": 4513.99773337655 },
+                        { "level": 18, "resolution": 5.36441802978515E-06, "scale": 2256.9988666882755 },
+                        { "level": 19, "resolution": 2.68220901489257E-06, "scale": 1128.4994333441377 },
+                        { "level": 20, "resolution": 1.34110450744629E-06, "scale": 564.2497166720689 }
+                    ]
+                };
+                
+                // 图层切片信息
+                this.tileInfo = new TileInfo({
+                    "rows": 256,
+                    "cols": 256,
+                    "compressionQuality": 0,
+                    "origin": this.initMapParams.origin,
+                    "spatialReference": this.initMapParams.spatialReference,
+                    "lods": this.initMapParams.lods
+                });
+                // 设置图层的loaded属性，并触发onLoad事件 
+                this.loaded = true;
+                this.onLoad(this);
+            },
+            getCapabilities: function(serviceUrl){
+                var xml;
+                $.ajax({
+                    type: "get",
+                    url: serviceUrl + "?SERVICE=WMTS&VERSION=1.0.0&REQUEST=GetCapabilities",
+                    async: false,
+                    success: function(result){
+                        xml = result;
+                    }
+                });
+                return xml;
+            },
+
+            getTileUrl: function (level, row, col) {
+                return this.url + "?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER="+ this.layerParam.layerName +"&STYLE="+ this.layerParam.styleName +"&TILEMATRIXSET="+ this.layerParam.tilematrixset +"&TILEMATRIX=" + level + "&TILEROW=" + row + "&TILECOL=" + col + "&FORMAT=image/tile";
+            }
+        });
+    }); 

gmap/src/main/resources/static/arcgis-api3.x/loadWMTSLayer.html

@@ -0,0 +1,90 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+
+    <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">
+    <title>arcgis-js-api 3.x 地图服务加载</title>
+    <link rel="stylesheet" href="./lib/css/esri.css">
+    <style>
+        html,
+        body,
+        #map {
+            height: 100%;
+            width: 100%;
+            margin: 0;
+            padding: 0;
+        }
+    </style>
+    <script>
+        //加载自己船舰的天地图文件path
+        var package_path = window.location.pathname.substring(0, window.location.pathname.lastIndexOf('/'));
+        var dojoConfig = {
+            packages: [{
+                name: "layer",
+                location: package_path + '/layer'
+            }]
+        };
+    </script>
+    <script src="http://libs.baidu.com/jquery/2.1.4/jquery.min.js"></script>
+    <script type="text/javascript" src="http://www.jsons.cn/Down/jquery.xml2json.js"></script>
+    <script src="./lib/js/init.js"></script>
+    <script>
+        require([
+            "esri/map",
+            "esri/layers/WMTSLayer",
+            "esri/layers/WMTSLayerInfo",
+            "esri/geometry/Extent",
+            "esri/geometry/Point",
+            "esri/layers/TileInfo",
+            "esri/SpatialReference",
+            "dojo/parser",
+            "layer/WMTSLayerClass",
+            "dijit/layout/BorderContainer",
+            "dijit/layout/ContentPane",
+            "dojo/domReady!"
+        ], function (Map, WMTSLayer, WMTSLayerInfo, Extent, Point, TileInfo, SpatialReference, parser, WMTSLayerClass) {
+            parser.parse();
+
+            var layerUrl = {
+                gdLayerUrl: "/gmap/gateway/geostar/GD_2018DLG/wmts",
+                gdAnnoLayerUrl: "/gmap/gateway/geostar/GD_2018DLGZJ/wmts",
+                wmtsLayerUrl: "/gmap/gateway/geostar/GDDOM/wmts"
+            }
+            var pt = new Point({
+                latitude: 23.150817871112068,
+                longitude: 113.28015136716937,
+                spatialReference: { wkid: 4490 }
+            });
+            var map = new Map("map", {
+                spatialReference: {
+                    wkid: 4490
+                },
+                center: pt,
+                zoom: 7
+            });
+            //底图
+            var gdLayer = new WMTSLayerClass(layerUrl.gdLayerUrl);
+            map.addLayer(gdLayer);
+            //注记
+            var gdAnnoLayer = new WMTSLayerClass(layerUrl.gdAnnoLayerUrl);
+            map.addLayer(gdAnnoLayer);
+            //地图服务
+            var wmtsLayer = new WMTSLayerClass(layerUrl.wmtsLayerUrl);
+            map.addLayer(wmtsLayer);
+        });
+    </script>
+</head>
+
+<body>
+    <div data-dojo-type="dijit/layout/BorderContainer" data-dojo-props="design:'headline', gutters:false"
+        style="width: 100%; height: 100%; margin: 0;">
+
+        <div id="map" data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'center'">
+        </div>
+
+    </div>
+</body>
+
+</html>

gmap/src/main/resources/static/arcgis-api3.x/wfsQueryLayer.html

@@ -0,0 +1,252 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+
+    <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">
+    <title>arcgis-js-api 3.x 要素服务加载</title>
+    <link rel="stylesheet" href="./lib/css/esri.css">
+    <style>
+        html,
+        body,
+        #map {
+            height: 100%;
+            width: 100%;
+            margin: 0;
+            padding: 0;
+        }
+
+        .selected-panel {
+            position: absolute;
+            right: 0px;
+            width: 230px;
+            height: 65px;
+            background: aliceblue;
+            z-index: 1;
+        }
+    </style>
+    <script>
+        //加载自己写的类文件path
+        var package_path = window.location.pathname.substring(0, window.location.pathname.lastIndexOf('/'));
+        var dojoConfig = {
+            packages: [{
+                name: "layer",
+                location: package_path + '/layer'
+            }]
+        };
+    </script>
+	<script src="../lib/mapbox/js/mapbox-gl.js"></script>
+    <script src="../lib/GeoGlobeSDK/GeoGlobeJS.min.js"></script>
+    <script src="http://libs.baidu.com/jquery/2.1.4/jquery.min.js"></script>
+    <script type="text/javascript" src="http://www.jsons.cn/Down/jquery.xml2json.js"></script>
+    <script src="./lib/js/init.js"></script>
+    <script>
+        require([
+            "esri/map",
+            "esri/geometry/Extent",
+            "esri/geometry/Point",
+            "esri/geometry/Polyline",
+            "esri/geometry/Polygon",
+            "esri/InfoTemplate",
+            "esri/graphic",
+            "esri/layers/GraphicsLayer",
+            "esri/symbols/SimpleFillSymbol",
+            "esri/symbols/SimpleLineSymbol",
+            "esri/symbols/SimpleMarkerSymbol",
+            "esri/Color",
+            "dojo/parser",
+            "layer/WMTSLayerClass",
+            "dijit/layout/BorderContainer",
+            "dijit/layout/ContentPane",
+            "dojo/domReady!"
+        ], function (Map, Extent, Point, Polyline, Polygon, InfoTemplate, Graphic, GraphicsLayer, SimpleFillSymbol, SimpleLineSymbol, SimpleMarkerSymbol, Color, parser, WMTSLayerClass) {
+            parser.parse();
+
+            var layerUrl = {
+                gdLayerUrl: "/gmap/gateway/geostar/GD_2018DLG/wmts",
+                gdAnnoLayerUrl: "/gmap/gateway/geostar/GD_2018DLGZJ/wmts",
+                polygonWfsUrl: "/gmap/gateway/geostar/GZSXJXZQHM_wfs/wfs",//面要素
+                pointWfsUrl: "/gmap/gateway/geostar/GD_SJJYZ/wfs",//点要素
+                lineWfsUrl: "/gmap/gateway/geostar/JTYST_GSGL2019/wfs" //线要素
+            }
+            var pt = new Point({
+                latitude: 23.150817871112068,
+                longitude: 113.28015136716937,
+                spatialReference: { wkid: 4490 }
+            });
+            var map = new Map("map", {
+                spatialReference: {
+                    wkid: 4490
+                },
+                center: pt,
+                zoom: 8
+            });
+            //底图
+            var gdLayer = new WMTSLayerClass(layerUrl.gdLayerUrl);
+            map.addLayer(gdLayer);
+            //注记
+            var gdAnnoLayer = new WMTSLayerClass(layerUrl.gdAnnoLayerUrl);
+            map.addLayer(gdAnnoLayer);
+
+            var graphicLayer = new GraphicsLayer();
+
+            var queryParams = {
+                url: layerUrl.pointWfsUrl,
+                typeName: '广东省际检疫站',
+            }
+            queryWfs(queryParams, function (result) {
+                if (result && result.features.length != 0) {
+                    loadPointWfs(result);
+                }
+            })
+
+            $(document).on("change", "#typeSelect", function () {
+                graphicLayer.clear();
+                var wfsType = $("#typeSelect").val();
+                if (wfsType == "点要素") {
+                    var queryParams = {
+                        url: layerUrl.pointWfsUrl,
+                        typeName: '广东省际检疫站',
+                    }
+                    queryWfs(queryParams, function (result) {
+                        if (result && result.features.length != 0) {
+                            loadPointWfs(result);
+                        }
+                    })
+                } else if (wfsType == "线要素") {
+                    var queryParams = {
+                        url: layerUrl.lineWfsUrl,
+                        typeName: 'JTYST_GSGL2019',
+                        filter: new GeoGlobe.Filter.Comparison({
+                            type: GeoGlobe.Filter.Comparison.LIKE,
+                            property: "XZQH",
+                            value: "4401%"
+                        }),
+                    }
+                    queryWfs(queryParams, function (result) {
+                        if (result && result.features.length != 0) {
+                            loadPolylineWfs(result);
+                        }
+                    })
+                } else if (wfsType == "面要素") {
+                    var queryParams = {
+                        url: layerUrl.polygonWfsUrl,
+                        typeName: 'GZSXJXZQHM',
+                    }
+                    queryWfs(queryParams, function (result) {
+                        if (result && result.features.length != 0) {
+                            loadPolygonWfs(result);
+                        }
+                    })
+                }
+            })
+
+            function queryWfs(queryParams, callback) {
+                if (!queryParams || !queryParams.url || !queryParams.typeName) {
+                    alert('未获取到查询的配置，无法进行要素查询操作！');
+                } else {
+                    var queryObj = new GeoGlobe.Query.WFSQuery(
+                    	queryParams.url, //服务地址 
+                        queryParams.typeName, //要素分类名 
+                        {
+                            geometryName: "GEOMETRY",
+                            format: new GeoGlobe.Format.GML.v2({ xy: true }),
+                            version: "1.0.0",
+                            maxFeatures: 999999 //限制查询的结果数 
+                        }
+                    );
+                    queryObj.query(queryParams.filter, callback, getFeatureFailFn);
+                }
+            }
+            function getFeatureFailFn() {
+                alert("查询失败！");
+            }
+
+            function loadPointWfs(result) {                
+                var defaultsymbol = new SimpleMarkerSymbol(SimpleMarkerSymbol.STYLE_CIRCLE, 20,
+                    new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID, new dojo.Color([255, 0, 0]), 1), new dojo.Color([0, 255, 0, 1]));
+                for (var i = 0; i < result.features.length; i++) {
+                	var infoTemplate = new InfoTemplate();
+                    infoTemplate.title = "属性信息";
+                    infoTemplate.content = result.features[i].attributes.检疫检查站名称;
+                    var pt = new Point(result.features[i].geometry.x, result.features[i].geometry.y);
+                    var graphic = new Graphic(pt, defaultsymbol, null, infoTemplate);
+                    graphicLayer.add(graphic);
+                }
+                map.addLayer(graphicLayer);
+            }
+
+            function loadPolygonWfs(result) {
+                //用来展示面的symbol
+                var fillSymbol = new SimpleFillSymbol(
+                    SimpleFillSymbol.STYLE_SOLID,
+                    new SimpleLineSymbol(
+                        SimpleLineSymbol.STYLE_SOLID,
+                        new Color('#000'),
+                        1
+                    ),
+                    new Color([255, 0, 0, 0.5])
+                );
+
+                var data = result.geojson.features;
+                for (var i = 0; i < data.length; i++) {
+                	var infoTemplate = new InfoTemplate();
+                    infoTemplate.title = "属性信息";
+                    infoTemplate.content = data[i].properties.XZQMC;
+                    var polygonJson = { "rings": data[i].geometry.coordinates, "spatialReference": { "wkid": 4490 } };
+                    var polygon = new Polygon(polygonJson);
+                    var graphic = new Graphic(polygon, fillSymbol, null, infoTemplate);
+                    graphicLayer.add(graphic);
+                }
+                map.addLayer(graphicLayer);
+            }
+
+            function loadPolylineWfs(result) {
+                //线的样式
+                var lineSymbol = new SimpleLineSymbol(
+                    SimpleLineSymbol.STYLE_DASH,
+                    new Color([255, 0, 0]),
+                    3
+                );
+                //构造线图层
+                var data = result.geojson.features;
+                for (var i = 0; i < data.length; i++) {
+                	 //浮云框信息
+                    var infoTemplate = new InfoTemplate();
+                    infoTemplate.title = "属性信息";
+                    infoTemplate.content = data[i].properties.ROADNAME;
+                    var polylineJson = { "paths": [data[i].geometry.coordinates], "spatialReference": { "wkid": 4490 } };
+                    var polyline = new Polyline(polylineJson);
+                    var graphic = new Graphic(polyline, lineSymbol, null, infoTemplate);
+                    graphicLayer.add(graphic);
+                }
+                map.addLayer(graphicLayer);
+            }
+        });
+
+
+    </script>
+</head>
+
+<body>
+    <div class="selected-panel">
+        <div style="padding: 20px;">
+            <label for="">选择要素类型：</label>
+            <select name="" id="typeSelect">
+                <option value="点要素">点要素</option>
+                <option value="线要素">线要素</option>
+                <option value="面要素">面要素</option>
+            </select>
+        </div>
+    </div>
+    <div data-dojo-type="dijit/layout/BorderContainer" data-dojo-props="design:'headline', gutters:false"
+        style="width: 100%; height: 100%; margin: 0;">
+
+        <div id="map" data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'center'">
+        </div>
+
+    </div>
+</body>
+
+</html>

gmap/src/main/resources/static/arcgis-api4.x/layerConfig.js

@@ -0,0 +1,50 @@
+
+function LayerConfig() { }
+
+LayerConfig.initMapParams = {
+    fullExtent: {//全图范围
+        xmin: -180,
+        ymin: -90,
+        xmax: 180,
+        ymax: 90
+    },
+    origin: {
+        "x": -180,
+        "y": 90
+    },
+    spatialReference: {
+        wkid: 4490
+    },
+    lods: [
+        { "level": 0, "resolution": 1.40625, "scale": 591658710.909131 },
+        { "level": 1, "resolution": 0.703125, "scale": 295829355.454566 },
+        { "level": 2, "resolution": 0.3515625, "scale": 147914677.727283 },
+        { "level": 3, "resolution": 0.17578125, "scale": 73957338.8636414 },
+        { "level": 4, "resolution": 0.087890625, "scale": 36978669.4318207 },
+        { "level": 5, "resolution": 0.0439453125, "scale": 18489334.7159103 },
+        { "level": 6, "resolution": 0.02197265625, "scale": 9244667.35795517 },
+        { "level": 7, "resolution": 0.010986328125, "scale": 4622333.67897759 },
+        { "level": 8, "resolution": 0.0054931640625, "scale": 2311166.83948879 },
+        { "level": 9, "resolution": 0.00274658203125, "scale": 1155583.4197444 },
+        { "level": 10, "resolution": 0.001373291015625, "scale": 577791.709872198 },
+        { "level": 11, "resolution": 0.0006866455078125, "scale": 288895.854936099 },
+        { "level": 12, "resolution": 0.00034332275390625, "scale": 144447.92746805 },
+        { "level": 13, "resolution": 0.000171661376953125, "scale": 72223.9637340248 },
+        { "level": 14, "resolution": 8.58306884765625E-05, "scale": 36111.9818670124 },
+        { "level": 15, "resolution": 4.29153442382813E-05, "scale": 18055.9909335062 },
+        { "level": 16, "resolution": 2.14576721191406E-05, "scale": 9027.9954667531 },
+        { "level": 17, "resolution": 1.07288360595703E-05, "scale": 4513.99773337655 },
+        { "level": 18, "resolution": 5.36441802978515E-06, "scale": 2256.9988666882755 },
+        { "level": 19, "resolution": 2.68220901489257E-06, "scale": 1128.4994333441377 },
+        { "level": 20, "resolution": 1.34110450744629E-06, "scale": 564.2497166720689 }
+    ]
+}
+
+LayerConfig.tileInfo = {
+    "rows": 256,
+    "cols": 256,
+    "compressionQuality": 0,
+    "origin": LayerConfig.initMapParams.origin,
+    "spatialReference": LayerConfig.initMapParams.spatialReference,
+    "lods": LayerConfig.initMapParams.lods
+};

gmap/src/main/resources/static/arcgis-api4.x/wfsQueryLayer.html

@@ -0,0 +1,335 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no" />
+    <title>arcgis-js-api 4.x 要素服务加载</title>
+    <style>
+        html,
+        body,
+        #viewDiv {
+            padding: 0;
+            margin: 0;
+            height: 100%;
+            width: 100%;
+        }
+
+        .selected-panel {
+            position: absolute;
+            right: 0px;
+            width: 230px;
+            height: 65px;
+            background: aliceblue;
+            z-index: 1;
+        }
+    </style>
+
+    <link rel="stylesheet" href="https://app.gdeei.cn/arcgis-js-api/library/4.15/esri/themes/light/main.css" />
+    <script src="../lib/mapbox/js/mapbox-gl.js"></script>
+    <script src="../lib/GeoGlobeSDK/GeoGlobeJS.min.js"></script>
+    <script src="http://libs.baidu.com/jquery/2.1.4/jquery.min.js"></script>
+    <script type="text/javascript" src="http://www.jsons.cn/Down/jquery.xml2json.js"></script>
+    <script src="https://app.gdeei.cn/arcgis-js-api/library/4.15/init.js"></script>
+    <script src="./layerConfig.js"></script>
+	<script src="../js/Tianditu.js"></script>
+    <script>
+        require(["esri/Map",
+            "esri/views/MapView",
+            "esri/layers/WebTileLayer",
+            "esri/layers/GraphicsLayer",
+            "esri/Graphic",
+            "esri/geometry/SpatialReference",
+            "esri/geometry/Point",
+            "esri/layers/support/TileInfo"
+        ],
+            function (Map, MapView, WebTileLayer, GraphicsLayer, Graphic, SpatialReference, Point, TileInfo) {
+                var layerUrl = {
+                    gdLayerUrl: "/gmap/gateway/geostar/GD_2018DLG/wmts",
+                    gdAnnoLayerUrl: "/gmap/gateway/geostar/GD_2018DLGZJ/wmts",
+                    polygonWfsUrl: "/gmap/gateway/geostar/GZSXJXZQHM_wfs/wfs",//面要素
+                    pointWfsUrl: "/gmap/gateway/geostar/GD_SJJYZ/wfs",//点要素
+                    lineWfsUrl: "/gmap/gateway/geostar/JTYST_GSGL2019/wfs" //线要素
+                }
+
+                var spatialReference = new SpatialReference({
+                    wkid: 4490
+                });
+                //底图
+                var gdLayer = layerManager(layerUrl.gdLayerUrl);
+                //注记
+                var gdAnnoLayer = layerManager(layerUrl.gdAnnoLayerUrl);
+                var map = new Map({
+                    spatialReference: {
+                        wkid: 4490
+                    },
+                    basemap: {
+                        baseLayers: [gdLayer, gdAnnoLayer]
+                    }
+                });
+                var pt = new Point({
+                    latitude: 23.150817871112068,
+                    longitude: 113.28015136716937,
+                    spatialReference: { wkid: 4490 }
+                });
+                var view = new MapView({
+                    container: "viewDiv",
+                    map: map,
+                    spatialReference: {
+                        wkid: 4490
+                    },
+                    zoom: 8,
+                    center: pt,
+                });
+
+                var graphicsLayer = new GraphicsLayer();
+
+                var queryParams = {
+                    url: layerUrl.pointWfsUrl,
+                    typeName: '广东省际检疫站',
+                }
+                queryWfs(queryParams, function (result) {
+                    if (result && result.features.length != 0) {
+                        loadPointWfs(result);
+                    }
+                })
+
+                $(document).on("change", "#typeSelect", function () {
+                    graphicsLayer.removeAll();
+                    var wfsType = $("#typeSelect").val();
+                    if (wfsType == "点要素") {
+                        var queryParams = {
+                            url: layerUrl.pointWfsUrl,
+                            typeName: '广东省际检疫站',
+                        }
+                        queryWfs(queryParams, function (result) {
+                            if (result && result.features.length != 0) {
+                                loadPointWfs(result);
+                            }
+                        })
+                    } else if (wfsType == "线要素") {
+                        var queryParams = {
+                            url: layerUrl.lineWfsUrl,
+                            typeName: 'JTYST_GSGL2019',
+                            filter: new GeoGlobe.Filter.Comparison({
+                                type: GeoGlobe.Filter.Comparison.LIKE,
+                                property: "XZQH",
+                                value: "4401%"
+                            }),
+                        }
+                        queryWfs(queryParams, function (result) {
+                            if (result && result.features.length != 0) {
+                                loadPolylineWfs(result);
+                            }
+                        })
+                    } else if (wfsType == "面要素") {
+                        var queryParams = {
+                            url: layerUrl.polygonWfsUrl,
+                            typeName: 'GZSXJXZQHM',
+                        }
+                        queryWfs(queryParams, function (result) {
+                            if (result && result.features.length != 0) {
+                                loadPolygonWfs(result);
+                            }
+                        })
+                    }
+                })
+
+                function queryWfs(queryParams, callback) {
+                    if (!queryParams || !queryParams.url || !queryParams.typeName) {
+                        alert('未获取到查询的配置，无法进行要素查询操作！');
+                    } else {
+                        var queryObj = new GeoGlobe.Query.WFSQuery(
+                        	queryParams.url, //服务地址 
+                            queryParams.typeName, //要素分类名 
+                            {
+                                geometryName: "GEOMETRY",
+                                format: new GeoGlobe.Format.GML.v2({ xy: true }),
+                                version: "1.0.0",
+                                maxFeatures: 999999 //限制查询的结果数 
+                            }
+                        );
+                        queryObj.query(queryParams.filter, callback, getFeatureFailFn);
+                    }
+                }
+                function getFeatureFailFn() {
+                    alert("查询失败！");
+                }
+
+                function layerManager(serviceUrl) {
+                    var xml;
+                    $.ajax({
+                        type: "get",
+                        url: serviceUrl + "?SERVICE=WMTS&VERSION=1.0.0&REQUEST=GetCapabilities",
+                        async: false,
+                        success: function (result) {
+                            xml = result;
+                        }
+                    });
+                    //var xml = this.getCapabilities(serviceUrl);
+                    var json = $.xml2json(xml);
+                    var data = json.Contents.Layer;
+                    var layerName = data.Abstract;
+                    var styleName = data.Style.Identifier;
+                    var tilematrixset = data.TileMatrixSetLink[0].TileMatrixSet;
+                    return new WebTileLayer({
+                        urlTemplate: window.location.origin + serviceUrl +
+                            "?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=" + layerName + "&STYLE=" + styleName + "&TILEMATRIXSET=" + tilematrixset + "&TILEMATRIX={level}&TILEROW={row}&TILECOL={col}&FORMAT=image/png",
+                        spatialReference: spatialReference,
+                        tileInfo: new TileInfo(LayerConfig.tileInfo)
+                    });
+                }
+                
+                function loadPointWfs(result) {
+                    //点样式
+                    var markerSymbol = {
+                        type: "simple-marker",
+                        color: [226, 119, 40],
+                        outline: {
+                            color: [255, 255, 255],
+                            width: 2
+                        }
+                    };
+
+                    for (var i = 0; i < result.features.length; i++) {
+                        var point = { type: "point", longitude: result.features[i].geometry.x, latitude: result.features[i].geometry.y };
+                        var pointGraphic = new Graphic({
+                            geometry: point,
+                            symbol: markerSymbol,
+                            attributes: {
+                                检疫检查站名称: result.features[i].attributes.检疫检查站名称,
+                                具体位置: result.features[i].attributes.具体位置,
+                                检查站站长及负责人及联系电话: result.features[i].attributes.检查站站长及负责人及联系电话,
+                                地市: result.features[i].attributes.地市
+                            },
+                            popupTemplate: {
+                                title: "属性信息",
+                                content: [
+                                    {
+                                        type: "fields",
+                                        fieldInfos: [
+                                            {
+                                                fieldName: "检疫检查站名称"
+                                            },
+                                            {
+                                                fieldName: "具体位置"
+                                            },
+                                            {
+                                                fieldName: "检查站站长及负责人及联系电话"
+                                            },
+                                            {
+                                                fieldName: "地市"
+                                            }
+                                        ]
+                                    }
+                                ]
+                            }
+                        });
+                        graphicsLayer.graphics.push(pointGraphic);
+                        // view.graphics.add(pointGraphic)
+                    }
+                    map.add(graphicsLayer);
+                }
+
+                function loadPolylineWfs(result) {
+                    //线样式
+                    var lineSymbol = {
+                        type: "simple-line", // autocasts as SimpleLineSymbol()
+                        color: [226, 119, 40],
+                        width: 4
+                    };
+                    var data = result.geojson.features;
+                    for (var i = 0; i < data.length; i++) {
+                        var polyline = { type: "polyline", paths: data[i].geometry.coordinates };
+                        var polylineGraphic = new Graphic({
+                            geometry: polyline,
+                            symbol: lineSymbol,
+                            attributes: {
+                                Name: data[i].properties.ROADNAME,
+                                Gydw: data[i].properties.GYDW,
+                                Gylb: data[i].properties.GYLB
+                            },
+                            popupTemplate: {
+                                title: "属性信息",
+                                content: [
+                                    {
+                                        type: "fields",
+                                        fieldInfos: [
+                                            {
+                                                fieldName: "Name"
+                                            },
+                                            {
+                                                fieldName: "Gydw"
+                                            },
+                                            {
+                                                fieldName: "Gylb"
+                                            }
+                                        ]
+                                    }
+                                ]
+                            }
+                        });
+                        graphicsLayer.graphics.push(polylineGraphic);
+                        // view.graphics.add(polylineGraphic);
+                    }
+                    map.add(graphicsLayer);
+                }
+
+                function loadPolygonWfs(result) {
+                    //面样式
+                    var fillSymbol = {
+                        type: "simple-fill",
+                        color: [227, 139, 79, 0.8],
+                        outline: {
+                            color: [255, 255, 255],
+                            width: 1
+                        }
+                    };
+                    var data = result.geojson.features;
+                    for (var i = 0; i < data.length; i++) {
+                        var polygon = { type: "polygon", rings: data[i].geometry.coordinates[0] };
+                        var polygonGraphic = new Graphic({
+                            geometry: polygon,
+                            symbol: fillSymbol,
+                            attributes: {
+                                Name: data[i].properties.XZQMC
+                            },
+                            popupTemplate: {
+                                title: "属性信息",
+                                content: [
+                                    {
+                                        type: "fields",
+                                        fieldInfos: [
+                                            {
+                                                fieldName: "Name"
+                                            }
+                                        ]
+                                    }
+                                ]
+                            }
+                        });
+                        graphicsLayer.graphics.push(polygonGraphic);
+                        // view.graphics.add(polygonGraphic);
+                    }
+                    map.add(graphicsLayer);
+                }
+
+            });
+    </script>
+</head>
+
+<body>
+    <div class="selected-panel">
+        <div style="padding: 20px;">
+            <label for="">选择要素类型：</label>
+            <select name="" id="typeSelect">
+                <option value="点要素">点要素</option>
+                <option value="线要素">线要素</option>
+                <option value="面要素">面要素</option>
+            </select>
+        </div>
+    </div>
+    <div id="viewDiv"></div>
+</body>
+
+</html>

gmap/src/main/resources/static/arcgis-api4.x/wmtsLayer.html

@@ -0,0 +1,102 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no" />
+    <title>arcgis-js-api 4.x 地图服务加载</title>
+    <style>
+        html,
+        body,
+        #viewDiv {
+            padding: 0;
+            margin: 0;
+            height: 100%;
+            width: 100%;
+        }
+    </style>
+
+    <link rel="stylesheet" href="https://app.gdeei.cn/arcgis-js-api/library/4.15/esri/themes/light/main.css" />
+    <script src="http://libs.baidu.com/jquery/2.1.4/jquery.min.js"></script>
+    <script type="text/javascript" src="http://www.jsons.cn/Down/jquery.xml2json.js"></script>
+    <script src="./layerConfig.js"></script>
+    <script src="../js/Tianditu.js"></script>
+    <script src="https://app.gdeei.cn/arcgis-js-api/library/4.15/init.js"></script>
+
+    <script>
+        require(["esri/Map",
+            "esri/views/MapView",
+            "esri/layers/WebTileLayer",
+            "esri/geometry/SpatialReference",
+            "esri/geometry/Point",
+            "esri/layers/support/TileInfo"
+        ],
+            function (Map, MapView, WebTileLayer, SpatialReference, Point, TileInfo) {
+                var proxyLayerUrl = {
+                    gdLayerUrl: "/gmap/gateway/geostar/GD_2018DLG/wmts",
+                    gdAnnoLayerUrl: "/gmap/gateway/geostar/GD_2018DLGZJ/wmts",
+                    wmtsLayerUrl: "/gmap/gateway/geostar/GDDOM/wmts"
+                }
+                var spatialReference = new SpatialReference({
+                    wkid: 4490
+                });
+                function layerManager(proxyServiceUrl) {
+                    var xml;
+                    $.ajax({
+                        type: "get",
+                        url: proxyServiceUrl + "?SERVICE=WMTS&VERSION=1.0.0&REQUEST=GetCapabilities",
+                        async: false,
+                        success: function (result) {
+                            xml = result;
+                        }
+                    });
+                    var json = $.xml2json(xml);
+                    var data = json.Contents.Layer;
+                    var layerName = data.Abstract;
+                    var styleName = data.Style.Identifier;
+                    var tilematrixset = data.TileMatrixSetLink[0].TileMatrixSet;
+                    return new WebTileLayer({
+                        urlTemplate: window.location.origin + proxyServiceUrl +
+                            "?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=" + layerName + "&STYLE=" + styleName + "&TILEMATRIXSET=" + tilematrixset + "&TILEMATRIX={level}&TILEROW={row}&TILECOL={col}&FORMAT=image/png",
+                        spatialReference: spatialReference,
+                        tileInfo: new TileInfo(LayerConfig.tileInfo)
+                    });
+                }
+                //底图
+                var gdLayer = layerManager(proxyLayerUrl.gdLayerUrl);
+                //注记
+                var gdAnnoLayer = layerManager(proxyLayerUrl.gdAnnoLayerUrl);
+                //地图服务
+                var wmtsLayer = layerManager(proxyLayerUrl.wmtsLayerUrl);
+                var map = new Map({
+                    spatialReference: {
+                        wkid: 4490
+                    },
+                    basemap: {
+                        baseLayers: [gdLayer, gdAnnoLayer, wmtsLayer]
+                    }
+                });
+                var pt = new Point({
+                    latitude: 23.150817871112068,
+                    longitude: 113.28015136716937,
+                    spatialReference: { wkid: 4490 }
+                });
+                var view = new MapView({
+                    container: "viewDiv",
+                    map: map,
+                    spatialReference: {
+                        wkid: 4490
+                    },
+                    zoom: 8,
+                    center: pt, 
+                });
+ 
+            });
+    </script>
+</head>
+
+<body>
+    <div id="viewDiv"></div>
+</body>
+
+</html>

gmap/src/main/resources/static/arcgis-api4.x/wmtsLayer2.html

@@ -0,0 +1,73 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no" />
+    <title>arcgis-js-api 4.x 地图服务加载</title>
+    <style>
+        html,
+        body,
+        #viewDiv {
+            padding: 0;
+            margin: 0;
+            height: 100%;
+            width: 100%;
+        }
+    </style>
+
+    <link rel="stylesheet" href="https://app.gdeei.cn/arcgis-js-api/library/4.15/esri/themes/light/main.css" />
+    <script src="./layerConfig.js"></script>
+    <script src="https://app.gdeei.cn/arcgis-js-api/library/4.15/init.js"></script>
+
+    <script>
+        require(["esri/Map",
+            "esri/views/MapView",
+            "esri/layers/WebTileLayer",
+            "esri/geometry/SpatialReference",
+            "esri/geometry/Point",
+            "esri/layers/support/TileInfo"
+        ],
+            function (Map, MapView, WebTileLayer, SpatialReference, Point, TileInfo) {
+                var spatialReference = new SpatialReference({
+                    wkid: 4490
+                });
+
+                var dgLayer = new WebTileLayer({
+                    urlTemplate: 'http://localhost:8080/gmap/gateway/DLG/wmts?SERVICE=WMTS&VERSION=1.0.0&REQUEST=GetTile&LAYER=DGDLG2020_DT&FORMAT=image/png&TILEMATRIXSET=Matrix_0&TILEMATRIX={level}&TILEROW={row}&TILECOL={col}',
+                    spatialReference: spatialReference,
+                    tileInfo: new TileInfo(LayerConfig.tileInfo)
+                });
+
+                var map = new Map({
+                    spatialReference: {
+                        wkid: 4490
+                    },
+                    basemap: {
+                        baseLayers: [dgLayer]
+                    }
+                });
+                var pt = new Point({
+                    latitude: 23.03264,
+                    longitude: 113.75054,
+                    spatialReference: { wkid: 4490 }
+                });
+                var view = new MapView({
+                    container: "viewDiv",
+                    map: map,
+                    spatialReference: {
+                        wkid: 4490
+                    },
+                    zoom: 18,
+                    center: pt, 
+                });
+ 
+            });
+    </script>
+</head>
+
+<body>
+    <div id="viewDiv"></div>
+</body>
+
+</html>

gmap/src/main/resources/static/lib/GeoGlobe MapBoxGL JavaScript SDK/GeoGlobe/GeoLevel.js

@@ -0,0 +1,70 @@
+
+GeoGlobe.INCHES_PER_UNIT["m"] = 1/0.0254;//1/0.025399998;
+
+//获取层级比例尺分母对应的级别
+//var lvl_tdt = getLevelFormScale(2.958293554545656E8); //1
+
+function getRealLevel(relativeLvl,scale, units, dpi){
+	var lvl = getLevelFormScale(scale, units, dpi);
+	return parseInt(relativeLvl) == lvl ? 0 : lvl;
+}
+
+//获得级别 scale第一个级别比例尺 units单位
+function getLevelFormScale(scale, units, dpi){
+	var units = units ? units : "degrees";
+	var dpi = dpi ? dpi : 96;
+	var resolution = getResolutionFromScale_DPI(scale, units, dpi);
+	var lvl = getLevelFormResolution(resolution, units);
+	return lvl;
+}
+
+function getResolutionFromScale_DPI(scale, units, dpi) {
+    var resolution;
+    if (scale) {
+        if (units == null) {
+            units = "degrees";
+        }
+        var normScale = GeoGlobe.Util.normalizeScale(scale);
+        resolution = 1 / (normScale * GeoGlobe.INCHES_PER_UNIT[units] * dpi);
+    }
+    return resolution;
+}
+
+function getLevelFormResolution(resolution, units){
+    if (!resolution) {
+        return 0;
+    }
+	var zoom, i, diff;
+	var minDiff = Number.POSITIVE_INFINITY;
+	var resolutions = getResolutions(units);
+	for (i = 0, len = resolutions.length; i < len; i++) {
+		//判断当前分辨率与金字塔中分辨率最接近的
+        diff = Math.abs(resolutions[i] - resolution);
+        if (diff > minDiff) {
+            break;
+        }
+        minDiff = diff;
+	}
+	zoom = Math.max(0, i - 1);//0和(i - 1)中取大数。
+	return zoom ;
+}
+
+function getResolutions(units){
+	var resolutions = new Array();
+	for (var i = 0; i <= 20; i++) {
+		resolutions.push(getResolutionForLevel(i, units));
+	}
+	return resolutions;
+}
+
+function getResolutionForLevel(level, units){
+	//var topTileWidth = Math.abs(this.topTileToX - this.topTileFromX);//360
+	var units = units ? units : "degrees";
+	var topTileWidth = 360;//周长360度
+	if(units === "m"){
+		topTileWidth = 40075016.6855784;//周长40075016.6855784米=20037508.3427892*2 
+	}
+	var tileSize = 256;//256
+	var maxResolution = (topTileWidth / 256);
+	return maxResolution / Math.pow(2, level);		
+}

gmap/src/main/resources/static/lib/GeoGlobe MapBoxGL JavaScript SDK/draw/mapbox-gl-draw-cirle.js

@@ -0,0 +1,134 @@
+var CircleMode = {};
+var origon;
+var snapAngle;
+var angle;
+var sides;
+var destination;
+var id;
+// When the mode starts this function will be called.
+// The `opts` argument comes from `draw.changeMode('lotsofpoints', {count:7})`.
+// The value returned should be an object and will be passed to all other lifecycle functions
+CircleMode.onSetup = function (opts) {
+    var state = {};
+    destination = {};
+    origon = null;
+
+    sides = opts.sides || 40;
+    if (sides < 40) {
+        sides = 40;
+    }
+    var polygon = this.newFeature({
+        'type': 'Feature',
+        'geometry': {
+            'type': 'Polygon',
+            'coordinates': [[]]
+        },
+        "properties": {
+            //sides: state.sides
+        }
+    });
+    //sides = state.sides?state.sides:40;
+    this.addFeature(polygon);
+
+    this.clearSelectedFeatures();
+    //doubleClickZoom.disable(this);
+    this.updateUIClasses({ mouse: 'add' });
+    this.activateUIButton('polygon');
+    this.setActionableState({
+        trash: true
+    });
+    return {
+        polygon: polygon,
+        id: polygon,
+        currentVertexPosition: 0
+    };
+
+};
+CircleMode.onClick = function (state, e) {
+    origon = { x: e.lngLat.lng, y: e.lngLat.lat };
+    if (state.currentVertexPosition > 0 && destination && destination.x == origon.x && destination.y == origon.y) {
+        this.map.fire("draw.create", {
+            features: [state.polygon.toGeoJSON()]
+        });
+        return this.changeMode('simple_select', { featureIds: [state.polygon.id] });
+    }
+    var radius = 0.0439453125;
+    angle = Math.PI * (1 / sides - 1 / 2);
+    if (snapAngle) {
+        angle += snapAngle * (Math.PI / 180)
+    }
+
+    var feature = getcircle(origon, radius, sides, snapAngle);
+
+    this.updateUIClasses({ mouse: 'add' });
+    this.deleteFeature([state.id], { silent: true });
+    state.currentVertexPosition++;
+    state.polygon.coordinates = [feature];
+    this.addFeature(state.polygon);
+};
+CircleMode.onMouseMove = function (state, e) {
+    if (origon) {
+        destination = { x: e.lngLat.lng, y: e.lngLat.lat };
+        calculateAngle(destination);
+        var radius = distanceTo(destination);
+        //                var value = getGreatCircleDistance(origon[1], origon[0], destination[1], destination[0]);
+        //                map.setPaintProperty('measure-points', 'circle-radius', parseFloat(value));
+        var feature = getcircle(origon, radius, sides, snapAngle);
+        this.deleteFeature([id], { silent: true });
+        state.polygon.coordinates = [feature];
+        this.addFeature(state.polygon);
+    }
+};
+// Whenever a user clicks on a key while focused on the map, it will be sent here
+CircleMode.onKeyUp = function (state, e) {
+    if (e.keyCode === 27) return this.changeMode('simple_select');
+};
+
+// This is the only required function for a mode.
+// It decides which features currently in Draw's data store will be rendered on the map.
+// All features passed to `display` will be rendered, so you can pass multiple display features per internal feature.
+// See `styling-draw` in `API.md` for advice on making display features
+CircleMode.toDisplayFeatures = function (state, geojson, display) {
+    display(geojson);
+};
+CircleMode.onTrash = function (state) {
+    this.deleteFeature([state.polygon.id], { silent: true });
+    this.changeMode('simple_select');
+};
+
+function calculateAngle(point, evt) {
+    var alpha = Math.atan2(point.y - origon.y, point.x - origon.x);
+    if (snapAngle && this.snapToggle && !evt[this.snapToggle]) {
+        var snapAngleRad = Math.PI / 180 * snapAngle;
+        angle = Math.round(alpha / snapAngleRad) * snapAngleRad
+    } else {
+        angle = alpha
+    }
+}
+function distanceTo(destination, options) {
+    var edge = !(options && options.edge === false);
+    var details = edge && options && options.details;
+    var distance, x0, y0, x1, y1, result;
+    x0 = origon.x;
+    y0 = origon.y;
+    x1 = destination.x;
+    y1 = destination.y;
+    distance = Math.sqrt(Math.pow(x0 - x1, 2) + Math.pow(y0 - y1, 2));
+    result = !details ? distance : { x0: x0, y0: y0, x1: x1, y1: y1, distance: distance }
+    return result
+}
+function getcircle(origin, radius, sides, rotation) {
+    var angle = Math.PI * (1 / sides - 1 / 2);
+    if (rotation) {
+        angle += rotation / 180 * Math.PI
+    }
+    var rotatedAngle, x, y;
+    var points = [];
+    for (var i = 0; i < sides; ++i) {
+        rotatedAngle = angle + i * 2 * Math.PI / sides;
+        x = origin.x + radius * Math.cos(rotatedAngle);
+        y = origin.y + radius * Math.sin(rotatedAngle);
+        points.push([x, y])
+    }
+    return points;
+}

gmap/src/main/resources/static/lib/GeoGlobe MapBoxGL JavaScript SDK/draw/mapbox-gl-draw-ellipse.js

@@ -0,0 +1,126 @@
+"use strict";
+
+var doubleClickZoom = {
+    enable: function enable(ctx) {
+        setTimeout(function () {
+            if (!ctx.map || !ctx.map.doubleClickZoom || !ctx._ctx || !ctx._ctx.store || !ctx._ctx.store.getInitialConfigValue) return;
+            if (!ctx._ctx.store.getInitialConfigValue("doubleClickZoom")) return;
+            ctx.map.doubleClickZoom.enable();
+        }, 0);
+    },
+    disable: function disable(ctx) {
+        setTimeout(function () {
+            if (!ctx.map || !ctx.map.doubleClickZoom) return;
+            ctx.map.doubleClickZoom.disable();
+        }, 0);
+    }
+};
+
+var DrawEllipse = {
+    onSetup: function onSetup(opts) {
+        this.eccentricity = opts.eccentricity >= 0 && opts.eccentricity < 1 ? opts.eccentricity : 0.8;
+        this.divisions = opts.divisions || 60;
+
+        var ellipse = this.newFeature({
+            type: "Feature",
+            properties: {},
+            geometry: {
+                type: "Polygon",
+                coordinates: [[]]
+            }
+        });
+        this.addFeature(ellipse);
+        this.clearSelectedFeatures();
+        doubleClickZoom.disable(this);
+        this.updateUIClasses({mouse: "add"});
+        this.setActionableState({
+            trash: true
+        });
+        return {
+            ellipse: ellipse
+        };
+    },
+    // 支持移动端触摸
+    onTap: function onTap(state, e) {
+        if (state.center) this.onMouseMove(state, e);
+        this.onClick(state, e);
+    },
+    // 每当用户点击地图时，Draw将调用`onClick`
+    onClick: function onClick(state, e) {
+        // 如果state.center存在，则表示其第二次单击
+        // 更改为simple_select模式
+        if (state.center && state.center[0] !== e.lngLat.lng && state.center[1] !== e.lngLat.lat) {
+            this.updateUIClasses({mouse: "pointer"});
+            this.changeMode("simple_select", {featuresId: state.ellipse.id});
+        }
+        // 在第一次单击时，保存单击的点坐标作为椭圆的中心点
+        state.center = [e.lngLat.lng, e.lngLat.lat];
+    },
+    onMouseMove: function onMouseMove(state, e) {
+        // 根据椭圆离心率e=√(1-b^2/a^2)，计算出b=a√(1-e^2)
+        if (state.center) {
+            var xRadius = Math.sqrt(Math.pow(e.lngLat.lng - state.center[0], 2) + Math.pow(e.lngLat.lat - state.center[1], 2));
+            var yRadius = xRadius * Math.sqrt(1 - Math.pow(this.eccentricity, 2));
+
+            var radian = Math.atan2(e.lngLat.lat - state.center[1], e.lngLat.lng - state.center[0]);
+
+            var twoPi = Math.PI * 2;
+
+            for (var i = 0, length = this.divisions; i <= length; i++) {
+                var t = i / length;
+                var angle = t * twoPi;
+
+                var x = state.center[0] + xRadius * Math.cos(angle);
+                var y = state.center[1] + yRadius * Math.sin(angle);
+
+                if (radian !== 0) {
+                    var cos = Math.cos(radian);
+                    var sin = Math.sin(radian);
+
+                    var tx = x - state.center[0];
+                    var ty = y - state.center[1];
+
+                    // 围绕椭圆中心旋转点。
+                    x = tx * cos - ty * sin + state.center[0];
+                    y = tx * sin + ty * cos + state.center[1];
+                }
+
+                // 更新要素坐标
+                state.ellipse.updateCoordinate("0." + i, x, y);
+            }
+        }
+    },
+    // 每当用户在聚焦地图时点击某个键时，它将在此处发送
+    onKeyUp: function onKeyUp(state, e) {
+        if (e.keyCode === 27) return this.changeMode("simple_select");
+    },
+    onStop: function onStop(state) {
+        doubleClickZoom.enable(this);
+        this.updateUIClasses({mouse: "none"});
+        this.activateUIButton();
+
+        // 检查我们是否删除了此要素
+        if (this.getFeature(state.ellipse.id) === undefined) return;
+
+        if (state.ellipse.isValid()) {
+            this.map.fire("draw.create", {
+                features: [state.ellipse.toGeoJSON()]
+            });
+        } else {
+            this.deleteFeature([state.ellipse.id], {silent: true});
+            this.changeMode("simple_select", {}, {silent: true});
+        }
+    },
+    toDisplayFeatures: function toDisplayFeatures(state, geojson, display) {
+        var isActivePolygon = geojson.properties.id === state.ellipse.id;
+        geojson.properties.active = isActivePolygon ? "true" : "false";
+        if (!isActivePolygon) return display(geojson);
+
+        if (!state.center) return;
+        return display(geojson);
+    },
+    onTrash: function onTrash(state) {
+        this.deleteFeature([state.ellipse.id], {silent: true});
+        this.changeMode("simple_select");
+    }
+};

gmap/src/main/resources/static/lib/GeoGlobe MapBoxGL JavaScript SDK/draw/mapbox-gl-draw-rectangle.js

@@ -0,0 +1,112 @@
+"use strict";
+
+var doubleClickZoom = {
+    enable: function enable(ctx) {
+        setTimeout(function () {
+            // First check we've got a map and some context.
+            if (!ctx.map || !ctx.map.doubleClickZoom || !ctx._ctx || !ctx._ctx.store || !ctx._ctx.store.getInitialConfigValue) return;
+            // Now check initial state wasn't false (we leave it disabled if so)
+            if (!ctx._ctx.store.getInitialConfigValue("doubleClickZoom")) return;
+            ctx.map.doubleClickZoom.enable();
+        }, 0);
+    },
+    disable: function disable(ctx) {
+        setTimeout(function () {
+            if (!ctx.map || !ctx.map.doubleClickZoom) return;
+            // Always disable here, as it's necessary in some cases.
+            ctx.map.doubleClickZoom.disable();
+        }, 0);
+    }
+};
+
+var DrawRectangle = {
+    // When the mode starts this function will be called.
+    onSetup: function onSetup(opts) {
+        var rectangle = this.newFeature({
+            type: "Feature",
+            properties: {},
+            geometry: {
+                type: "Polygon",
+                coordinates: [[]]
+            }
+        });
+        this.addFeature(rectangle);
+        this.clearSelectedFeatures();
+        doubleClickZoom.disable(this);
+        this.updateUIClasses({mouse: "add"});
+        this.setActionableState({
+            trash: true
+        });
+        return {
+            rectangle: rectangle
+        };
+    },
+    // support mobile taps
+    onTap: function onTap(state, e) {
+        // emulate 'move mouse' to update feature coords
+        if (state.startPoint) this.onMouseMove(state, e);
+        // emulate onClick
+        this.onClick(state, e);
+    },
+    // Whenever a user clicks on the map, Draw will call `onClick`
+    onClick: function onClick(state, e) {
+        // if state.startPoint exist, means its second click
+        //change to  simple_select mode
+        if (state.startPoint && state.startPoint[0] !== e.lngLat.lng && state.startPoint[1] !== e.lngLat.lat) {
+            this.updateUIClasses({mouse: "pointer"});
+            state.endPoint = [e.lngLat.lng, e.lngLat.lat];
+            this.changeMode("simple_select", {featuresId: state.rectangle.id});
+        }
+        // on first click, save clicked point coords as starting for  rectangle
+        var startPoint = [e.lngLat.lng, e.lngLat.lat];
+        state.startPoint = startPoint;
+    },
+    onMouseMove: function onMouseMove(state, e) {
+        // if startPoint, update the feature coordinates, using the bounding box concept
+        // we are simply using the startingPoint coordinates and the current Mouse Position
+        // coordinates to calculate the bounding box on the fly, which will be our rectangle
+        if (state.startPoint) {
+            state.rectangle.updateCoordinate("0.0", state.startPoint[0], state.startPoint[1]); //minX, minY - the starting point
+            state.rectangle.updateCoordinate("0.1", e.lngLat.lng, state.startPoint[1]); // maxX, minY
+            state.rectangle.updateCoordinate("0.2", e.lngLat.lng, e.lngLat.lat); // maxX, maxY
+            state.rectangle.updateCoordinate("0.3", state.startPoint[0], e.lngLat.lat); // minX,maxY
+            state.rectangle.updateCoordinate("0.4", state.startPoint[0], state.startPoint[1]); //minX,minY - ending point (equals to starting point)
+        }
+    },
+    // Whenever a user clicks on a key while focused on the map, it will be sent here
+    onKeyUp: function onKeyUp(state, e) {
+        if (e.keyCode === 27) return this.changeMode("simple_select");
+    },
+    onStop: function onStop(state) {
+        doubleClickZoom.enable(this);
+        this.updateUIClasses({mouse: "none"});
+        this.activateUIButton();
+
+        // check to see if we've deleted this feature
+        if (this.getFeature(state.rectangle.id) === undefined) return;
+
+        //remove last added coordinate
+        state.rectangle.removeCoordinate("0.4");
+        if (state.rectangle.isValid()) {
+            this.map.fire("draw.create", {
+                features: [state.rectangle.toGeoJSON()]
+            });
+        } else {
+            this.deleteFeature([state.rectangle.id], {silent: true});
+            this.changeMode("simple_select", {}, {silent: true});
+        }
+    },
+    toDisplayFeatures: function toDisplayFeatures(state, geojson, display) {
+        var isActivePolygon = geojson.properties.id === state.rectangle.id;
+        geojson.properties.active = isActivePolygon ? "true" : "false";
+        if (!isActivePolygon) return display(geojson);
+
+        // Only render the rectangular polygon if it has the starting point
+        if (!state.startPoint) return;
+        return display(geojson);
+    },
+    onTrash: function onTrash(state) {
+        this.deleteFeature([state.rectangle.id], {silent: true});
+        this.changeMode("simple_select");
+    }
+};

gmap/src/main/resources/static/lib/GeoGlobe MapBoxGL JavaScript SDK/draw/mapbox-gl-draw-square.js

@@ -0,0 +1,115 @@
+"use strict";
+
+var doubleClickZoom = {
+    enable: function enable(ctx) {
+        setTimeout(function () {
+            // 首先检查我们是否有地图和一些背景信息
+            if (!ctx.map || !ctx.map.doubleClickZoom || !ctx._ctx || !ctx._ctx.store || !ctx._ctx.store.getInitialConfigValue) return;
+            // 现在检查初始状态是不是假（如果是这样，我们将其禁用）
+            if (!ctx._ctx.store.getInitialConfigValue("doubleClickZoom")) return;
+            ctx.map.doubleClickZoom.enable();
+        }, 0);
+    },
+    disable: function disable(ctx) {
+        setTimeout(function () {
+            if (!ctx.map || !ctx.map.doubleClickZoom) return;
+            // 在这里总是禁用，因为在某些情况下这是必要的。
+            ctx.map.doubleClickZoom.disable();
+        }, 0);
+    }
+};
+
+var DrawSquare = {
+    onSetup: function onSetup(opts) {
+        var square = this.newFeature({
+            type: "Feature",
+            properties: {},
+            geometry: {
+                type: "Polygon",
+                coordinates: [[]]
+            }
+        });
+        this.addFeature(square);
+        this.clearSelectedFeatures();
+        doubleClickZoom.disable(this);
+        this.updateUIClasses({mouse: "add"});
+        this.setActionableState({
+            trash: true
+        });
+        return {
+            square: square
+        };
+    },
+    // 支持移动端触摸
+    onTap: function onTap(state, e) {
+        // 模拟“移动鼠标”以更新要素坐标
+        if (state.startPoint) this.onMouseMove(state, e);
+        // 模拟onClick
+        this.onClick(state, e);
+    },
+    // 每当用户点击地图时，Draw将调用`onClick`
+    onClick: function onClick(state, e) {
+        // 如果state.startPoint存在，则表示其第二次单击
+        // 更改为simple_select模式
+        if (state.startPoint && state.startPoint[0] !== e.lngLat.lng && state.startPoint[1] !== e.lngLat.lat) {
+            this.updateUIClasses({mouse: "pointer"});
+            this.changeMode("simple_select", {featuresId: state.square.id});
+        }
+        // 在第一次单击时，保存单击的点坐标作为正方形的开始
+        state.startPoint = [e.lngLat.lng, e.lngLat.lat];
+    },
+    onMouseMove: function onMouseMove(state, e) {
+        // 如果是startPoint，更新要素坐标，使用边界框概念
+        // 使用startPoint坐标和当前鼠标位置坐标来动态计算边界框
+        // 将经度跨度和纬度跨度的最大值作为正方形的边长，操作体验更好
+        if (state.startPoint) {
+            var xLength = e.lngLat.lng - state.startPoint[0];
+            var yLength = e.lngLat.lat - state.startPoint[1];
+            var sideLength = Math.max(Math.abs(xLength), Math.abs(yLength));
+            var lng = state.startPoint[0] + sideLength * (xLength > 0 ? 1 : -1);
+            var lat = state.startPoint[1] + sideLength * (yLength > 0 ? 1 : -1);
+
+            state.square.updateCoordinate("0.0", state.startPoint[0], state.startPoint[1]); //minX, minY - 起点
+            state.square.updateCoordinate("0.1", lng, state.startPoint[1]); // maxX, minY
+            state.square.updateCoordinate("0.2", lng, lat); // maxX, maxY
+            state.square.updateCoordinate("0.3", state.startPoint[0], lat); // minX,maxY
+            state.square.updateCoordinate("0.4", state.startPoint[0], state.startPoint[1]); //minX,minY - 终点 (跟起点一样)
+        }
+    },
+    // 每当用户在聚焦地图时点击某个键时，它将在此处发送
+    onKeyUp: function onKeyUp(state, e) {
+        if (e.keyCode === 27) return this.changeMode("simple_select");
+    },
+    onStop: function onStop(state) {
+        doubleClickZoom.enable(this);
+        this.updateUIClasses({mouse: "none"});
+        this.activateUIButton();
+
+        // 检查我们是否删除了此要素
+        if (this.getFeature(state.square.id) === undefined) return;
+
+        // 删除最后添加的坐标
+        state.square.removeCoordinate("0.4");
+        if (state.square.isValid()) {
+            this.map.fire("draw.create", {
+                features: [state.square.toGeoJSON()]
+            });
+        } else {
+            this.deleteFeature([state.square.id], {silent: true});
+            this.changeMode("simple_select", {}, {silent: true});
+        }
+    },
+    toDisplayFeatures: function toDisplayFeatures(state, geojson, display) {
+        var isActivePolygon = geojson.properties.id === state.square.id;
+        geojson.properties.active = isActivePolygon ? "true" : "false";
+        if (!isActivePolygon) return display(geojson);
+
+        // 仅在具有起点的正方形时才渲染
+        if (!state.startPoint) return;
+        return display(geojson);
+    },
+    onTrash: function onTrash(state) {
+        this.deleteFeature([state.square.id], {silent: true});
+        this.changeMode("simple_select");
+    }
+};

gmap/src/main/resources/static/lib/mapbox/mapbox-gl-draw/mapbox-gl-draw-cirle.js

@@ -0,0 +1,134 @@
+var CircleMode = {};
+var origon;
+var snapAngle;
+var angle;
+var sides;
+var destination;
+var id;
+// When the mode starts this function will be called.
+// The `opts` argument comes from `draw.changeMode('lotsofpoints', {count:7})`.
+// The value returned should be an object and will be passed to all other lifecycle functions
+CircleMode.onSetup = function (opts) {
+    var state = {};
+    destination = {};
+    origon = null;
+
+    sides = opts.sides || 40;
+    if (sides < 40) {
+        sides = 40;
+    }
+    var polygon = this.newFeature({
+        'type': 'Feature',
+        'geometry': {
+            'type': 'Polygon',
+            'coordinates': [[]]
+        },
+        "properties": {
+            //sides: state.sides
+        }
+    });
+    //sides = state.sides?state.sides:40;
+    this.addFeature(polygon);
+
+    this.clearSelectedFeatures();
+    //doubleClickZoom.disable(this);
+    this.updateUIClasses({ mouse: 'add' });
+    this.activateUIButton('polygon');
+    this.setActionableState({
+        trash: true
+    });
+    return {
+        polygon: polygon,
+        id: polygon,
+        currentVertexPosition: 0
+    };
+
+};
+CircleMode.onClick = function (state, e) {
+    origon = { x: e.lngLat.lng, y: e.lngLat.lat };
+    if (state.currentVertexPosition > 0 && destination && destination.x == origon.x && destination.y == origon.y) {
+        this.map.fire("draw.create", {
+            features: [state.polygon.toGeoJSON()]
+        });
+        return this.changeMode('simple_select', { featureIds: [state.polygon.id] });
+    }
+    var radius = 0.0439453125;
+    angle = Math.PI * (1 / sides - 1 / 2);
+    if (snapAngle) {
+        angle += snapAngle * (Math.PI / 180)
+    }
+
+    var feature = getcircle(origon, radius, sides, snapAngle);
+
+    this.updateUIClasses({ mouse: 'add' });
+    this.deleteFeature([state.id], { silent: true });
+    state.currentVertexPosition++;
+    state.polygon.coordinates = [feature];
+    this.addFeature(state.polygon);
+};
+CircleMode.onMouseMove = function (state, e) {
+    if (origon) {
+        destination = { x: e.lngLat.lng, y: e.lngLat.lat };
+        calculateAngle(destination);
+        var radius = distanceTo(destination);
+        //                var value = getGreatCircleDistance(origon[1], origon[0], destination[1], destination[0]);
+        //                map.setPaintProperty('measure-points', 'circle-radius', parseFloat(value));
+        var feature = getcircle(origon, radius, sides, snapAngle);
+        this.deleteFeature([id], { silent: true });
+        state.polygon.coordinates = [feature];
+        this.addFeature(state.polygon);
+    }
+};
+// Whenever a user clicks on a key while focused on the map, it will be sent here
+CircleMode.onKeyUp = function (state, e) {
+    if (e.keyCode === 27) return this.changeMode('simple_select');
+};
+
+// This is the only required function for a mode.
+// It decides which features currently in Draw's data store will be rendered on the map.
+// All features passed to `display` will be rendered, so you can pass multiple display features per internal feature.
+// See `styling-draw` in `API.md` for advice on making display features
+CircleMode.toDisplayFeatures = function (state, geojson, display) {
+    display(geojson);
+};
+CircleMode.onTrash = function (state) {
+    this.deleteFeature([state.polygon.id], { silent: true });
+    this.changeMode('simple_select');
+};
+
+function calculateAngle(point, evt) {
+    var alpha = Math.atan2(point.y - origon.y, point.x - origon.x);
+    if (snapAngle && this.snapToggle && !evt[this.snapToggle]) {
+        var snapAngleRad = Math.PI / 180 * snapAngle;
+        angle = Math.round(alpha / snapAngleRad) * snapAngleRad
+    } else {
+        angle = alpha
+    }
+}
+function distanceTo(destination, options) {
+    var edge = !(options && options.edge === false);
+    var details = edge && options && options.details;
+    var distance, x0, y0, x1, y1, result;
+    x0 = origon.x;
+    y0 = origon.y;
+    x1 = destination.x;
+    y1 = destination.y;
+    distance = Math.sqrt(Math.pow(x0 - x1, 2) + Math.pow(y0 - y1, 2));
+    result = !details ? distance : { x0: x0, y0: y0, x1: x1, y1: y1, distance: distance }
+    return result
+}
+function getcircle(origin, radius, sides, rotation) {
+    var angle = Math.PI * (1 / sides - 1 / 2);
+    if (rotation) {
+        angle += rotation / 180 * Math.PI
+    }
+    var rotatedAngle, x, y;
+    var points = [];
+    for (var i = 0; i < sides; ++i) {
+        rotatedAngle = angle + i * 2 * Math.PI / sides;
+        x = origin.x + radius * Math.cos(rotatedAngle);
+        y = origin.y + radius * Math.sin(rotatedAngle);
+        points.push([x, y])
+    }
+    return points;
+}

gmap/src/main/resources/static/lib/mapbox/mapbox-gl-draw/mapbox-gl-draw-ellipse.js

@@ -0,0 +1,126 @@
+"use strict";
+
+var doubleClickZoom = {
+    enable: function enable(ctx) {
+        setTimeout(function () {
+            if (!ctx.map || !ctx.map.doubleClickZoom || !ctx._ctx || !ctx._ctx.store || !ctx._ctx.store.getInitialConfigValue) return;
+            if (!ctx._ctx.store.getInitialConfigValue("doubleClickZoom")) return;
+            ctx.map.doubleClickZoom.enable();
+        }, 0);
+    },
+    disable: function disable(ctx) {
+        setTimeout(function () {
+            if (!ctx.map || !ctx.map.doubleClickZoom) return;
+            ctx.map.doubleClickZoom.disable();
+        }, 0);
+    }
+};
+
+var DrawEllipse = {
+    onSetup: function onSetup(opts) {
+        this.eccentricity = opts.eccentricity >= 0 && opts.eccentricity < 1 ? opts.eccentricity : 0.8;
+        this.divisions = opts.divisions || 60;
+
+        var ellipse = this.newFeature({
+            type: "Feature",
+            properties: {},
+            geometry: {
+                type: "Polygon",
+                coordinates: [[]]
+            }
+        });
+        this.addFeature(ellipse);
+        this.clearSelectedFeatures();
+        doubleClickZoom.disable(this);
+        this.updateUIClasses({mouse: "add"});
+        this.setActionableState({
+            trash: true
+        });
+        return {
+            ellipse: ellipse
+        };
+    },
+    // 支持移动端触摸
+    onTap: function onTap(state, e) {
+        if (state.center) this.onMouseMove(state, e);
+        this.onClick(state, e);
+    },
+    // 每当用户点击地图时，Draw将调用`onClick`
+    onClick: function onClick(state, e) {
+        // 如果state.center存在，则表示其第二次单击
+        // 更改为simple_select模式
+        if (state.center && state.center[0] !== e.lngLat.lng && state.center[1] !== e.lngLat.lat) {
+            this.updateUIClasses({mouse: "pointer"});
+            this.changeMode("simple_select", {featuresId: state.ellipse.id});
+        }
+        // 在第一次单击时，保存单击的点坐标作为椭圆的中心点
+        state.center = [e.lngLat.lng, e.lngLat.lat];
+    },
+    onMouseMove: function onMouseMove(state, e) {
+        // 根据椭圆离心率e=√(1-b^2/a^2)，计算出b=a√(1-e^2)
+        if (state.center) {
+            var xRadius = Math.sqrt(Math.pow(e.lngLat.lng - state.center[0], 2) + Math.pow(e.lngLat.lat - state.center[1], 2));
+            var yRadius = xRadius * Math.sqrt(1 - Math.pow(this.eccentricity, 2));
+
+            var radian = Math.atan2(e.lngLat.lat - state.center[1], e.lngLat.lng - state.center[0]);
+
+            var twoPi = Math.PI * 2;
+
+            for (var i = 0, length = this.divisions; i <= length; i++) {
+                var t = i / length;
+                var angle = t * twoPi;
+
+                var x = state.center[0] + xRadius * Math.cos(angle);
+                var y = state.center[1] + yRadius * Math.sin(angle);
+
+                if (radian !== 0) {
+                    var cos = Math.cos(radian);
+                    var sin = Math.sin(radian);
+
+                    var tx = x - state.center[0];
+                    var ty = y - state.center[1];
+
+                    // 围绕椭圆中心旋转点。
+                    x = tx * cos - ty * sin + state.center[0];
+                    y = tx * sin + ty * cos + state.center[1];
+                }
+
+                // 更新要素坐标
+                state.ellipse.updateCoordinate("0." + i, x, y);
+            }
+        }
+    },
+    // 每当用户在聚焦地图时点击某个键时，它将在此处发送
+    onKeyUp: function onKeyUp(state, e) {
+        if (e.keyCode === 27) return this.changeMode("simple_select");
+    },
+    onStop: function onStop(state) {
+        doubleClickZoom.enable(this);
+        this.updateUIClasses({mouse: "none"});
+        this.activateUIButton();
+
+        // 检查我们是否删除了此要素
+        if (this.getFeature(state.ellipse.id) === undefined) return;
+
+        if (state.ellipse.isValid()) {
+            this.map.fire("draw.create", {
+                features: [state.ellipse.toGeoJSON()]
+            });
+        } else {
+            this.deleteFeature([state.ellipse.id], {silent: true});
+            this.changeMode("simple_select", {}, {silent: true});
+        }
+    },
+    toDisplayFeatures: function toDisplayFeatures(state, geojson, display) {
+        var isActivePolygon = geojson.properties.id === state.ellipse.id;
+        geojson.properties.active = isActivePolygon ? "true" : "false";
+        if (!isActivePolygon) return display(geojson);
+
+        if (!state.center) return;
+        return display(geojson);
+    },
+    onTrash: function onTrash(state) {
+        this.deleteFeature([state.ellipse.id], {silent: true});
+        this.changeMode("simple_select");
+    }
+};

gmap/src/main/resources/static/lib/mapbox/mapbox-gl-draw/mapbox-gl-draw-rectangle.js

@@ -0,0 +1,112 @@
+"use strict";
+
+var doubleClickZoom = {
+    enable: function enable(ctx) {
+        setTimeout(function () {
+            // First check we've got a map and some context.
+            if (!ctx.map || !ctx.map.doubleClickZoom || !ctx._ctx || !ctx._ctx.store || !ctx._ctx.store.getInitialConfigValue) return;
+            // Now check initial state wasn't false (we leave it disabled if so)
+            if (!ctx._ctx.store.getInitialConfigValue("doubleClickZoom")) return;
+            ctx.map.doubleClickZoom.enable();
+        }, 0);
+    },
+    disable: function disable(ctx) {
+        setTimeout(function () {
+            if (!ctx.map || !ctx.map.doubleClickZoom) return;
+            // Always disable here, as it's necessary in some cases.
+            ctx.map.doubleClickZoom.disable();
+        }, 0);
+    }
+};
+
+var DrawRectangle = {
+    // When the mode starts this function will be called.
+    onSetup: function onSetup(opts) {
+        var rectangle = this.newFeature({
+            type: "Feature",
+            properties: {},
+            geometry: {
+                type: "Polygon",
+                coordinates: [[]]
+            }
+        });
+        this.addFeature(rectangle);
+        this.clearSelectedFeatures();
+        doubleClickZoom.disable(this);
+        this.updateUIClasses({mouse: "add"});
+        this.setActionableState({
+            trash: true
+        });
+        return {
+            rectangle: rectangle
+        };
+    },
+    // support mobile taps
+    onTap: function onTap(state, e) {
+        // emulate 'move mouse' to update feature coords
+        if (state.startPoint) this.onMouseMove(state, e);
+        // emulate onClick
+        this.onClick(state, e);
+    },
+    // Whenever a user clicks on the map, Draw will call `onClick`
+    onClick: function onClick(state, e) {
+        // if state.startPoint exist, means its second click
+        //change to  simple_select mode
+        if (state.startPoint && state.startPoint[0] !== e.lngLat.lng && state.startPoint[1] !== e.lngLat.lat) {
+            this.updateUIClasses({mouse: "pointer"});
+            state.endPoint = [e.lngLat.lng, e.lngLat.lat];
+            this.changeMode("simple_select", {featuresId: state.rectangle.id});
+        }
+        // on first click, save clicked point coords as starting for  rectangle
+        var startPoint = [e.lngLat.lng, e.lngLat.lat];
+        state.startPoint = startPoint;
+    },
+    onMouseMove: function onMouseMove(state, e) {
+        // if startPoint, update the feature coordinates, using the bounding box concept
+        // we are simply using the startingPoint coordinates and the current Mouse Position
+        // coordinates to calculate the bounding box on the fly, which will be our rectangle
+        if (state.startPoint) {
+            state.rectangle.updateCoordinate("0.0", state.startPoint[0], state.startPoint[1]); //minX, minY - the starting point
+            state.rectangle.updateCoordinate("0.1", e.lngLat.lng, state.startPoint[1]); // maxX, minY
+            state.rectangle.updateCoordinate("0.2", e.lngLat.lng, e.lngLat.lat); // maxX, maxY
+            state.rectangle.updateCoordinate("0.3", state.startPoint[0], e.lngLat.lat); // minX,maxY
+            state.rectangle.updateCoordinate("0.4", state.startPoint[0], state.startPoint[1]); //minX,minY - ending point (equals to starting point)
+        }
+    },
+    // Whenever a user clicks on a key while focused on the map, it will be sent here
+    onKeyUp: function onKeyUp(state, e) {
+        if (e.keyCode === 27) return this.changeMode("simple_select");
+    },
+    onStop: function onStop(state) {
+        doubleClickZoom.enable(this);
+        this.updateUIClasses({mouse: "none"});
+        this.activateUIButton();
+
+        // check to see if we've deleted this feature
+        if (this.getFeature(state.rectangle.id) === undefined) return;
+
+        //remove last added coordinate
+        state.rectangle.removeCoordinate("0.4");
+        if (state.rectangle.isValid()) {
+            this.map.fire("draw.create", {
+                features: [state.rectangle.toGeoJSON()]
+            });
+        } else {
+            this.deleteFeature([state.rectangle.id], {silent: true});
+            this.changeMode("simple_select", {}, {silent: true});
+        }
+    },
+    toDisplayFeatures: function toDisplayFeatures(state, geojson, display) {
+        var isActivePolygon = geojson.properties.id === state.rectangle.id;
+        geojson.properties.active = isActivePolygon ? "true" : "false";
+        if (!isActivePolygon) return display(geojson);
+
+        // Only render the rectangular polygon if it has the starting point
+        if (!state.startPoint) return;
+        return display(geojson);
+    },
+    onTrash: function onTrash(state) {
+        this.deleteFeature([state.rectangle.id], {silent: true});
+        this.changeMode("simple_select");
+    }
+};

gmap/src/main/resources/static/lib/mapbox/mapbox-gl-draw/mapbox-gl-draw-square.js

@@ -0,0 +1,115 @@
+"use strict";
+
+var doubleClickZoom = {
+    enable: function enable(ctx) {
+        setTimeout(function () {
+            // 首先检查我们是否有地图和一些背景信息
+            if (!ctx.map || !ctx.map.doubleClickZoom || !ctx._ctx || !ctx._ctx.store || !ctx._ctx.store.getInitialConfigValue) return;
+            // 现在检查初始状态是不是假（如果是这样，我们将其禁用）
+            if (!ctx._ctx.store.getInitialConfigValue("doubleClickZoom")) return;
+            ctx.map.doubleClickZoom.enable();
+        }, 0);
+    },
+    disable: function disable(ctx) {
+        setTimeout(function () {
+            if (!ctx.map || !ctx.map.doubleClickZoom) return;
+            // 在这里总是禁用，因为在某些情况下这是必要的。
+            ctx.map.doubleClickZoom.disable();
+        }, 0);
+    }
+};
+
+var DrawSquare = {
+    onSetup: function onSetup(opts) {
+        var square = this.newFeature({
+            type: "Feature",
+            properties: {},
+            geometry: {
+                type: "Polygon",
+                coordinates: [[]]
+            }
+        });
+        this.addFeature(square);
+        this.clearSelectedFeatures();
+        doubleClickZoom.disable(this);
+        this.updateUIClasses({mouse: "add"});
+        this.setActionableState({
+            trash: true
+        });
+        return {
+            square: square
+        };
+    },
+    // 支持移动端触摸
+    onTap: function onTap(state, e) {
+        // 模拟“移动鼠标”以更新要素坐标
+        if (state.startPoint) this.onMouseMove(state, e);
+        // 模拟onClick
+        this.onClick(state, e);
+    },
+    // 每当用户点击地图时，Draw将调用`onClick`
+    onClick: function onClick(state, e) {
+        // 如果state.startPoint存在，则表示其第二次单击
+        // 更改为simple_select模式
+        if (state.startPoint && state.startPoint[0] !== e.lngLat.lng && state.startPoint[1] !== e.lngLat.lat) {
+            this.updateUIClasses({mouse: "pointer"});
+            this.changeMode("simple_select", {featuresId: state.square.id});
+        }
+        // 在第一次单击时，保存单击的点坐标作为正方形的开始
+        state.startPoint = [e.lngLat.lng, e.lngLat.lat];
+    },
+    onMouseMove: function onMouseMove(state, e) {
+        // 如果是startPoint，更新要素坐标，使用边界框概念
+        // 使用startPoint坐标和当前鼠标位置坐标来动态计算边界框
+        // 将经度跨度和纬度跨度的最大值作为正方形的边长，操作体验更好
+        if (state.startPoint) {
+            var xLength = e.lngLat.lng - state.startPoint[0];
+            var yLength = e.lngLat.lat - state.startPoint[1];
+            var sideLength = Math.max(Math.abs(xLength), Math.abs(yLength));
+            var lng = state.startPoint[0] + sideLength * (xLength > 0 ? 1 : -1);
+            var lat = state.startPoint[1] + sideLength * (yLength > 0 ? 1 : -1);
+
+            state.square.updateCoordinate("0.0", state.startPoint[0], state.startPoint[1]); //minX, minY - 起点
+            state.square.updateCoordinate("0.1", lng, state.startPoint[1]); // maxX, minY
+            state.square.updateCoordinate("0.2", lng, lat); // maxX, maxY
+            state.square.updateCoordinate("0.3", state.startPoint[0], lat); // minX,maxY
+            state.square.updateCoordinate("0.4", state.startPoint[0], state.startPoint[1]); //minX,minY - 终点 (跟起点一样)
+        }
+    },
+    // 每当用户在聚焦地图时点击某个键时，它将在此处发送
+    onKeyUp: function onKeyUp(state, e) {
+        if (e.keyCode === 27) return this.changeMode("simple_select");
+    },
+    onStop: function onStop(state) {
+        doubleClickZoom.enable(this);
+        this.updateUIClasses({mouse: "none"});
+        this.activateUIButton();
+
+        // 检查我们是否删除了此要素
+        if (this.getFeature(state.square.id) === undefined) return;
+
+        // 删除最后添加的坐标
+        state.square.removeCoordinate("0.4");
+        if (state.square.isValid()) {
+            this.map.fire("draw.create", {
+                features: [state.square.toGeoJSON()]
+            });
+        } else {
+            this.deleteFeature([state.square.id], {silent: true});
+            this.changeMode("simple_select", {}, {silent: true});
+        }
+    },
+    toDisplayFeatures: function toDisplayFeatures(state, geojson, display) {
+        var isActivePolygon = geojson.properties.id === state.square.id;
+        geojson.properties.active = isActivePolygon ? "true" : "false";
+        if (!isActivePolygon) return display(geojson);
+
+        // 仅在具有起点的正方形时才渲染
+        if (!state.startPoint) return;
+        return display(geojson);
+    },
+    onTrash: function onTrash(state) {
+        this.deleteFeature([state.square.id], {silent: true});
+        this.changeMode("simple_select");
+    }
+};

gmap/src/main/resources/static/map/js/geocodingUtil.js

@@ -0,0 +1,353 @@
+(function () {
+
+    var geocodingUtil = window.geocodingUtil = function (map) {
+        return new geocodingUtil.fn.init(map);
+    };
+
+    geocodingUtil.fn = geocodingUtil.prototype = {
+
+        coding: null,
+        marker: null,
+        myDiv: null,
+        map: null,
+
+        init: function (map) {
+            this.map = map;
+            return this;
+        },
+
+        //根据地址匹配查询参数查询匹配的地址信息
+        addressesToLocationsQuery: function(addrToLocUrl, pageNum){
+            var that = this;
+            document.getElementById("addrToLocDIVresult").innerHTML = "";
+            var queryText = encodeURIComponent(document.getElementById("addrToLocQueryText").value);
+            if(queryText === ""){
+                return;
+            }
+            //结果统计信息
+            var resultType =  "result";
+            var htmlStr = "";
+            //根据地址查询
+            that.coding = new GeoGlobe.Query.GeoCodingQuery(UrlUtil.getUrl(addrToLocUrl, {1: 1}), {
+                version: '1.1.0'
+            });
+
+            that.coding.addressesToLocations({
+                address: queryText,
+                semanticAnalysis: true,
+                resultType: resultType
+            }, function(GeoCodingResult){
+                if ("" == GeoCodingResult||GeoCodingResult.status == "NO_RESULTS" || GeoCodingResult.status == "INVALID_REQUEST" || GeoCodingResult.status == "UNKNOWN_ERROR") {
+                    htmlStr += "没有查询到任何数据。";
+                    document.getElementById("addrToLocDIVresult").innerHTML = htmlStr;
+                    return;
+                }
+                var total = GeoCodingResult.features.length;
+                //根据地址查询
+                that.coding.addressesToLocations({
+                    address: queryText,
+                    semanticAnalysis: true,
+                    resultType: resultType,
+                    maxCount: 3,
+                    startPosition: (pageNum - 1) * 3 + 1
+                }, function(GeoCodingResult){
+                    that.addrToLocQuerySuccessFn(GeoCodingResult, total, pageNum);
+                }, function(){
+                    alert("查询失败！");
+                });
+            }, function(){
+                alert("查询失败！");
+            });
+        },
+        //查询成功回调处理
+        addrToLocQuerySuccessFn: function(GeoCodingResult, total, pageNum){
+            //判断是否显示地址关联的poi
+            var isDisplayPoi = document.getElementById("trd").checked;
+            var htmlStr = "";
+            var features = [];
+            if (GeoCodingResult.status == "NO_RESULTS" || GeoCodingResult.status == "INVALID_REQUEST" || GeoCodingResult.status == "UNKNOWN_ERROR") {
+                htmlStr += "没有查询到任何数据。";
+                document.getElementById("addrToLocDIVresult").innerHTML = htmlStr;
+                return;
+            }
+            if(typeof GeoCodingResult === "string" || !(GeoGlobe.Util.isArray(GeoCodingResult.features))) {
+                alert("请求服务失败！请检查服务是否正常运行！");
+                return;
+            }
+            if (this.marker) {
+                this.marker.remove();
+            }
+            if (this.myDiv) {
+                $("myDiv").remove(".marker");
+            }
+            var results = GeoCodingResult.features;
+            for (var i = 0; i < results.length; i++) {
+                var result = results[i];
+                var attributes = result.attributes;
+                //行政区划的第一级-国家
+                var country = "";
+                //行政区划的第二级-省、直辖市、自治区
+                var province = "";
+                //行政区划第三级-市
+                var city = "";
+                //行政区划第四级-区或县
+                var district = "";
+                //行政区划第五级-乡镇
+                var town = "";
+                //街道
+                var street = "";
+                if(null != attributes && undefined != attributes){
+                    //行政区划的第一级-国家
+                    country = attributes.country;
+                    if(null == country || undefined == country){
+                        country = "";
+                    }
+                    //行政区划的第二级-省、直辖市、自治区
+                    province = attributes.province;
+                    if(null == province || undefined == province){
+                        province = "";
+                    }
+                    //行政区划第三级-市
+                    city = attributes.city;
+                    if(null == city || undefined == province){
+                        city = "";
+                    }
+                    //行政区划第四级-区或县
+                    district = attributes.district;
+                    if(null == district || undefined == district){
+                        district = "";
+                    }
+                    //行政区划第五级-乡镇
+                    town = attributes.town;
+                    town = town ? town : "";
+                    if(null == town || undefined == town){
+                        town = "";
+                    }
+                    //街道
+                    street = attributes.streetName;
+                    var name =attributes.name;
+                    if (null == street && undefined == street) {
+                        street = "";
+                    }
+                    var poi = [attributes.lng,attributes.lat];
+                    //var p = new Geo.Geometry.Point(lng, lat);
+                    var imgPath = TDT.getAppPath("") + "img/" + i + ".png";
+                    var streetName = "";
+
+                    if(poi){
+                        var bigImg = document.createElement("img");     //创建一个img元素
+                        bigImg.src=imgPath;   //给img元素的src属性赋值
+                        this.myDiv = document.createElement('myDiv'); //获得dom对象
+                        this.myDiv.className = 'marker';
+                        this.myDiv.appendChild(bigImg);      //为dom添加子元素img
+                        this.marker = new GeoGlobe.Marker(this.myDiv)
+                                .setLngLat(poi)
+                                .addTo(this.map);
+                    }
+                    htmlStr +="<img src="+imgPath+" style='width:25px;height:25px;'/> ";
+                    var address = city + district + town + street;
+                    // htmlStr += "<span><b>" +"地址："+ address + "</b><br/>";
+                    var center =poi;
+                    if(isDisplayPoi){
+                        htmlStr += "<span><b>" + name + "</b><br/>";
+                    }                        
+                    htmlStr += "坐标：" + poi[0] + "," + poi[1] + "<br/>";
+                }
+            }
+            htmlStr += this.getPageFooterHTML(total, pageNum);
+            this.map.setCenter(new GeoGlobe.LngLat(center[0],center[1]), 14);
+            this.map.setZoom(14);
+            document.getElementById("addrToLocDIVresult").innerHTML = htmlStr;
+
+            var that = this;
+            $('#pageDiv a').click(function(){
+                that.addressesToLocationsQuery($(this).text());
+            });
+        },
+
+
+        //根据地址匹配查询参数查询匹配的地址信息
+        locationToAddressesQuery: function (locToAddrUrl, pageNum) {
+            var that = this;
+            document.getElementById("locToAddrDIVresult").innerHTML = "";
+            var queryText = document.getElementById("locToAddrQueryText").value;
+            if (queryText === "") {
+                return;
+            }
+            //结果统计信息
+            var resultType = "result";
+            var htmlStr = "";
+            //根据坐标查询
+            var features = [];
+            var lonlat = new GeoGlobe.LngLat(queryText.split(",")[0], queryText.split(",")[1]);
+            //查询总数
+            that.coding = new GeoGlobe.Query.GeoCodingQuery(UrlUtil.getUrl(locToAddrUrl, {1: 1}), {
+                version: '1.1.0'
+            });
+
+            that.coding.locationToAddresses({
+                lonlat: lonlat,
+                // tolerance: 10,
+                // unit:"meter",
+                resultType: resultType
+            }, function (GeoCodingResult) {
+                if (typeof (GeoCodingResult.status) == "undefined" || GeoCodingResult.status == "NO_RESULTS" || GeoCodingResult.status == "INVALID_REQUEST" || GeoCodingResult.status == "UNKNOWN_ERROR") {
+                    htmlStr += "没有查询到任何数据。";
+                    document.getElementById("locToAddrDIVresult").innerHTML = htmlStr;
+                    return;
+                }
+                var total = GeoCodingResult.features.length;
+                //查询结果
+                that.coding.locationToAddresses({
+                    lonlat: lonlat,
+                    // tolerance: 100,
+                    // unit:"meter",
+                    resultType: resultType,
+                    maxCount: 3,
+                    startPosition: (pageNum - 1) * 3 + 1
+                }, function (GeoCodingResult) {
+                    that.locToAddrQuerySuccessFn(GeoCodingResult, total, pageNum);
+                }, function () {
+                    alert("查询失败！");
+                });
+            }, function () {
+                alert("查询失败！");
+            });
+        },
+        //查询成功回调处理
+        locToAddrQuerySuccessFn: function (GeoCodingResult, total, pageNum) {
+            var htmlStr = "";
+            if (GeoCodingResult.status == "NO_RESULTS" || GeoCodingResult.status == "INVALID_REQUEST" || GeoCodingResult.status == "UNKNOWN_ERROR") {
+                htmlStr += "没有查询到任何数据。";
+                document.getElementById("locToAddrDIVresult").innerHTML = htmlStr;
+                return;
+            }
+            if (typeof GeoCodingResult === "string" || !(GeoGlobe.Util.isArray(GeoCodingResult.features))) {
+                alert("请求服务失败！请检查服务是否正常运行！");
+                return;
+            }
+            if (this.marker) {
+                this.marker.remove();
+            }
+            if (this.myDiv) {
+                $("myDiv").remove(".marker");
+            }
+            var results = GeoCodingResult.features;
+
+            //查询总数
+            for (var i = 0; i < results.length; i++) {
+                var result = results[i];
+                var attributes = result.attributes;
+                //行政区划的第一级-国家
+                var country = "";
+                //行政区划的第二级-省、直辖市、自治区
+                var province = "";
+                //行政区划第三级-市
+                var city = "";
+                //行政区划第四级-区或县
+                var district = "";
+                //行政区划第五级-乡镇
+                var town = "";
+                //街道
+                var street = "";
+                if (null != attributes && undefined != attributes) {
+                    //行政区划的第一级-国家
+                    country = attributes.country;
+                    if (null == country || undefined == country) {
+                        country = "";
+                    }
+                    //行政区划的第二级-省、直辖市、自治区
+                    province = attributes.province;
+                    if (null == province || undefined == province) {
+                        province = "";
+                    }
+                    //行政区划第三级-市
+                    city = attributes.city;
+                    if (null == city || undefined == province) {
+                        city = "";
+                    }
+                    //行政区划第四级-区或县
+                    district = attributes.district;
+                    if (null == district || undefined == district) {
+                        district = "";
+                    }
+                    //行政区划第五级-乡镇
+                    town = attributes.town;
+                    town = town ? town : "";
+                    if (null == town || undefined == town) {
+                        town = "";
+                    }
+                    //街道
+                    street = attributes.streetName;
+                    var name = attributes.name;
+                    if (null == street && undefined == street) {
+                        street = "";
+                    }
+                    var poi = [attributes.lng, attributes.lat];
+                    var categoryName = "";
+                    var imgPath = TDT.getAppPath("") + "img/" + i + ".png";
+
+                    htmlStr += "<img id='img" + i + "'' src=" + imgPath + " style='width:25px;height:25px;'/> ";
+                    htmlStr += "<span id='span" + i + "' ><b>" + name + "</b><br/>";
+                    var streetName = "";
+
+                    var address = city + district + town + street;
+                    //	htmlStr += "地址：" + address + "<br/>";
+                    if (attributes.subordinate) {
+                        htmlStr += "下属行政区划：" + attributes.subordinate + "<br/>";
+                    }
+                    if (null != categoryName && undefined != categoryName) {
+                        htmlStr += "分类名称：" + categoryName + "<br/>";
+                    }
+                    var bigImg = document.createElement("img");     //创建一个img元素
+                    bigImg.src = imgPath;   //给img元素的src属性赋值
+                    this.myDiv = document.createElement('myDiv'); //获得dom对象
+                    this.myDiv.className = 'marker';
+                    this.myDiv.appendChild(bigImg);      //为dom添加子元素img
+                    this.marker = new GeoGlobe.Marker(this.myDiv)
+                        .setLngLat(poi)
+                        .addTo(this.map);
+                    var center = poi;
+                    htmlStr += "&nbsp;&nbsp;坐标：" + poi[0] + "," + poi[1] + "<br/>";
+                }
+            }
+            htmlStr += this.getPageFooterHTML(total, pageNum);
+            this.map.setCenter(new GeoGlobe.LngLat(center[0], center[1]), 14);
+            this.map.setZoom(14);
+            document.getElementById("locToAddrDIVresult").innerHTML = htmlStr;
+
+            var that = this;
+            $('#pageDiv a').click(function(){
+                that.locationToAddressesQuery($(this).text());
+            });
+        },
+
+        //获取查询结果下分页的HTML
+        getPageFooterHTML: function (total, pageNum) {
+            var html = "<div style='text-align:center;' id='pageDiv'>";
+            //分页的页数
+            //分页的页数
+            if (total % 3 == 0) {
+                var pageNums = parseInt(total / 3);
+            } else {
+                var pageNums = parseInt(total / 3) + 1;
+            }
+            //实际分页的页数可能大于10页，但本示例分页的页数保持在10页之内。
+            pageNums = pageNums > 10 ? 10 : pageNums;
+            for (var i = 0; i < pageNums; i++) {
+                html += "<span style='margin:0 8px 0 8px;cursor:pointer'>";
+                if (pageNum == (i + 1)) {
+                    html += (i + 1);
+                } else {
+                    html += "<a href='#'>" + (i + 1) + "</a>";
+                }
+                html += "</span>";
+            }
+            html += "</div>";
+            return html;
+        }
+    };
+
+    geocodingUtil.fn.init.prototype = geocodingUtil.fn;
+
+})();

gmap/src/main/resources/static/map/js/index.js

@@ -0,0 +1,129 @@
+$(function(){
+    $('#modeType').change(function(){
+        var selectType = $(this).find(':selected').val();
+        UrlUtil.urlType = selectType;
+        mapView.serviceUrls = mapView.modeServiceUrls[selectType];
+
+        if(selectType === 'gateway'){
+            $('.serverTipName').text('地图产品服务地址：');
+            $('#busUrlPanel').hide();
+        }else{
+            $('.serverTipName').text('地图产品ServerCode：');
+            $('#busUrl').val(UrlUtil.busUrl);
+            $('#busUrlPanel').show();
+        }
+
+        $('#typeSelect').trigger('change');
+    }).trigger('change');
+
+    $('#typeSelect').change(function(){
+        var selectType = $(this).find(':selected').val();
+        var typeUrls = mapView.serviceUrls[selectType];
+
+        if(selectType === 'geocoding'){
+            $('.geocodingPanel').show();
+            $('.serverOpPanel').hide();
+            $('#geoCodingType').trigger('change');
+            return;
+        }else{
+            $('.geocodingPanel').hide();
+            $('.serverOpPanel').show();
+        }
+
+        if(selectType === 'wfs'){
+            $('.wfsResultTypePanel').show();
+        }else{
+            $('.wfsResultTypePanel').hide();
+        }
+
+        $('#serviceTable>thead>tr').hide();
+        $('tr.' + selectType + 'Tr').show();
+
+        var tbodyHtml = '';
+        if(selectType === 'wfs'){
+            for(var i=0; i<typeUrls.length; i++){
+                var typeUrl = typeUrls[i];
+                tbodyHtml += '<tr><td>' + typeUrl.url + '</td><td>' + typeUrl.resultType + '</td><td><a class="delService" href="#" onclick="return false">删除</a></td></tr>';
+            }
+        }else{
+            for(var i=0; i<typeUrls.length; i++){
+                tbodyHtml += '<tr><td>' + typeUrls[i].url + '</td><td><a class="delService" href="#" onclick="return false">删除</a></td></tr>';
+            }
+        }
+        
+        $('#serviceTable>tbody').html(tbodyHtml);
+
+        $('.delService').click(function(){
+            var typeUrls = mapView.serviceUrls[$('#typeSelect option:selected').val()];
+            var tr = $(this).parents('tr');
+            typeUrls.splice(tr.index(), 1);
+            tr.remove();
+        });
+    }).trigger('change');
+
+    $('#addService').click(function(){
+        var service = $('#service').val();
+        if(!service){
+            return;
+        }
+        var type = $('#typeSelect option:selected').val();
+        var typeUrls = mapView.serviceUrls[type];
+        var hasSame = false;
+        for(var i=0;i<typeUrls.length; i++){
+            if(service === typeUrls[i].url){
+                hasSame = true;
+                break;
+            }
+        }
+        if(!hasSame){
+            var typeUrl = {url: service};
+            if(type === 'wfs'){
+                typeUrl['resultType'] = $('input:radio[name="resultType"]:checked').val();
+            }
+
+            typeUrls.push(typeUrl);
+            $('#typeSelect').trigger('change');
+        }
+    });
+
+    $('#loadServices').click(function(){
+        mapView.loadLayers();
+    });
+});
+
+function slideToggleDialog(dialog){
+    //获取指定对象
+    function getNode(parentDiv,nodeName){
+        for(var i = 0,len = parentDiv.childNodes.length; i < len; i++){
+            var node = parentDiv.childNodes[i];
+            if(nodeName == "content"){
+                if(node.className != "dtitle" && node.nodeName == "DIV"){
+                    return node;
+                }
+            }
+            else if(nodeName == "img"){
+                if(node.className == "dtitle"){
+                    var img = node.getElementsByTagName("img")[0];
+                    return img;
+                }
+            }
+            else if(nodeName == "iframe"){
+                if(node.nodeName == "IFRAME" && node.className == "bgiframe bgiframe-bottom"){
+                    return node;
+                }
+            }
+        }
+    }
+    //获取弹出div对象
+    var dialog = document.getElementById(dialog);
+    //获取图片对象
+    var img = getNode(dialog,"img");
+    //处理
+    if(dialog.style.height == "auto"){
+        dialog.style.height = "18px";
+        img.src = "./img/openD.png";
+    }else{
+        dialog.style.height = "auto";
+        img.src = "./img/closeD.png";
+    }
+}

gmap/src/main/resources/static/map/js/mapView.js

@@ -0,0 +1,194 @@
+var mapView = Window.mapView = {
+
+	map: null,
+
+	modeServiceUrls: {
+		gateway: {
+			wmts: [{
+				url: 'https://dc-gateway.gdgov.cn/ebus/zwdsj-dlk/geostar/GD_2018DLG/wmts' //广东2018年7_17级矢量图
+			}, {
+				url: 'https://dc-gateway.gdgov.cn/ebus/zwdsj-dlk/geostar/GD_2018DLGZJ/wmts' //广东2018年7_17级矢量注记
+			}], //示例使用，可替换为需要查看的地图服务地址，或者在页面上进行添加与删除
+			wfs: [{
+				url: 'https://dc-gateway.gdgov.cn/ebus/zwdsj-dlk/geostar/WHHLYT_LYJQ/wfs', //广东A级旅游景区，点
+				resultType: 'XML'
+			},{
+				url: 'https://dc-gateway.gdgov.cn/ebus/zwdsj-dlk/geostar/JTYST_GD2019/wfs', //广东2019年末全省普通国道分布，线
+				resultType: 'GEOJSON'
+			},{
+				url: 'https://dc-gateway.gdgov.cn/ebus/zwdsj-dlk/geostar/GZSXJXZQHM_wfs/wfs', //广州市县级工作底图界线，面
+				resultType: 'XML'
+			}], //示例使用，可替换为需要查看的要素服务地址，或者在页面上进行添加与删除
+			geocoding: {
+				addrToLoc: 'https://dc-gateway.gdgov.cn/ebus/zwdsj-dlk/geostar/GDS_DMDZ/geocoding', //广东地名地址查询服务，正向匹配使用
+				locToaddr: 'https://dc-gateway.gdgov.cn/ebus/zwdsj-dlk/geostar/GDS_DMDZ_esindex/geocoding' //广东坐标匹配查询服务，反向匹配使用
+			}
+		},
+		bus: {
+			wmts: [{url: 'YZT1597746954560'},  //广东2018年7_17级矢量图
+				{url: 'YZT1597746953278'} //广东2018年7_17级矢量注记
+			], //示例使用，可替换为需要查看的地图服务地址，或者在页面上进行添加与删除
+			wfs: [{
+				url: 'YZT1597746956640', //广东A级旅游景区,点
+				resultType: 'XML'
+			},{
+				url: 'YZT1597746959853', //广东2019年末全省普通国道分布，线
+				resultType: 'GEOJSON'
+			},{
+				url: 'YZT1597746923010', //广州市县级工作底图界线，面
+				resultType: 'XML'
+			}], //示例使用，可替换为需要查看的要素服务地址，或者在页面上进行添加与删除
+			geocoding: {
+				addrToLoc: 'YZT1597746931737',
+				locToaddr: 'YZT1597746927061'
+			}
+		}
+	},
+
+	serviceUrls: {},
+
+	mapLayerIds: [],
+
+	wmtsUtil: wmtsUtil(),
+	wfsUtil: wfsUtil(),
+	geocodingUtil: null,
+
+	init: function () {
+		this.initMap();   //初始化地图
+
+		//初始化地名地址查询
+		this.geocodingUtil = geocodingUtil(this.map);
+		this.initGeoCoding();
+	},
+
+	initMap: function () {
+		var that = this
+		that.createMap('gmap');
+	},
+
+	loadLayers: function () {
+		this.clearLayers();
+		this.addWmtsLayers();
+		this.addWfsLayers();
+	},
+
+	clearLayers: function () {
+		for (var i = 0; i < this.mapLayerIds.length; i++) {
+			var layer = this.map.getLayer(this.mapLayerIds[i]);
+			if (layer) {
+				this.map.removeLayer(layer.id);
+				if (this.map.getSource(layer.source)) {
+					this.map.removeSource(layer.source);
+				}
+			}
+		}
+		this.mapLayerIds = [];
+	},
+
+	createMap: function (div) {
+		var that = this;
+		var simple = {
+			"version": 8,
+			"sources": {},
+			"layers": []
+		};
+		var wgs84_wgs84_mapcrs = {
+			topTileExtent: [-180, -270, 180, 90],
+			coordtransform: "none",
+			tileSize: 256
+		};
+		var map = new GeoGlobe.Map({
+			mapCRS: wgs84_wgs84_mapcrs,
+			style: simple,
+			container: div,
+			zoom: 4,
+			center: [112.939, 31.377],
+			isIntScrollZoom: true, //缩放级别是否为整数处理模式
+			renderWorldCopies: false,
+			isAttributionControl: false,
+			is3Dpitching: false, //是否到指定层级自动倾斜
+			pitch3Dzoom: 16 //自动倾斜的层级，默认16
+		});
+		this.map = map;
+		map.on("style.load", function () {
+			that.initControls(map);//初始化控件
+			map.setZoom(7);
+			map.setCenter([113.272753, 23.139257]);
+		});
+
+		map.on("zoomend", function(){
+			$('#zoom').html(that.map.getZoom());
+		});
+	},
+
+	initControls: function (map) {
+		//比例尺控件
+		var Sca_control = new GeoGlobe.Control.Scale({
+			position: 'bottom-right',
+			maxWidth: 80,
+			unit: 'm'
+		});
+		map.addControl(Sca_control, Sca_control.options.position);
+		//导航控件
+		var Na_control = new GeoGlobe.Control.Navigation();
+		map.addControl(Na_control, "bottom-right");
+	},
+
+	//初始化图层组
+	addWmtsLayers: function () {
+		var that = this;
+		var wmtsConfigs = that.serviceUrls['wmts'];
+		for (var i = 0; i < wmtsConfigs.length; i++) {
+			var wmtsConfig = wmtsConfigs[i];
+			var layerOptions = that.wmtsUtil.getMatchServiceOption(wmtsConfig.url);
+			var layerInf = that.wmtsUtil.createLayer(wmtsConfig.url, layerOptions[0]);
+			that.map.addSource(layerInf.source.id, layerInf.source);
+			that.map.addLayer(layerInf.layer);
+			that.mapLayerIds.push(layerInf.layer.id);
+		}
+	},
+
+	//初始化地名地址查询
+	initGeoCoding: function () {
+		var that = this;
+		$('#geoCodingType').change(function () {
+			var value = $(this).find('option:selected').val();
+			$('.geocodingDiv').hide();
+			$('#geoCodingUrl').val(that.serviceUrls.geocoding[value]);
+			$('#' + value + 'Div').show();
+		});
+
+		$('#locToAddr').click(function () {
+			var url = $('#geoCodingUrl').val();
+			that.serviceUrls.geocoding.locToaddr = url;
+			that.geocodingUtil.locationToAddressesQuery(url, 1);
+		});
+
+		$('#addrToLoc').click(function () {
+			var url = $('#geoCodingUrl').val();
+			that.serviceUrls.geocoding.addrToLoc = url;
+			that.geocodingUtil.addressesToLocationsQuery(url, 1);
+		});
+	},
+
+	//叠加wfs图层
+	addWfsLayers: function () {
+		var that = this;
+		var wfsConfigs = that.serviceUrls['wfs'];
+		for (var i = 0; i < wfsConfigs.length; i++) {
+			var wfsConfig = wfsConfigs[i];
+			that.wfsUtil.getLayer(wfsConfig.url, function (url, layerWfsOpt) {
+				var featureType = layerWfsOpt[0].name;
+				var queryObj = that.wfsUtil.initwfsQueryObj(url, featureType, wfsConfig.resultType);
+				that.wfsUtil.queryWFS(queryObj, function (result) {
+					var layerId = that.wfsUtil.draWfsFeature(that.map, result.geojson);
+					that.mapLayerIds.push(layerId);
+				});
+			});
+		}
+	},
+
+};
+mapView.init();
+
+

gmap/src/main/resources/static/map/js/urlUtil.js

@@ -0,0 +1,61 @@
+/**
+ * 地址管理类
+ */
+(function(){
+    var UrlUtil = window.UrlUtil = function(){
+        new UrlUtil.fn.init();
+    }
+
+    UrlUtil.fn = UrlUtil.prototype = {
+        init: function(){
+            return this;
+        },
+
+        urlType: '', //gateway：智能网关，bus:数据中台
+        busUrl: 'https://ztn-data.gdgov.cn:8581/GatewayMsg/http/api/proxy/invoke', //域名对应IP：19.15.75.180
+
+        getUrl: function(serviceUrl, params){
+            var paasId = $('#paasId').val();
+            var paasToken = $('#paasToken').val();
+            var paasParams = "";
+            if (paasId && paasToken) {
+                paasParams = "paasId=" + paasId + "&paasToken=" + paasToken;
+            }
+
+            if(this.urlType === 'gateway'){
+                if(paasParams.length){
+                    paasParams += '&';
+                }
+
+                var url = TDT.getAppPath("")+ "proxyHandler?" + paasParams + "url=" + serviceUrl;
+                if(params){
+                    url += (serviceUrl.indexOf('?') > 0 ? '&' : '?') + this.getParamStr(params);
+                }
+                return url;
+            }else{
+                if(paasParams.length){
+                    paasParams = paasParams + '&';
+                }
+
+                this.busUrl = $('#busUrl').val();
+
+                var url = TDT.getAppPath("")+ "proxyHandler?serviceCode=" + serviceUrl + "&" + paasParams + "url=" + this.busUrl;
+                if(params){
+                    url += '?' + this.getParamStr(params);
+                }
+                return url;
+            }
+        },
+        getParamStr: function(params){
+            var paramStr = '';
+            for(var key in params){
+                paramStr += (paramStr.length > 0 ? '&' : '') + key + '=' + params[key];
+            }
+            return paramStr;
+        }
+    }
+
+    UrlUtil.fn.init.prototype = UrlUtil.fn;
+
+    window.UrlUtil = new UrlUtil();
+})();

gmap/src/main/resources/static/map/js/wfsUtil.js

@@ -0,0 +1,147 @@
+(function(){
+	
+	var wfsUtil = window.wfsUtil = function(){
+		return new wfsUtil.fn.init();
+	};
+	
+	wfsUtil.fn = wfsUtil.prototype = {
+		
+		geometryName: 'GEOMETRY',
+		wfsVersion: "1.0.0",
+		wfsQueryObj: null,  //wfs服务查询操作对象
+		
+		init: function(){
+			return this;
+		},
+		
+		getLayer : function(serviceUrl, callback){
+ 			var that=this;
+ 			var url = UrlUtil.getUrl(serviceUrl, {
+				service: 'wfs',
+				request: 'GetCapabilities',
+				version: '1.1.0'
+			});
+	        GeoGlobe.Request.GET({
+	            url: url,
+	            async:true,
+	            success: function(request){
+	            	if(!request.responseText || request.responseText.indexOf("Exception") != -1 ){
+	            		that.failFn();
+	            		return;
+	            	}
+	                var doc = request.responseText;
+	                var jsonOnj = new GeoGlobe.Format.WFSCapabilities.v1().read(doc);
+	                try {
+	                    var array = jsonOnj.featureTypeList.featureTypes;
+	                    callback && callback(serviceUrl, array);
+	                } 
+	                catch (e) {
+	                	that.failFn();
+	                }
+	            },
+	            failure: this.failFn
+	        });
+		},
+		
+		failFn:function(){
+			TDT.alert("获取服务信息失败!");
+			return ;
+		},
+		
+		initwfsQueryObj:function(wfsUrl,featureType, resultType){
+			var that = this;
+			var requestUrl = UrlUtil.getUrl(wfsUrl);
+			var queryOption = {
+	        	geometryName: that.geometryName,  //几何字段名称
+				version: that.wfsVersion, //要素服务版本
+				maxFeatures: 99999 //返回要素数据最大个数
+			}
+			if(resultType === 'GEOJSON'){
+				queryOption['format'] = new GeoGlobe.Format.GeoJSON();
+			}
+
+	    	var queryObj = new GeoGlobe.Query.WFSQuery(requestUrl, featureType, queryOption);
+			return queryObj;
+		},
+
+		queryWFS: function (queryObj, callback) {
+
+			//范围查询示例
+			// var queryBBOX = new GeoGlobe.LngLatBounds([112.75526445988339, 22.278476570313103], [114.30433672550924, 24.003330085938245]);
+			// debugger
+			// queryObj.bboxQuery(queryBBOX, function (result) {
+			// 	callback && callback(result);
+			// }, function () {
+			// 	console.log("查询失败");
+			// });
+
+			//属性查询示例，property的值可根据DescribeFeatureType操作获取当前查询要素服务的字段名称，调用方式可查看《粤政图外部接入指引手册》中的“第三章 地图产品服务接口说明”的“3.3 要素服务接口”的“3.3.3 DescribeFeatureType操作”一节
+			// var property = 'ZLDWDM';
+			// var value = '440981124*';
+			// queryObj.attributeQuery(GeoGlobe.Filter.Comparison.LIKE, property, value, {
+			// 	matchCase: true
+			// }, function (result) {
+			// 	callback && callback(result);
+			// }, function (e) {
+			// 	console.log("查询失败");
+			// });
+
+			//查询获取全部数据，数据返回最大个数由initwfsQueryObj方法中的queryOption的maxFeatures定义
+			queryObj.query(null, function (result) {
+				callback && callback(result);
+			}, function () {
+				console.log("查询失败");
+			});
+		},
+		
+		draWfsFeature:function(map,geojson) {
+			if(!geojson.features.length){
+				return;
+			}
+
+			var dataSource = {
+	            'type': 'geojson',
+	            'data': geojson
+			};
+			var layerId = "layerId_wfs_" + TDT.random(4);
+
+			var geoType = geojson.features[0].geometry.type.toLowerCase();
+			var layer = {
+				"id": layerId,
+				"source": dataSource
+			};
+			if(geoType.indexOf('point') >= 0){
+				layer["type"] = "circle";
+				layer["paint"] = {
+					"circle-radius": 5,
+					"circle-color": "red",
+					"circle-opacity": 0.8
+				};
+			}else if(geoType.indexOf('linestring') >= 0){
+				layer["type"] = "line";
+				layer["layout"] = {
+					"line-join": "round",
+					"line-cap": "round",
+					"visibility": "visible"
+				};
+				layer["paint"] = {
+					"line-color": "#3988fb",
+					"line-width": 2
+				};
+			}else if(geoType.indexOf('polygon') >= 0){
+				layer["type"] = "fill";
+				layer["layout"] = { "visibility": "visible"};
+				layer["paint"] = {
+					"fill-color": "#bedbf9",
+					"fill-opacity": 0.5,
+					"fill-outline-color":"#000"
+				};
+			}
+
+	        map.addLayer(layer);
+			return layerId;
+		}
+	};
+	
+	wfsUtil.fn.init.prototype = wfsUtil.fn;
+})();

gmap/src/main/resources/static/map/js/wmtsUtil.js

@@ -0,0 +1,139 @@
+(function(){
+	
+	var wmtsUtil = window.wmtsUtil = function(){
+		return new wmtsUtil.fn.init();
+	};
+	
+	wmtsUtil.fn = wmtsUtil.prototype = {
+			
+		init: function(){
+			return this;
+		},
+		
+		getMatchServiceOption: function(serviceUrl){
+			var that = this;
+			var layerArry;
+			var url;
+			url = UrlUtil.getUrl(serviceUrl, {service: 'wmts', REQUEST: 'GetCapabilities'});
+			var format = new GeoGlobe.Format.WMTSCapabilities();
+		  	GeoGlobe.Request.GET({ 
+	            url: url,
+	            async:false,
+	            success: function(request){
+            		var json = format.read(request.responseText);  // 版本号赋值
+                	layerArry = that.WMTSMatchAnalyzer(json);
+	            }
+	        });
+		  	return layerArry;
+		},
+		
+		//WMTS类型的服务数据 解析.
+		WMTSMatchAnalyzer: function(json){
+			var layers = json.contents.layers;
+			var tileMatrixSets = json.contents.tileMatrixSets;
+			var layerArr = [];
+			$(layers).each(function(i,data){
+				var layerObj = {};
+				layerObj["name"]=data.identifier;
+				layerObj["type"] = "WMTS";
+				layerObj["alias"]= data.identifier;
+				layerObj["opacity"]=1;
+				layerObj["visibility"]=true;
+				layerObj["formats"]=data.formats;
+				layerObj["format"]=data.formats[0];//"image/tile";
+				layerObj["style"]=data.styles[0].identifier;
+				layerObj["tileFullExtent"]=data.bounds.left+","+data.bounds.bottom+","+data.bounds.right+","+data.bounds.top;
+				layerObj["matrixSet"]= data.tileMatrixSetLinks[0].tileMatrixSet;
+				var matrixIds = [];
+				$(tileMatrixSets[data.tileMatrixSetLinks[0].tileMatrixSet].matrixIds).each(function(j,d){
+					var matrixid = {};
+					matrixid.identifier =d.identifier;
+					matrixid.scaleDenominator =d.scaleDenominator;
+					matrixid.tileHeight =d.tileHeight;
+					matrixid.tileWidth =d.tileWidth;
+					matrixIds.push(matrixid);
+				});
+				layerObj["matrixIds"] = matrixIds;
+				layerArr.push(layerObj);
+			});
+			return layerArr;
+		},
+		
+		createLayer: function(url,options){
+			var layerInf = {};
+			var random = TDT.random(4);
+			var requestUrl = UrlUtil.getUrl(url, {
+				SERVICE: 'WMTS',
+				REQUEST: 'GetTile',
+				VERSION: '1.0.0',
+				LAYER: options.name,
+				STYLE: options.style,
+				TILEMATRIXSET: options.matrixSet,
+				TILEMATRIX: '{z}',
+				TILEROW: '{y}',
+				TILECOL: '{x}',
+				FORMAT: options.formats[0]
+			});
+	        var matrixIds = options.matrixIds;
+	        //minzoom
+    		if(matrixIds[0].islevelhidden == false){
+    			var minZoom = matrixIds[0].identifier;
+    		}else if(matrixIds[0].islevelhidden == true){
+    			for(i=0;i< matrixIds.length-1;i++){
+    				if(matrixIds[i].islevelhidden == true && matrixIds[i+1].islevelhidden == false){
+    					var minZoom = matrixIds[i+1].identifier;
+    				}
+    			}	
+    		}else{
+    			var minZoom = matrixIds[0].identifier
+    		};
+    		//maxzoom	
+    		if(matrixIds[matrixIds.length-1].islevelhidden == false){
+    			var maxZoom = matrixIds[matrixIds.length-1].identifier;
+    		}else if(matrixIds[matrixIds.length-1].islevelhidden == true){
+    			for(i= matrixIds.length-1;i>0;i--){
+    				if(matrixIds[i].islevelhidden == true && matrixIds[i-1].islevelhidden == false){
+    					var maxZoom = matrixIds[i-1].identifier;
+    				}
+    			}	
+    		}else{
+    			var maxZoom = matrixIds[matrixIds.length-1].identifier
+    		};
+	        var wmtsSource = new GeoGlobe.Source.RasterSource({
+	            "id": "sourceId_"+options.name+"_"+random,
+	            "type": "raster",
+	            "url": [requestUrl],
+	            "minzoom": parseInt(minZoom),
+	            "maxzoom": parseInt(maxZoom)+1,
+	            "tileSize": 256
+	        });
+	        wmtsSource['minzoom'] = parseInt(minZoom);
+	        wmtsSource['maxzoom'] = parseInt(maxZoom)+1;
+	        var visibility = options.visibility;
+	        if(options.cityName && parseInt(minZoom) > 17){
+	        	visibility = "false";
+	        }
+	        var wmtsLyaer = new GeoGlobe.Layer.RasterLayer({
+	            "id": "layerId_"+options.name+"_"+random,
+	            "type": "raster",
+	            "source": wmtsSource.id,
+	            "name": options.name,
+	            "metadata": options,
+	            "minzoom": parseInt(minZoom),
+	            "maxzoom": parseInt(maxZoom)+2,
+	            "paint": {
+	            	"raster-opacity":1
+	            },
+	            "layout": { 
+	            	"visibility":(visibility == true || visibility == "true") ? "visible" : "none"
+	            }
+	        });
+	        layerInf["layer"] = wmtsLyaer;
+	        layerInf["source"] = wmtsSource;
+	        return layerInf;
+		}
+	};
+	
+	wmtsUtil.fn.init.prototype = wmtsUtil.fn;
+	
+})();