| | |
| | | <template> |
| | | <div class="current-wrapper" style="height: 100%; width: 100%; position: relative;"> |
| | | <div class="map-box" id="viewer-container-one"> |
| | | <select-time ref="leftRoller" :type="'viewerOne'" class="time"></select-time> |
| | | <select-time |
| | | ref="ViewerOne" |
| | | :type="'viewerOne'" |
| | | class="time" |
| | | :selectList="viewerOneLayers" |
| | | ></select-time> |
| | | </div> |
| | | <div class="map-box" id="viewer-container-two"> |
| | | <select-time ref="leftRoller" :type="'viewerTwo'" class="time"></select-time> |
| | | <select-time |
| | | ref="ViewerTwo" |
| | | :type="'viewerTwo'" |
| | | class="time" |
| | | :selectList="viewerTwoLayers" |
| | | ></select-time> |
| | | </div> |
| | | <div class="map-box" id="viewer-container-three"> |
| | | <select-time ref="leftRoller" :type="'viewerThree'" class="time"></select-time> |
| | | <select-time |
| | | ref="ViewerThree" |
| | | :type="'viewerThree'" |
| | | class="time" |
| | | :selectList="viewerThreeLayers" |
| | | ></select-time> |
| | | </div> |
| | | <div class="map-box" id="viewer-container-four"> |
| | | <select-time ref="leftRoller" :type="'viewerFour'" class="time"></select-time> |
| | | <select-time |
| | | ref="ViewerFour" |
| | | :type="'viewerFour'" |
| | | class="time" |
| | | :selectList="viewerFourLayers" |
| | | ></select-time> |
| | | </div> |
| | | |
| | | <div class="line-row"></div> |
| | |
| | | |
| | | data () { |
| | | return { |
| | | rollerCloseShow: false |
| | | rollerCloseShow: false, |
| | | viewerOneLayers: [], |
| | | viewerTwoLayers: [], |
| | | viewerThreeLayers: [], |
| | | viewerFourLayers: [] |
| | | } |
| | | }, |
| | | |
| | | computed: { |
| | | created () { |
| | | this.viewerOneLayers = [{ |
| | | title: '2022年5月影像', |
| | | url: 'http://arcgis.jxpskj.com:6080/arcgis/rest/services/nanchengdom/MapServer/WMTS', |
| | | layer: 'nanchengdom', |
| | | style: 'default', |
| | | tileMatrixSetID: 'default028mm', |
| | | format: 'image/png', |
| | | tilingScheme: new global.DC.Namespace.Cesium.GeographicTilingScheme(), |
| | | maximumLevel: 19, |
| | | tileMatrixLabels: [ |
| | | '0', |
| | | '1', |
| | | '2', |
| | | '3', |
| | | '4', |
| | | '5', |
| | | '6', |
| | | '7', |
| | | '8', |
| | | '9', |
| | | '10', |
| | | '11', |
| | | '12', |
| | | '13', |
| | | '14', |
| | | '15', |
| | | '16', |
| | | '17', |
| | | '18', |
| | | '19' |
| | | ] |
| | | }, { |
| | | title: '2022年7月影像', |
| | | url: 'http://arcgis.jxpskj.com:6080/arcgis/rest/services/nanchengdomjuly/MapServer/WMTS', |
| | | layer: 'nanchengdomjuly', |
| | | style: 'default', |
| | | tileMatrixSetID: 'default028mm', |
| | | format: 'image/png', |
| | | tilingScheme: new global.DC.Namespace.Cesium.GeographicTilingScheme(), |
| | | maximumLevel: 19, |
| | | tileMatrixLabels: [ |
| | | '0', |
| | | '1', |
| | | '2', |
| | | '3', |
| | | '4', |
| | | '5', |
| | | '6', |
| | | '7', |
| | | '8', |
| | | '9', |
| | | '10', |
| | | '11', |
| | | '12', |
| | | '13', |
| | | '14', |
| | | '15', |
| | | '16', |
| | | '17', |
| | | '18', |
| | | '19' |
| | | ] |
| | | }] |
| | | |
| | | this.viewerTwoLayers = [{ |
| | | title: '2022年5月影像', |
| | | url: 'http://arcgis.jxpskj.com:6080/arcgis/rest/services/nanchengdom/MapServer/WMTS', |
| | | layer: 'nanchengdom', |
| | | style: 'default', |
| | | tileMatrixSetID: 'default028mm', |
| | | format: 'image/png', |
| | | tilingScheme: new global.DC.Namespace.Cesium.GeographicTilingScheme(), |
| | | maximumLevel: 19, |
| | | tileMatrixLabels: [ |
| | | '0', |
| | | '1', |
| | | '2', |
| | | '3', |
| | | '4', |
| | | '5', |
| | | '6', |
| | | '7', |
| | | '8', |
| | | '9', |
| | | '10', |
| | | '11', |
| | | '12', |
| | | '13', |
| | | '14', |
| | | '15', |
| | | '16', |
| | | '17', |
| | | '18', |
| | | '19' |
| | | ] |
| | | }, { |
| | | title: '2022年7月影像', |
| | | url: 'http://arcgis.jxpskj.com:6080/arcgis/rest/services/nanchengdomjuly/MapServer/WMTS', |
| | | layer: 'nanchengdomjuly', |
| | | style: 'default', |
| | | tileMatrixSetID: 'default028mm', |
| | | format: 'image/png', |
| | | tilingScheme: new global.DC.Namespace.Cesium.GeographicTilingScheme(), |
| | | maximumLevel: 19, |
| | | tileMatrixLabels: [ |
| | | '0', |
| | | '1', |
| | | '2', |
| | | '3', |
| | | '4', |
| | | '5', |
| | | '6', |
| | | '7', |
| | | '8', |
| | | '9', |
| | | '10', |
| | | '11', |
| | | '12', |
| | | '13', |
| | | '14', |
| | | '15', |
| | | '16', |
| | | '17', |
| | | '18', |
| | | '19' |
| | | ] |
| | | }] |
| | | |
| | | this.viewerThreeLayers = [{ |
| | | title: '2022年5月影像', |
| | | url: 'http://arcgis.jxpskj.com:6080/arcgis/rest/services/nanchengdom/MapServer/WMTS', |
| | | layer: 'nanchengdom', |
| | | style: 'default', |
| | | tileMatrixSetID: 'default028mm', |
| | | format: 'image/png', |
| | | tilingScheme: new global.DC.Namespace.Cesium.GeographicTilingScheme(), |
| | | maximumLevel: 19, |
| | | tileMatrixLabels: [ |
| | | '0', |
| | | '1', |
| | | '2', |
| | | '3', |
| | | '4', |
| | | '5', |
| | | '6', |
| | | '7', |
| | | '8', |
| | | '9', |
| | | '10', |
| | | '11', |
| | | '12', |
| | | '13', |
| | | '14', |
| | | '15', |
| | | '16', |
| | | '17', |
| | | '18', |
| | | '19' |
| | | ] |
| | | }, { |
| | | title: '2022年7月影像', |
| | | url: 'http://arcgis.jxpskj.com:6080/arcgis/rest/services/nanchengdomjuly/MapServer/WMTS', |
| | | layer: 'nanchengdomjuly', |
| | | style: 'default', |
| | | tileMatrixSetID: 'default028mm', |
| | | format: 'image/png', |
| | | tilingScheme: new global.DC.Namespace.Cesium.GeographicTilingScheme(), |
| | | maximumLevel: 19, |
| | | tileMatrixLabels: [ |
| | | '0', |
| | | '1', |
| | | '2', |
| | | '3', |
| | | '4', |
| | | '5', |
| | | '6', |
| | | '7', |
| | | '8', |
| | | '9', |
| | | '10', |
| | | '11', |
| | | '12', |
| | | '13', |
| | | '14', |
| | | '15', |
| | | '16', |
| | | '17', |
| | | '18', |
| | | '19' |
| | | ] |
| | | }] |
| | | |
| | | this.viewerFourLayers = [{ |
| | | title: '2022年5月影像', |
| | | url: 'http://arcgis.jxpskj.com:6080/arcgis/rest/services/nanchengdom/MapServer/WMTS', |
| | | layer: 'nanchengdom', |
| | | style: 'default', |
| | | tileMatrixSetID: 'default028mm', |
| | | format: 'image/png', |
| | | tilingScheme: new global.DC.Namespace.Cesium.GeographicTilingScheme(), |
| | | maximumLevel: 19, |
| | | tileMatrixLabels: [ |
| | | '0', |
| | | '1', |
| | | '2', |
| | | '3', |
| | | '4', |
| | | '5', |
| | | '6', |
| | | '7', |
| | | '8', |
| | | '9', |
| | | '10', |
| | | '11', |
| | | '12', |
| | | '13', |
| | | '14', |
| | | '15', |
| | | '16', |
| | | '17', |
| | | '18', |
| | | '19' |
| | | ] |
| | | }, { |
| | | title: '2022年7月影像', |
| | | url: 'http://arcgis.jxpskj.com:6080/arcgis/rest/services/nanchengdomjuly/MapServer/WMTS', |
| | | layer: 'nanchengdomjuly', |
| | | style: 'default', |
| | | tileMatrixSetID: 'default028mm', |
| | | format: 'image/png', |
| | | tilingScheme: new global.DC.Namespace.Cesium.GeographicTilingScheme(), |
| | | maximumLevel: 19, |
| | | tileMatrixLabels: [ |
| | | '0', |
| | | '1', |
| | | '2', |
| | | '3', |
| | | '4', |
| | | '5', |
| | | '6', |
| | | '7', |
| | | '8', |
| | | '9', |
| | | '10', |
| | | '11', |
| | | '12', |
| | | '13', |
| | | '14', |
| | | '15', |
| | | '16', |
| | | '17', |
| | | '18', |
| | | '19' |
| | | ] |
| | | }] |
| | | }, |
| | | |
| | | mounted () { |
| | | const that = this |
| | | |
| | |
| | | } |
| | | |
| | | global.DC.ready(initViewer) |
| | | |
| | | this.$refs.ViewerOne.screenInit() |
| | | this.$refs.ViewerTwo.screenInit() |
| | | this.$refs.ViewerThree.screenInit() |
| | | this.$refs.ViewerFour.screenInit() |
| | | }) |
| | | }, |
| | | methods: { |