feat(监测评估):添加电子地图调用天地图,修改底图切换功能

weimo934
Showing 1 changed file with 52 additions and 10 deletions
src/main/webapp/view/monitorevaluate/monitor/zbjc/js/widget.js
--- a/src/main/webapp/view/monitorevaluate/monitor/zbjc/js/widget.js
View file @a33dcf4
+++ b/src/main/webapp/view/monitorevaluate/monitor/zbjc/js/widget.js
View file @a33dcf4
@@ -40,10 +40,11 @@ require([
    "esri/symbols/SimpleFillSymbol",
    "esri/symbols/SimpleMarkerSymbol",
    "esri/symbols/PictureMarkerSymbol",
+    "esri/layers/WebTileLayer",
    "dojo/domReady!",
 ], function (declare, BaseWidget, html, url, on, query, topic, lang, array, Deferred,
             cache, DrawTool, EventUtils, Map, Basemap, MapView, FeatureLayer, TileLayer, Point, Graphic, Circle, GraphicsLayer, MapImageLayer, ScaleBar, Extent,
-             Query, PrintTask, PrintTemplate, PrintParameters, LegendLayer, SimpleLineSymbol, SimpleFillSymbol, SimpleMarkerSymbol, PictureMarkerSymbol) {
+             Query, PrintTask, PrintTemplate, PrintParameters, LegendLayer, SimpleLineSymbol, SimpleFillSymbol, SimpleMarkerSymbol, PictureMarkerSymbol,WebTileLayer) {
    print = cache(new url("print/Widget.html"), {sanitize: true});
    const _self = new Vue({
        el: '#mapDiv',
@@ -1079,9 +1080,9 @@ require([
                ctx.rotate('20*Math.PI/180'); // 坐标系还原
                const img_src = cw.toDataURL();
                document.getElementsByClassName('left-content-cards')[0].style.background = `${background} url(${img_src})`;
-                setTimeout(function () {
+     /*           setTimeout(function () {
                    document.getElementsByClassName('shuiyin')[0].style.background = `${background} url(${img_src})`;
-                }, 500);
+                }, 500);*/
            },
            /**
@@ -2058,7 +2059,7 @@ require([
    let layer_electronicMap = new MapImageLayer({
        //url: 'http://10.6.144.88:6080/arcgis/rest/services/实施监督系统/地图灰化2/MapServer'   // 电子地图
-        url: 'https://192.168.5.164:6443/arcgis/rest/services/xzsj/ygyx/MapServer',   // 电子地图
+        url: 'https://192.168.5.143:6443/arcgis/rest/services/xzsj/ygyx/MapServer',   // 电子地图
        sublayers: [
           {
                id: 0,
@@ -2067,7 +2068,7 @@ require([
        ]
    });
-    _self.myMap.add(layer_electronicMap);
    // 添加地图比例尺
    let scaleBar = new ScaleBar({
@@ -2106,25 +2107,66 @@ require([
        },
        outFields: ["*"]
    });
-    _self.myMap.add(_self.xiAn_adminRegionLayer, 5);
+   // _self.myMap.add(_self.xiAn_adminRegionLayer, 5);
    let boundary = {};
-    _self.xiAn_adminRegionLayer.queryFeatures().then(function (results) {
+    /*_self.xiAn_adminRegionLayer.queryFeatures().then(function (results) {
        let i = 0, o;
        for (; o = results.features[i++];)
            boundary[o.attributes.FID] = {g: o.geometry, c: o.attributes.XZQDM};
+    });*/
+    var tiledLayer = new WebTileLayer({
+        urlTemplate:"http://{subDomain}.tianditu.gov.cn/DataServer?T=vec_w&x={col}&y={row}&l={level}&tk=申请的key",
+        subDomains: ["t0", "t1", "t2", "t3","t4", "t5", "t6", "t7"],
+    });
+    //天地图 电子地图
+    var tiledLayer = new WebTileLayer({
+        urlTemplate:
+            "http://{subDomain}.tianditu.gov.cn/DataServer?T=vec_w&x={col}&y={row}&l={level}&tk=b46395ce4ec77f490158eebe439ac559",
+        subDomains: ["t0", "t1", "t2", "t3","t4", "t5", "t6", "t7"],
    });
+    var tiledLayer_poi = new WebTileLayer({
+        urlTemplate:
+            "http://{subDomain}.tianditu.gov.cn/DataServer?T=cva_w&x={col}&y={row}&l={level}&tk=b46395ce4ec77f490158eebe439ac559",
+        subDomains: ["t0", "t1", "t2", "t3","t4", "t5", "t6", "t7"],
+    });
+    // _self.myMap.add(layer_electronicMap);
+    _self.myMap.add(tiledLayer);
+    _self.myMap.add(tiledLayer_poi);
+    var dt="dianzi"
    // 切换地图底图
    switchButton.addEventListener('click', function () {
-        if (_self.myMap.basemap.id === 'electronicMap') {
+        if (dt==='yingxiang'){
+            $("#switch_btn img")[0].src = "./images/mapIcon/dzdt_normal.png";
+            // 删除电子地图
+            _self.myMap.remove(tiledLayer);
+            _self.myMap.remove(tiledLayer_poi);
+            // 添加影像地图
+            _self.myMap.add(layer_electronicMap);
+            // 更换底图标识
+            dt="dianzi"
+        }else if (dt==='dianzi'){
+            $("#switch_btn img")[0].src = "./images/mapIcon/yxdt_normal.png";
+            // 删除影像底图
+            _self.myMap.remove(layer_electronicMap);
+            // 添加电子底图
+            _self.myMap.add(tiledLayer);
+            _self.myMap.add(tiledLayer_poi);
+            // 更换底图标识
+            dt="yingxiang"
+        }
+      /*  if (_self.myMap.basemap.id === 'electronicMap') {
            _self.myMap.basemap = imageBaseMap;
            $("#switch_btn img")[0].src = "./images/mapIcon/dzdt_normal.png";
        } else if (_self.myMap.basemap.id === 'imageMap') {
            _self.myMap.basemap = electronBaseMap;
            $("#switch_btn img")[0].src = "./images/mapIcon/yxdt_normal.png";
-        }
+        }*/
    });
    // 要素分布
@@ -2279,7 +2321,7 @@ require([
    }
    // 切换区域，使地图跳转并高亮
-    regionSwitch.addEventListener('change', locationArea);
+    //regionSwitch.addEventListener('change', locationArea);
    /**
     * 街道级监测值联动变化