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/menuTool.js | 463 +++++++++++++++++++++++++++++++++++++++++++++++++++++---- 1 files changed, 425 insertions(+), 38 deletions(-) diff --git a/src/assets/js/Map/menuTool.js b/src/assets/js/Map/menuTool.js index 874b603..08e846a 100644 --- a/src/assets/js/Map/menuTool.js +++ b/src/assets/js/Map/menuTool.js @@ -1,10 +1,12 @@ import * as turf from "@turf/turf"; import WKT from "terraformer-wkt-parser"; import rightServer from "./rightServer"; -import config from "./config"; +// import config from "../../../../public/config/config"; import CryptoJS from "crypto-js"; // import { Store } from "vuex"; import store from "@/store"; +import temporaryTool from "./temporaryTools"; +import { getToken } from "@/utils/auth"; const menuTool = { toolMenu: null, toolFlag: null, @@ -17,8 +19,16 @@ polyline: SmartEarth.Cesium.Color.fromCssColorString("#ffff0050"), polygon: SmartEarth.Cesium.Color.fromCssColorString("#ffff0050"), }, + exportSquare: null, + imageryProvider: null, + legendBox: null, + Point1: false, topTools(res) { this.toolFlag = res.id; + + + Viewer.scene.globe.depthTestAgainstTerrain = false + Viewer.scene.pickTranslucentDepth = false switch (res.id) { case "a2": //鐐规极娓� this.pointRoam(); @@ -73,12 +83,15 @@ this.snapshot(); break; case "f2": //鐐规煡璇� + this.setClearLocation('绌洪棿鏌ヨ_鏍囩粯'); this.spatialPointQuery(); break; case "f3": //绾挎煡璇� + this.setClearLocation('绌洪棿鏌ヨ_鏍囩粯'); this.spatialLineQuery(); break; case "f4": //闈㈡煡璇� + this.setClearLocation('绌洪棿鏌ヨ_鏍囩粯'); this.spatialQuery(); break; case "g1": //鍧愭爣瀹氫綅 @@ -92,64 +105,185 @@ Viewer.animation.container.style.visibility = "hidden"; Viewer.timeline.container.style.visibility = "hidden"; Viewer.clock.shouldAnimate = false; - return (earthCtrl.shadows = false); + Viewer.scene.globe.enableLighting = false; + earthCtrl.shadows = false; + return } Viewer.clock.shouldAnimate = true; + Viewer.scene.globe.enableLighting = true; Viewer.animation.container.style.visibility = "visible"; Viewer.timeline.container.style.visibility = "visible"; earthCtrl.shadows = true; + earthCtrl.terrainShadows = SmartEarth.Cesium.ShadowMode.ENABLED + + earthCtrl.shadowMap.size = 1024 }, setLocalPosition(res) { if (this.localPoint) { this.setLocalPositionClose(); } - var position = { - X: parseFloat(res.lon), - Y: parseFloat(res.lat), - Altitude: parseFloat(res.alt), - }; - this.localPoint = window.sgworld.Creator.CreateImageLabel( - position, - config.StaticFileBaseUrl + "/Workers/image/mark.png", - {}, - 0, - "鏍囩鐐�" - ); - var id = this.localPoint.item.id; - window.sgworld.Navigate.flyToObj(this.localPoint.item); + this.localPoint = window.Viewer.entities.add({ + name: '鍧愭爣瀹氫綅', + position: Cesium.Cartesian3.fromDegrees(parseFloat(res.lon), parseFloat(res.lat), res.alt == null ? 0 : parseFloat(res.alt)), + billboard: { + image: config.StaticFileBaseUrl + '/Workers/image/location.png', + // 璁剧疆璐村湴 + heightReference: Cesium.Color.CORNFLOWERBLUE.withAlpha(0.4), + verticalOrigin: Cesium.VerticalOrigin.BOTTOM, + scale: 0.3, + }, + }); + this.setViewerFlyTo(this.localPoint) }, setLocalPositionClose() { - this.localPoint.deleteObject(); - this.localPoint = null; + if (this.localPoint) { + // this.localPoint.deleteObject(); + window.Viewer.entities.remove(this.localPoint) + this.localPoint = null; + } + }, //鍧″害鍒嗘瀽 setSlopeMap() { + + + if (window.esriLayer) { + this.setCloseEsriLayer(); + return + } + sgworld.Creator.createSimpleGraphic('rectangle', {}, (entity) => { + if (entity) { + var west = Cesium.Math.toDegrees( + entity.rectangle._coordinates.getValue().west + ); // 鏍规嵁寮у害鑾峰彇鍒扮粡搴� + var east = Cesium.Math.toDegrees( + entity.rectangle._coordinates.getValue().east + ); // 鏍规嵁寮у害鑾峰彇鍒扮含搴� + var north = Cesium.Math.toDegrees( + entity.rectangle._coordinates.getValue().north + ); // 鏍规嵁寮у害鑾峰彇鍒扮粡搴� + var south = Cesium.Math.toDegrees( + entity.rectangle._coordinates.getValue().south + ); // 鏍规嵁寮у害鑾峰彇鍒扮含搴� + sgworld.Creator.SimpleGraphic.clear(); + this.legendBox = [ + west, south, east, north + ] + this.addTMSLayer(this.legendBox) + } + }); + + }, + getLayrUrl(res) { + var url; + if (res.indexOf('{token}')>-1) { + const token = getToken(); + + url = config.proxy + res.replaceAll("{token}", token); + } else { + url = res; + } + return url; + }, + + addTMSLayer(obj) { + var esri = new Cesium.WebMapServiceImageryProvider({ + url: config.esri, + name: 'esriLayer', + rectangle: Cesium.Rectangle.fromDegrees(obj[0], obj[1], obj[2], obj[3]), + crs: 'EPSG:4326', + //transparent: true + parameters: { + format: "image/png", + layers: [0] + } + }); + window.esriLayer = Viewer.imageryLayers.addImageryProvider(esri); + store.state.showlegendLayer = true; + }, + + + + + + + + + + + + + + + + + + setSlopeMap1() { const globe = Viewer.scene.globe; if (window.material) { window.material = null; globe.material = null; Viewer.scene.globe.enableLighting = false; + store.state.slopeQueyFlag = false; + store.state.showSlopeQuey = false; return; } + store.state.slopeQueyFlag = true; window.material = new Cesium.Material({ fabric: { type: "ElevationRamp", uniforms: { - image: config.StaticFileBaseUrl + "Assets/Images/color.png", + image: config.StaticFileBaseUrl + "Assets/Images/colors75.png", minimumHeight: -10000, maximumHeight: 10000, + }, }, }); + Viewer.scene.globe.material = window.material; }, + setImageLayerChange() { + if (window.esriLayer) { + Viewer.imageryLayers.raiseToTop(window.esriLayer); + } + if (this.imageryProvider) { + Viewer.imageryLayers.raiseToTop(this.imageryProvider); + } + }, //绛夐珮绾� setcontour() { + // if (this.imageryProvider) { + // Viewer.imageryLayers.remove(this.imageryProvider); + // this.imageryProvider = null; + // return + // } + // var that = this; + // var imageryProvider = new Cesium.UrlTemplateImageryProvider({ + // url: 'http://192.168.20.83:80/Moon/LFData/2d/tiles/contour_500/{mz}/{my}/{mx}.png', + // tilingScheme: new Cesium.GeographicTilingScheme(), + // customTags: { + // mz: function (imageryProvider, x, y, level) { + // return 'L' + that.zeroFill(level + 1, 2, 10); // 娉ㄦ剰瑙傛祴锛屽眰绾у姞1浜� + // }, + // mx: function (imageryProvider, x, y, level) { + // return 'C' + that.zeroFill(x, 8, 16); + // }, + // my: function (imageryProvider, x, y, level) { + // return 'R' + that.zeroFill(y, 8, 16); + // } + // } + // }); + // this.imageryProvider = Viewer.imageryLayers.addImageryProvider(imageryProvider); var globe = window.Viewer.scene.globe; if (window.material) { window.material = null; globe.material = null; + + store.state.slopeQueyFlag = false; + store.state.showSlopeQuey = false; + return; } @@ -166,6 +300,16 @@ contourUniforms.spacing = 100.0; contourUniforms.color = contourColor; globe.material = window.material; + + }, + + zeroFill(num, len, radix) { + var str = num.toString(radix || 10) + while (str.length < len) { + str = '0' + str + } + + return str; }, //绾挎煡璇� spatialLineQuery() { @@ -177,17 +321,23 @@ var line_data = this.setCartesianToEightFour(res[i]) std.push([line_data.lng, line_data.lat]) } + sgworld.Creator.SimpleGraphic.clear(); + this.setShowSpatialShp(std, 'polyline') + + var line = turf.lineString(std, { name: "polyline" }) var restVal = turf.buffer(line, this.bufferSize, { units: "meters" }) that.setSpatialQuery(restVal) }); }, + spatialPointQuery() { var that = this; sgworld.Creator.createSimpleGraphic('point', {}, (entity) => { var res = entity.position.getValue(); var val = that.setCartesianToEightFour(res) sgworld.Creator.SimpleGraphic.clear(); + that.setShowSpatialShp(val, 'Point') var options = { steps: 10, units: "meters", @@ -197,6 +347,59 @@ that.setSpatialQuery(circle) }); }, + setShowSpatialShp(res, type) { + var position = []; + + var name = '绌洪棿鏌ヨ_鏍囩粯' + switch (type) { + case 'polyline': + for (var i in res) { + position.push(res[i][0], res[i][1]) + } + window.Viewer.entities.add({ + name: name, + polyline: { + positions: Cesium.Cartesian3.fromDegreesArray(position), + width: 3.0, + material: new Cesium.PolylineOutlineMaterialProperty({ + color: new Cesium.Color.fromCssColorString('#A6D8AE').withAlpha(0.5), + outlineWidth: 1, + outlineColor: new Cesium.Color.fromCssColorString('#A6D8AE'), + }), + clampToGround: true, + + }, + }) + break; + case 'Point': + window.Viewer.entities.add({ + name: name, + position: Cesium.Cartesian3.fromDegrees(res.lng, res.lat), + point: { + color: new Cesium.Color.fromCssColorString('#A6D8AE').withAlpha(0.5), + pixelSize: 20, + heightReference: Cesium.HeightReference.CLAMP_TO_GROUND + } + }); + break; + case 'Polygon': + window.Viewer.entities.add({ + name: name, + polygon: { + hierarchy: { positions: Cesium.Cartesian3.fromDegreesArray(res) }, + outline: true, + outlineWidth: 100, + arcType: Cesium.ArcType.RHUMB, + material: new Cesium.Color.fromCssColorString('#A6D8AE').withAlpha(0.5), + outline: true, // height is required for outline to display + outlineColor: new Cesium.Color.fromCssColorString('#A6D8AE') + } + }); + break; + } + + }, + setCartesianToEightFour(res) { var std = {} let ellipsoid = Viewer.scene.globe.ellipsoid @@ -224,6 +427,10 @@ var south = Cesium.Math.toDegrees( entity.rectangle._coordinates.getValue().south ); // 鏍规嵁寮у害鑾峰彇鍒扮含搴� + + var arr = [west, north, east, north, east, south, west, south, west, north]; + this.setShowSpatialShp(arr, 'Polygon') + sgworld.Creator.SimpleGraphic.clear(); var polygon = turf.polygon([ @@ -308,7 +515,9 @@ break; case "l3": //鍦ㄧ嚎鍒跺浘 store.state.isShowMap = true; - this.setThematicMap(); + setTimeout(() => { + this.setThematicMap(); + }, 200); break; case "l4": @@ -324,6 +533,9 @@ }, thematicTools(res) { switch (res.id) { + case "t1": + store.state.setLayerManager = !store.state.setLayerManager; + break; case "t2": this.createSimpleGraphic("rectangle", "square"); break; @@ -363,16 +575,11 @@ var east1 = ss[2]; var north1 = ss[3]; var south1 = ss[1]; + this.exportSquare = ss; var geometry = Cesium.Rectangle.fromDegrees(west1, south1, east1, north1); - - - Viewer.camera.setView({ destination: Cesium.Rectangle.fromDegrees(west, south, east, north), }); - - - setTimeout(() => { window.functionForJs({ type: "exportMap", @@ -382,14 +589,37 @@ }, // 鍒涘缓鍥惧舰 createSimpleGraphic(type, scene) { + var that = this; sgworld.Creator.createSimpleGraphic(type, {}, (entity) => { + if (scene === "square") { this.createRectangle(entity); } + if (!scene) { + temporaryTool.setInsertEntityObj(type, entity) + } }); }, + + colorRgbToHex(str) { + + let reg = /^(rgb|RGB)/; + if (!reg.test(str)) { return; } + var rgb = str.slice(4, str.length - 1).split(",") + // 灏哛GB鑹插彿鎷嗗垎涓虹孩銆佺豢銆佽摑涓変釜閫氶亾鐨勫�� + var r = parseInt(rgb[0]); + var g = parseInt(rgb[1]); + var b = parseInt(rgb[2]); + + + return "#" + ((r << 16) | (g << 8) | b).toString(16).padStart(6, '0'); + + + }, + //鍦ㄧ嚎鍒跺浘 setThematicMap() { + earthCtrl.coreMap.scene.mode = SmartEarth.Cesium.SceneMode.SCENE2D; // var handle = new SmartEarth.Cesium.ScreenSpaceEventHandler( // earthCtrl.viewer.scene.canvas @@ -424,12 +654,15 @@ window.rightViewer.imageryLayers.removeAll(); window.rightViewer = DoubleScreen.right._Viewer; window.rightViewer.animation.container.style.visibility = "hidden"; + window.rightViewer.scene.sun.show = false; //闅愯棌澶槼鍜屾湀浜� + window.rightViewer.scene.moon.show = false; // window.rightViewer.timeline.container.style.visibility = "hidden"; //澶ф皵灞� window.rightViewer.scene.globe.showGroundAtmosphere = false; window.rightViewer.scene.skyAtmosphere.show = false; const compass = document.getElementsByClassName("bottom_btn")[0]; compass.style.right = "calc(50% + 70px)"; + compass.style.positions = "absolute"; store.state.doubleMap = true; setTimeout(() => { window.functionGetLayer({ @@ -444,6 +677,8 @@ window.Volumetric.deleteObject(); window.Volumetric = null; } + Viewer.scene.globe.depthTestAgainstTerrain = true + Viewer.scene.pickTranslucentDepth = true window.Volumetric = earthCtrl.analysis.createVolumetricMeasure({}); window.Volumetric.startDrawing(); }, @@ -476,14 +711,128 @@ }, //鐐规极娓� pointRoam() { - earthCtrl.Analysis.setPointFly(); + store.state.menuFlag = "pointRoam" + + Viewer.scene.globe.depthTestAgainstTerrain = true; + let tooltip = earthCtrl.Core.CreateTooltip(); + let isFly = false, PointFly; + let distance = 2000 //璁剧疆璺濈閫夋嫨鐐硅瀵熺殑鍒濆楂樺害 + //璁剧疆榧犳爣鏍峰紡 + earthCtrl.Core.mouse(earthCtrl.Viewer.container, 1, SmartEarthRootUrl + 'Workers/image/cursor/draw.cur'); + const pickHandler = new Cesium.ScreenSpaceEventHandler(earthCtrl.Viewer.scene.canvas); + const end = () => { + //鎻愮ず璇嶅叧闂� + tooltip.show(false); + pickHandler && pickHandler.destroy(); + //榧犳爣鏍峰紡鎭㈠ + earthCtrl.Core.mouse(earthCtrl.Viewer.container, 0); + PointFly.end(); //绉婚櫎鏃嬭浆瑙嗚椋炶 + } + const fly = (degree) => { + const duration = 3 // 浠庤捣濮嬬偣椋炲埌閫夋嫨鐨勭偣浣嶆椂闂� + //鍥炶皟缁曢 + const callback = function () { + PointFly = earthCtrl.Analysis.setPointFly({ + position: Cesium.Cartesian3.fromDegrees(degree.lon, degree.lat, degree.height+2000), + distance: distance, + }) + } + earthCtrl.camera.flyTo(degree.lon, degree.lat, 100000, 0, -90, 0, duration, callback) + } + pickHandler.setInputAction(function (movement) { + if (!isFly) { + tooltip.showAt(movement.position, '鐐瑰嚮缁撴潫缁曢'); + isFly = true; + let degree = earthCtrl.Navigate.getMouseDegrees(movement); + fly(degree) + } else { + end(); + } + }, Cesium.ScreenSpaceEventType.LEFT_CLICK); + + pickHandler.setInputAction(function (movement) { + !isFly && tooltip.showAt(movement.endPosition, '鐐瑰嚮閫夋嫨瀹氫綅鐐�'); + isFly && tooltip.showAt(movement.endPosition, '鐐瑰嚮缁撴潫缁曢'); + }, Cesium.ScreenSpaceEventType.MOUSE_MOVE); + + pickHandler.setInputAction(function (movement) { + distance -= movement * distance / 300; + distance < 1 && (distance = 1); + PointFly.distance = distance + }, Cesium.ScreenSpaceEventType.WHEEL); + + // earthCtrl.Analysis.setPointFly({distance:5000}); + // earthCtrl.measure.pickPosition({}, (e) => { + // Viewer.scene.globe.depthTestAgainstTerrain = false; + // const lon = e.result.longitude + // const lat = e.result.latitude + // const alt = e.result.alt + // const hei = 10000 //椋炶鍒扮偣浣嶇殑楂樺害 + // const heading = 0 + // const pitch = -90 + // const roll = 0 + // const duration = 3 //椋炶鏃堕棿 + // //鏍囪閫夋嫨鐨勭偣浣嶄负绾㈢偣 + // const Point1 = earthCtrl.factory.createPoint({ + // id: earthCtrl.factory.createUUID(), + // name: '鐐瑰嚮鐨勭偣', + // lon: lon, + // lat: lat, + // alt: 300, + // pixelSize: 15, + // color: SmartEarth.Cesium.Color.fromCssColorString("#ff0000"), + // outlineColor: SmartEarth.Cesium.Color.BLACK, + // outlineWidth: 1, + // }); + // this.Point1 = earthCtrl.factory.createBillboard({ + // name: "鏍囩鐐�", + // id: earthCtrl.factory.createUUID(), + // image:imageUrl+"/img/mark.png", + // width:16, + // height:22, + // lon: lon, + // lat: lat, + // alt: 10, + // scale: 1.5, + // }); + + + + + + // //鍥炶皟缁曢 + // const callback = () => { + // earthCtrl.tools.clearTool();//缁撴潫鎷惧彇 + // const useTime = 5 //鍗曚綅绉� + // //鏃嬭浆缁曢 + // const roate = earthCtrl.camera.rotateCamera({ + // lon: lon, + // lat: lat, + // distance: hei, + // pitch: -30, + // time: useTime + // }) + // const timeout = setTimeout(() => { + // roate.removeFromMap(); //绉婚櫎鏃嬭浆瑙嗚閿佸畾 + // clearTimeout(timeout) + // this.Point1.removeFromMap() + // }, useTime * 1000); + // } + // //椋炶 + // earthCtrl.camera.flyTo(lon, lat, hei, heading, pitch, roll, duration, callback) + + + // }) }, //绾挎极娓� lineRoam() { + Viewer.scene.globe.depthTestAgainstTerrain = true; + // 缁樺埗璺嚎骞惰幏鍙栬矾寰勫姩鐢绘暟鎹� earthCtrl.Command.execute(2, 3, "", (data) => { + data.showPoint = false; data.showLine = true; - data.mode = 1; + data.mode = 0; // 寮圭獥鏁版嵁 window.PathAnimationData = { flyData: data, @@ -501,6 +850,7 @@ }, }); }); + }, //娓呴櫎鎸夐挳 clearALL(id) { @@ -509,15 +859,26 @@ // }); }, + setCloseEsriLayer() { + if (window.esriLayer) { + Viewer.imageryLayers.remove(window.esriLayer); + window.esriLayer = null + this.legendBox = null; + store.state.showlegendLayer = false; + } + }, //娓呴櫎鏂规硶 clearTopTools(id) { store.state.doubleMap = false; store.state.doubleMenu = false; + this.setCloseEsriLayer(); if (earthCtrl.shadows) { Viewer.animation.container.style.visibility = "hidden"; Viewer.timeline.container.style.visibility = "hidden"; Viewer.clock.shouldAnimate = false; - return (earthCtrl.shadows = false); + Viewer.scene.globe.enableLighting = false; + earthCtrl.shadows = false; + return } if (window.Volumetric) { window.Volumetric.deleteObject(); @@ -532,7 +893,12 @@ window.material = null; globe.material = null; Viewer.scene.globe.enableLighting = false; - return; + store.state.slopeQueyFlag = false; + store.state.showSlopeQuey = false; + } + if (this.imageryProvider) { + Viewer.imageryLayers.remove(this.imageryProvider) + this.imageryProvider = null; } if (window.DoubleScreen) { window.DoubleScreen && window.DoubleScreen.destroy(); @@ -553,7 +919,6 @@ //绌洪棿鏌ヨ灞炴�у畾浣� spaceLocation(res) { var name = '绌洪棿鏌ヨ'; - debugger this.setClearLocation(name); switch (res.type) { case 'MultiPolygon': @@ -593,12 +958,20 @@ outline: true, outlineWidth: 100, arcType: Cesium.ArcType.RHUMB, - material: Cesium.Color.CORNFLOWERBLUE.withAlpha(0.4), + material: Cesium.Color.CORNFLOWERBLUE.withAlpha(0.5), outline: true, // height is required for outline to display outlineColor: Cesium.Color.DODGERBLUE, } + }); - this.setViewerFlyTo(locationPolygonEntity) + window.Viewer.flyTo(locationPolygonEntity, { + offset: { + heading: Cesium.Math.toRadians(0.0), + pitch: Cesium.Math.toRadians(-90), + range: 40 + } + } + ); }, setLocationPoint(res, name) { const position = window.Viewer.entities.add({ @@ -607,15 +980,22 @@ billboard: { image: config.StaticFileBaseUrl + '/Workers/image/location.png', // 璁剧疆璐村湴 - heightReference: Cesium.Color.CORNFLOWERBLUE.withAlpha(0.4), + heightReference: Cesium.Color.CORNFLOWERBLUE.withAlpha(0.5), verticalOrigin: Cesium.VerticalOrigin.BOTTOM, - scale: 5.0, + scale: 0.3, }, }); - this.setViewerFlyTo(position) + window.Viewer.flyTo(position, { + offset: { + heading: Cesium.Math.toRadians(0.0), + pitch: Cesium.Math.toRadians(-45), + range: 40000 + } + }); }, setViewerFlyTo(entity) { + window.Viewer.flyTo(entity, { offset: { heading: Cesium.Math.toRadians(0.0), @@ -638,7 +1018,7 @@ positions: Cesium.Cartesian3.fromDegreesArray(position), width: 10.0, material: new Cesium.PolylineOutlineMaterialProperty({ - color: Cesium.Color.CORNFLOWERBLUE.withAlpha(0.4), + color: Cesium.Color.CORNFLOWERBLUE.withAlpha(0.5), outlineWidth: 1, outlineColor: Cesium.Color.CORNFLOWERBLUE, }), @@ -646,7 +1026,14 @@ }, }) - this.setViewerFlyTo(polyline) + window.Viewer.flyTo(polyline, { + offset: { + heading: Cesium.Math.toRadians(0.0), + pitch: Cesium.Math.toRadians(-90), + range: 0 + } + } + ); } }; -- Gitblit v1.9.3