| | |
| | | <div> |
| | | <div id="sdkContainer"></div> |
| | | <div class="listBox" v-show="viewer1Show && !isLand"> |
| | | <ul> |
| | | <ul id="viewer_lsyx"> |
| | | <li v-for="(item, index) in arr" :key="index" @click="changeLeftMap($event, item, index)"> |
| | | {{ item }} |
| | | </li> |
| | |
| | | import "animate.css"; |
| | | import Bus from "@tools/Bus"; |
| | | |
| | | let activeLi, nLayer,LWLayer; |
| | | let activeLi, nLayer, LWLayer; |
| | | export default { |
| | | name: "viewer", |
| | | components: { |
| | |
| | | viewer1Show(newvalue, oldvalue) { |
| | | if (!newvalue) { |
| | | this.destroyImageLayer(); |
| | | } else { |
| | | if (!this.isLand) { |
| | | this.initLSYX(); |
| | | } |
| | | } |
| | | }, |
| | | isLand(newvalue, oldvalue) { |
| | | if (newvalue) { |
| | | this.destroyImageLayer(); |
| | | } else { |
| | | this.initLSYX(); |
| | | } |
| | | |
| | | } |
| | | }, |
| | | }, |
| | | mounted() { |
| | | this.$nextTick(function () { |
| | |
| | | window.sgworld = new SmartEarth.EarthCtrl( |
| | | "sdkContainer", |
| | | { |
| | | // StaticFileBaseUrl: "../../../static/CimSDK/", |
| | | StaticFileBaseUrl: "../../../YZXNCS/static/CimSDK/", |
| | | StaticFileBaseUrl: "../../../static/CimSDK/", |
| | | // StaticFileBaseUrl: "../../../SW/static/CimSDK/", |
| | | }, |
| | | {}, |
| | | {}, |
| | |
| | | } |
| | | ); |
| | | window.Viewer = sgworld._Viewer; |
| | | window.sgwfs = new SmartEarth.WFSTool(sgworld._Viewer); |
| | | |
| | | window.sgwfs = new SmartEarth.WFSTool(sgworld._Viewer, Cesium); |
| | | Viewer.shadows = false; |
| | | //深度检测 |
| | | sgworld.Analysis.depthTestAgainstTerrain(true); |
| | |
| | | }, |
| | | }); |
| | | |
| | | |
| | | |
| | | |
| | | |
| | | |
| | | |
| | | |
| | | |
| | | |
| | | //初始化弹窗事件 |
| | | // that.showBottom(); |
| | | that.initLayerOpen(); |
| | |
| | | this.destroyImageLayer(); |
| | | } |
| | | }, |
| | | initLSYX() { |
| | | let ul = document.getElementById("viewer_lsyx"); |
| | | let lis = ul.getElementsByTagName('li'); |
| | | lis[19].click(); |
| | | }, |
| | | destroyImageLayer() { |
| | | if (activeLi) { |
| | | activeLi.classList.remove('active'); |
| | | activeLi.classList.remove("active"); |
| | | activeLi = null; |
| | | } |
| | | if (nLayer) { |
| | |
| | | changeLeftMap(event, item, index) { |
| | | let liObj = event.currentTarget; |
| | | if (activeLi) { |
| | | activeLi.classList.remove('active'); |
| | | activeLi.classList.remove("active"); |
| | | activeLi = null; |
| | | } |
| | | liObj.classList.add('active'); |
| | | liObj.classList.add("active"); |
| | | activeLi = liObj; |
| | | this.loadImageLayer(item); |
| | | }, |
| | |
| | | nLayer = null; |
| | | } |
| | | nLayer = this.loadBJ54ImageLayer(year); |
| | | if(!LWLayer) |
| | | { |
| | | if (!LWLayer||Viewer.imageryLayers.indexOf(LWLayer)<0) { |
| | | if(LWLayer) |
| | | { |
| | | LWLayer.destroy(); |
| | | } |
| | | LWLayer = this.loadBJ54LWLayer(); |
| | | } |
| | | |
| | | }, |
| | | loadBJ54LWLayer() { |
| | | let url = "http://172.26.64.84/service/ImageEngine/picdis/abc"; |
| | | //let url = option.url; |
| | | //let year = option.year; |
| | | let paramUrl = `${url}?user=jjjskfq&password=Jjjskfq@2022&layer=Shiliang_Lw_2019&style=&Service=WMTS&Request=GetTile&Version=1.0.0&Format=image%2Fpng&TileMatrix={z}&TileCol={nx}&TileRow={ny}`; |
| | | let minx = 113.168199 * Math.PI / 180.0; |
| | | let miny = 39.230551 * Math.PI / 180.0; |
| | | let maxx = 118.562362 * Math.PI / 180.0; |
| | | let maxy = 41.294714 * Math.PI / 180.0; |
| | | let minx = (113.168199 * Math.PI) / 180.0; |
| | | let miny = (39.230551 * Math.PI) / 180.0; |
| | | let maxx = (118.562362 * Math.PI) / 180.0; |
| | | let maxy = (41.294714 * Math.PI) / 180.0; |
| | | let rectangle = new Cesium.Rectangle(minx, miny, maxx, maxy); |
| | | let tilingScheme = new Cesium.GeographicTilingScheme({ |
| | | rectangle: rectangle, |
| | | numberOfLevelZeroTilesX: 2, |
| | | numberOfLevelZeroTilesY: 1 |
| | | numberOfLevelZeroTilesY: 1, |
| | | }); |
| | | var dx = { |
| | | url: paramUrl, |
| | |
| | | }, |
| | | ny: function (imageryProvider, x, y, level) { |
| | | return (2 << (level - 1)) + y; |
| | | } |
| | | } |
| | | }, |
| | | }, |
| | | }; |
| | | var imageryProvider = new Cesium.UrlTemplateImageryProvider(dx); |
| | | let imageLayer = new Cesium.ImageryLayer(imageryProvider, { alpha: 1, brightness: 1.0 }); |
| | | let imageLayer = new Cesium.ImageryLayer(imageryProvider, { |
| | | alpha: 1, |
| | | brightness: 1.0, |
| | | }); |
| | | Viewer.imageryLayers.add(imageLayer, 3); |
| | | return imageLayer; |
| | | }, |
| | |
| | | //let url = option.url; |
| | | //let year = option.year; |
| | | let paramUrl = `${url}?user=jjjskfq&password=Jjjskfq@2022&layer=Sate_${year}&style=&Service=WMTS&Request=GetTile&Version=1.0.0&Format=image%2Fpng&TileMatrix={z}&TileCol={nx}&TileRow={ny}`; |
| | | let minx = 113.168199 * Math.PI / 180.0; |
| | | let miny = 39.230551 * Math.PI / 180.0; |
| | | let maxx = 118.562362 * Math.PI / 180.0; |
| | | let maxy = 41.294714 * Math.PI / 180.0; |
| | | let minx = (113.168199 * Math.PI) / 180.0; |
| | | let miny = (39.230551 * Math.PI) / 180.0; |
| | | let maxx = (118.562362 * Math.PI) / 180.0; |
| | | let maxy = (41.294714 * Math.PI) / 180.0; |
| | | let rectangle = new Cesium.Rectangle(minx, miny, maxx, maxy); |
| | | let tilingScheme = new Cesium.GeographicTilingScheme({ |
| | | rectangle: rectangle, |
| | | numberOfLevelZeroTilesX: 2, |
| | | numberOfLevelZeroTilesY: 1 |
| | | numberOfLevelZeroTilesY: 1, |
| | | }); |
| | | var dx = { |
| | | url: paramUrl, |
| | |
| | | }, |
| | | ny: function (imageryProvider, x, y, level) { |
| | | return (2 << (level - 1)) + y; |
| | | } |
| | | } |
| | | }, |
| | | }, |
| | | }; |
| | | var imageryProvider = new Cesium.UrlTemplateImageryProvider(dx); |
| | | let imageLayer = new Cesium.ImageryLayer(imageryProvider, { alpha: 1, brightness: 1.0 }); |
| | | let imageLayer = new Cesium.ImageryLayer(imageryProvider, { |
| | | alpha: 1, |
| | | brightness: 1.0, |
| | | }); |
| | | Viewer.imageryLayers.add(imageLayer, 2); |
| | | return imageLayer; |
| | | }, |
| | |
| | | this.switchImagerLayer = !this.switchImagerLayer; |
| | | }, |
| | | ArcgisImageryLayer() { |
| | | var layer = sgworld.factory.createImageryLayer({ |
| | | sourceType: "arcgis", |
| | | url: "https://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer", |
| | | }); |
| | | sgworld.Creator.createArcGisImageryLayer( |
| | | "ARCGIS", |
| | | { |
| | | url: "https://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer", |
| | | enablePickFeatures: false, |
| | | }, |
| | | "0", |
| | | 1, |
| | | true, |
| | | "" |
| | | ); |
| | | }, |
| | | //初始化弹窗事件 |
| | | |
| | |
| | | position: absolute; |
| | | left: 20px; |
| | | top: 100px; |
| | | |
| | | } |
| | | |
| | | .listBox .active { |
| | | |
| | | background: rgba(255, 166, 0, 0.808); |
| | | |
| | | } |
| | | |
| | | .listBox li { |