From 12075d0fa73d963ff5d6dbc4727fb95fb6084961 Mon Sep 17 00:00:00 2001 From: surprise <15810472099@163.com> Date: 星期五, 01 三月 2024 09:32:40 +0800 Subject: [PATCH] 代码更新 --- src/assets/js/Map/server.js | 422 +++++++++++++++++++++++++++++++++++++++++----------- 1 files changed, 332 insertions(+), 90 deletions(-) diff --git a/src/assets/js/Map/server.js b/src/assets/js/Map/server.js index 76e67c4..74ee15b 100644 --- a/src/assets/js/Map/server.js +++ b/src/assets/js/Map/server.js @@ -1,47 +1,80 @@ import { getToken } from "@/utils/auth"; //閰嶇疆鏂囦欢鍦板潃 -import config from "./config"; - +// import config from "../../../../public/config/config"; +import store from "@/store"; +import { nextTick } from "vue"; const server = { layerList: [], + graticules: null, + alpha: null,//閫忔槑搴� + geoLayer: [], + geoUrl: null, + wmsLayerId: null, addTreeData(treeNode) { - if (!treeNode.checked) { - this.delLayer(treeNode.id); - return; - } + // if (!treeNode.checked) { + // this.delLayer(treeNode.id); + // return; + // } + + this.alpha = this.getResLayersAlpha(treeNode); //鍒ゆ柇鏄惁涓轰唬鐞� if (treeNode.proxy) { - this.addProxyAddress(treeNode);//鏈変唬鐞� + this.addProxyAddress(treeNode); //鏈変唬鐞� } else { - this.addUrlAddress(treeNode);//鏃犱唬鐞� + this.addUrlAddress(treeNode); //鏃犱唬鐞� + } + + if (this.graticules) { + window.Viewer.imageryLayers.raiseToTop(this.graticules.imageryLayer); + } + }, + showlonlatLine() { + if (!this.graticules) { + SmartEarth.Cesium.Ellipsoid.WGS84 = new SmartEarth.Cesium.Ellipsoid( + 1737400.0, + 1737400.0, + 1737400.0 + ); + + this.graticules = new SmartEarth.Cesium.Graticules( + earthCtrl.Viewer, + SmartEarth.Cesium.Color.PALEGREEN + ); + // graticules.makeCoordAxiss(); + var that = this; + earthCtrl.Viewer.scene.preUpdate.addEventListener(function () { + that.graticules.update(); + }); + } else { + this.graticules.enabled = !this.graticules.enabled; } }, //浠g悊鍦板潃 addProxyAddress(res) { //鍒ゆ柇鏁版嵁绫诲瀷 switch (res.data) { - case 1://鏁板瓧姝e皠褰卞儚鍥� + case 1: //鏁板瓧姝e皠褰卞儚鍥� this.setDataType(res); break; - case 2://鍦烘櫙鍦板舰鏁版嵁 + case 2: //鍦烘櫙鍦板舰鏁版嵁 this.setTerrainData(res); break; - case 3://鏁板瓧楂樼▼妯″瀷锛堟檿娓插浘锛� + case 3: //鏁板瓧楂樼▼妯″瀷锛堟檿娓插浘锛� this.setDataType(res); break; - case 4://鍗曟尝娈垫爡鏍兼暟鎹� + case 4: //鍗曟尝娈垫爡鏍兼暟鎹� this.setDataType(res); break; - case 5://澶氬厜璋辨爡鏍兼暟鎹� + case 5: //澶氬厜璋辨爡鏍兼暟鎹� this.setDataType(res); break; - case 6://楂樺厜璋辨爡鏍兼暟鎹� + case 6: //楂樺厜璋辨爡鏍兼暟鎹� this.setDataType(res); break; - case 7://鐭㈤噺鍥惧眰 + case 7: //鐭㈤噺鍥惧眰 this.setVectorData(res); break; - case 8://涓夌淮妯″瀷 + case 8: //涓夌淮妯″瀷 this.setModelData(res); break; } @@ -49,132 +82,123 @@ //鏅�氬湴鍧� addUrlAddress(res) { switch (res.category) { - case 0://鍏朵粬 - + case 0: //鍏朵粬 break; - case 1://GisServer + case 1: //GisServer this.addProxyAddress(res); break; - case 2://GeoServer + case 2: //GeoServer this.addGeoServerAddress(res); break; - case 3://鏁扮畝 + case 3: //鏁扮畝 this.addProxyAddress(res); break; } - }, //Geoserver鏈嶅姟 addGeoServerAddress(res) { //鍒ゆ柇鏁版嵁绫诲瀷 switch (res.data) { - case 1://鏁板瓧姝e皠褰卞儚鍥� + case 1: //鏁板瓧姝e皠褰卞儚鍥� this.setGeoDataType(res); break; - case 2://鍦烘櫙鍦板舰鏁版嵁 + case 2: //鍦烘櫙鍦板舰鏁版嵁 this.setTerrainData(res); break; - case 3://鏁板瓧楂樼▼妯″瀷锛堟檿娓插浘锛� + case 3: //鏁板瓧楂樼▼妯″瀷锛堟檿娓插浘锛� this.setGeoDataType(res); break; - case 4://鍗曟尝娈垫爡鏍兼暟鎹� + case 4: //鍗曟尝娈垫爡鏍兼暟鎹� this.setGeoDataType(res); break; - case 5://澶氬厜璋辨爡鏍兼暟鎹� + case 5: //澶氬厜璋辨爡鏍兼暟鎹� this.setGeoDataType(res); break; - case 6://楂樺厜璋辨爡鏍兼暟鎹� + case 6: //楂樺厜璋辨爡鏍兼暟鎹� this.setGeoDataType(res); break; - case 7://鐭㈤噺鍥惧眰 + case 7: //鐭㈤噺鍥惧眰 this.setGeoVectorData(res); break; - case 8://涓夌淮妯″瀷 + case 8: //涓夌淮妯″瀷 this.setModelData(res); break; } }, setGeoDataType(res) { switch (res.type) { - case 0://URL + case 0: //URL break; - case 1://TMS + case 1: //TMS this.setAddTmsLayer(res); break; - case 2://WMTS + case 2: //WMTS this.setAddWmtsLayer(res); break; - case 3://WMS + case 3: //WMS this.setAddGeoWmsLayer(res); break; } }, setGeoVectorData(res) { switch (res.type) { - case 0://URL + case 0: //URL break; - case 3://WMS + case 3: //WMS this.setAddGeoWmsLayer(res); break; - case 4://WFS - + case 4: //WFS break; } }, - - - - - setDataType(res) { switch (res.type) { - case 0://URL + case 0: //URL break; - case 1://TMS + case 1: //TMS this.setAddTmsLayer(res); break; - case 2://WMTS + case 2: //WMTS this.setAddWmtsLayer(res); break; - case 3://WMS - this.setAddWmsLayer(res); + case 3: //WMS + // this.setAddWmsLayer(res); + this.setAddGeoWmsLayer(res) break; } }, setTerrainData(res) { switch (res.type) { - case 0://URL - this.setAddTearrinLayer(res) + case 0: //URL + this.setAddTearrinLayer(res); break; - case 1://TMS + case 1: //TMS this.setAddTearrinLayer(res); break; } }, setVectorData(res) { switch (res.type) { - case 0://URL - + case 0: //URL break; - case 3://WMS - this.setAddWmsLayer(res); + case 3: //WMS + // this.setAddWmsLayer(res); + this.setAddGeoWmsLayer(res) break; - case 4://WFS - + case 4: //WFS break; } }, setModelData(res) { switch (res.type) { - case 0://Tileset + case 0: //Tileset this.setAddModelLayer(res); break; - case 3://WMS + case 3: //WMS this.setAddModelLayer(res); break; - case 5://WFS - + case 5: //WFS break; } }, @@ -182,20 +206,20 @@ getLayrUrl(res) { var url; if (res.proxy) { - const token = getToken() - url = config.proxy + res.proxy.replaceAll("{token}", token) + const token = getToken(); + url = config.proxy + res.proxy.replaceAll("{token}", token); } else { url = res.url; } - return url + return url; }, //鍔犺浇TMS鏈嶅姟 setAddTmsLayer(res) { - var url = this.getLayrUrl(res) + var url = this.getLayrUrl(res); let img_layer = earthCtrl.Creator.createUrlTemplateImageryProvider( "tms鏈嶅姟", { - url: Cesium.buildModuleUrl(url + "/{z}/{x}/{y}.png"), + url: Cesium.buildModuleUrl(url + "/{z}/{x}/{reverseY}.png"), }, "0", undefined, @@ -206,11 +230,13 @@ }, //鍔犺浇WMTS鏈嶅姟 setAddWmtsLayer(res) { - var url = this.getLayrUrl(res) - var urlTemplateImageryProvider = earthCtrl.factory.createImageryLayer({ + this.delLayer(res.id); + var url = this.getLayrUrl(res); + let urlTemplateImageryProvider = new Cesium.WebMapTileServiceImageryProvider({ sourceType: "wmts", url: url, layer: "", + id: res.id, format: "image/png", tileMatrixSetID: "GoogleCRS84Quad01", tileMatrixLabels: [ @@ -238,40 +264,86 @@ tilingScheme: new Cesium.GeographicTilingScheme({ ellipsoid: Cesium.Ellipsoid.MOON, }), - }); + }) + + var imageLayer = window.Viewer.imageryLayers.addImageryProvider(urlTemplateImageryProvider); + + imageLayer.id = res.id + + imageLayer.alpha = this.alpha; + // urlTemplateImageryProvider.id = res.id this.layerList.push({ id: res.id, - layerData: urlTemplateImageryProvider._primitive, + layerData: imageLayer, type: "wmts", + alpha: imageLayer, }); + }, + //鑾峰彇鍥惧眰涔嬪墠鐨勯�忔槑搴� + getResLayersAlpha(result) { + var std = this.layerList.filter(res => { + if (res.id == result.id) { + return res; + } + }); + + if (std.length <= 0) { + return 1; + } else { + var id = std[0].id; + var val = null; + var layers = window.Viewer.imageryLayers._layers; + for (var i in layers) { + if (layers[i].id == id) { + val = id; + return layers[i].alpha; + } + } + if (!null) { + return 1 + } + } }, //鍔犺浇鍦板舰鏈嶅姟 setAddTearrinLayer(res) { this.setChangeTearrinLayer(); - var url = this.getLayrUrl(res) + var url = this.getLayrUrl(res); window.terrainLayer = new Cesium.CesiumTerrainProvider({ - url: url + url: url, + tilingScheme: new Cesium.GeographicTilingScheme({ + ellipsoid: Cesium.Ellipsoid.MOON, + }), }); - Viewer.terrainProvider = window.terrainLayer - this.layerList.push({ id: res.id, type: "dem", }); + Viewer.terrainProvider = window.terrainLayer; + Viewer.scene.globe.terrainExaggeration = 1.0000001; + this.layerList.push({ id: res.id, type: "dem" }); }, //鍔犺浇WMS鏈嶅姟 setAddWmsLayer(res) { - var url = this.getLayrUrl(res) - var img_layer = sgworld.Creator.createImageryProvider('giserver', "wms", { - url: url, - layers: '', - parameters: { - format: "image/png", - transparent: true, - } - }, "0", undefined, true, ""); + + var url = this.getLayrUrl(res); + + var img_layer = sgworld.Creator.createImageryProvider( + "giserver", + "wms", + { + url: url, + layers: "", + parameters: { + format: "image/png", + transparent: true, + }, + }, + "0", + undefined, + true, + "" + ); this.layerList.push({ id: res.id, layerData: img_layer, type: "wmts", }); - }, //鍔犺浇妯″瀷鏈嶅姟 setAddModelLayer(res) { @@ -298,7 +370,6 @@ dynamicScreenSpaceErrorFactor: 2, // 鍔ㄦ�佸睆骞曠┖闂磋宸殑绯绘暟 dynamicScreenSpaceError: true, // 鍑忓皯绂荤浉鏈鸿緝杩滅殑灞忓箷绌洪棿閿欒锛歠alse锛屽叏灞忓姞杞藉畬涔嬪悗鎵嶆竻鏅板寲鎴垮眿 }) - ); tileset.readyPromise.then((tileset) => { tileset.id = res.id; @@ -316,15 +387,19 @@ this.layerList.splice(i, 1); break; } - }) + }); }, //娓呴櫎鍥惧眰 delLayer(code) { + this.layerList.forEach((e, i) => { if (e.id === code) { switch (e.type) { case "wmts": + window.Viewer.imageryLayers.remove(e.layerData); + break; + case "wms": window.Viewer.imageryLayers.remove(e.layerData); break; case "tms": @@ -336,19 +411,66 @@ ); break; case "tileset": - window.Viewer.scene.primitives.remove(e.layerData) + window.Viewer.scene.primitives.remove(e.layerData); break; } this.layerList.splice(i, 1); } }); }, + + delLayerAll() { + this.layerList.forEach((e, i) => { + this.setRemoveLayer(e); + this.layerList.splice(i, 1); + }); + }, + setRemoveLayer(e) { + switch (e.type) { + case "wmts": + window.Viewer.imageryLayers.remove(e.layerData); + break; + case "tms": + window.Viewer.imageryLayers.remove(e.layerData); + break; + case "dem": + window.Viewer.terrainProvider = new Cesium.EllipsoidTerrainProvider( + {} + ); + break; + case "tileset": + window.Viewer.scene.primitives.remove(e.layerData); + break; + + } + }, //鍔犺浇GeoServer-WMS鏈嶅姟 - setAddGeoWmsLayer(res) { - var url = this.getLayrUrl(res); + setAddGeoWmsLayer(res, alpha) { + // + var url = res.url; + var that = this; + this.delLayer(res.id) + var getFeatureInfoFormat = new SmartEarth.Cesium.GetFeatureInfoFormat( + "html", + null, + function (html) { + that.getFeatureInfo(html); + } + ); + if (url.indexOf('{token}') > -1) { + const token = getToken(); + url = config.proxy + url.replaceAll("{token}", token); + } else { + url = url; + } + let layer = new SmartEarth.Cesium.WebMapServiceImageryProvider({ url: url, layers: res.tab, + id: res.id, + getFeatureInfoParameters: { info_format: "text/html", srs: "EPSG:104903" }, + enablePickFeatures: true, + getFeatureInfoFormats: [getFeatureInfoFormat], parameters: { transparent: true, format: "image/png", @@ -358,9 +480,129 @@ tileWidth: 512, tileHeight: 512, }); - layer.name = `Wms_Layer${res.id}`; + let img_layer = window.Viewer.imageryLayers.addImageryProvider(layer); + img_layer.name = `Wms_Layer${res.id}`; + img_layer.id = res.id + img_layer.alpha = alpha ? alpha : 1; this.layerList.push({ id: res.id, layerData: img_layer, type: "wmts" }); }, + addGeoServerMmsLayers(layer, url) { + this.geoLayer = layer; + this.geoUrl = url; + var that = this; + var getFeatureInfoFormat = new SmartEarth.Cesium.GetFeatureInfoFormat( + "html", + null, + function (html) { + that.getFeatureInfo(html); + } + ); + if (url.indexOf('{token}') > -1) { + const token = getToken(); + url = config.proxy + url.replaceAll("{token}", token); + } else { + url = url; + } + + if (!this.wmsLayerId) { + this.wmsLayerId = new Date(); + } + let wmslayer = new SmartEarth.Cesium.WebMapServiceImageryProvider({ + url: url, + id: this.wmsLayerId, + layers: layer.toString(), + getFeatureInfoParameters: { info_format: "text/html", srs: "EPSG:104903" }, + enablePickFeatures: true, + getFeatureInfoFormats: [getFeatureInfoFormat], + parameters: { + transparent: true, + format: "image/png", + srs: "EPSG:104903", + styles: "", + }, + tileWidth: 512, + tileHeight: 512, + }); + + let img_layer = window.Viewer.imageryLayers.addImageryProvider(wmslayer); + img_layer.id = this.wmsLayerId; + this.layerList.push({ id: this.wmsLayerId, layerData: img_layer, type: "wmts" }); + }, + getGeoLayerChangeAlpha(res) { + var std = []; + for (var i in this.geoLayer) { + if (this.geoLayer[i] != res.tab) { + std.push(this.geoLayer[i]) + } + } + this.geoLayer = []; + this.geoLayer = std; + var imageLayers = window.Viewer.imageryLayers._layers; + for (var i in imageLayers) { + if (imageLayers[i].id == this.wmsLayerId) { + + window.Viewer.imageryLayers.remove(imageLayers[i]) + } + } + for (var i in this.layerList) { + if (this.layerList[i].id == this.wmsLayerId) { + this.layerList.splice(i, 1) + } + } + if (this.geoLayer.length > 0) { + this.addGeoServerMmsLayers(this.geoLayer, this.geoUrl) + } + this.setAddGeoWmsLayer(res); + for (var i in this.layerList) { + if (this.layerList[i].id == res.id) { + return { + id: i, + layer: this.layerList[i] + }; + break; + } + } + }, + getFeatureInfo(html) { + var start = + html.indexOf('<caption class="featureInfo">') + + '<caption class="featureInfo">'.length; + var end = html.indexOf("</caption>"); + var tab = html.substr(start, end - start); + var std = html + .substr( + html.indexOf("<th>"), + html.lastIndexOf("</th>") - html.indexOf("<th>") + 5 + ) + .replaceAll(" ", "") + .replaceAll("\n", "") + .split("</th>"); + var gindex = null; + for (var i = 0; i < std.length; i++) { + if (std[i].indexOf("gid") > -1) { + gindex = i; + break; + } + } + + if (!gindex) return; + var str = html + .substr( + html.indexOf("<td>"), + html.lastIndexOf("</td>") - html.indexOf("<td>") + 5 + ) + .replaceAll(" ", "") + .replaceAll("\n", "") + .split("</td>"); + var gid = parseInt(str[gindex].replaceAll("<td>", "")); + if (gid && tab) { + store.state.details = { + gid: gid, + tab: tab, + showDetails: true, + }; + } + }, }; export default server; -- Gitblit v1.9.3