From 6f5331c9ba8b6ba44b45b6a89d7c7c813ab8052d Mon Sep 17 00:00:00 2001
From: zengh <123456>
Date: Fri, 08 Jul 2022 20:28:29 +0800
Subject: [PATCH] Merge remote-tracking branch 'origin/master'
---
src/components/splitScreen/index.vue | 153 ++++++++++++++++----------------------------------
1 files changed, 50 insertions(+), 103 deletions(-)
diff --git a/src/components/splitScreen/index.vue b/src/components/splitScreen/index.vue
index 2ce6c90..29d7def 100644
--- a/src/components/splitScreen/index.vue
+++ b/src/components/splitScreen/index.vue
@@ -1,10 +1,18 @@
/* eslint-disable camelcase */
<template>
<div class="current-wrapper" style="height: 100%; width: 100%; position: relative;">
- <div class="map-box" id="viewer-container-one"></div>
- <div class="map-box" id="viewer-container-two"></div>
- <div class="map-box" id="viewer-container-three"></div>
- <div class="map-box" id="viewer-container-four"></div>
+ <div class="map-box" id="viewer-container-one">
+ <select-time ref="leftRoller" :type="'viewerOne'" class="time"></select-time>
+ </div>
+ <div class="map-box" id="viewer-container-two">
+ <select-time ref="leftRoller" :type="'viewerTwo'" class="time"></select-time>
+ </div>
+ <div class="map-box" id="viewer-container-three">
+ <select-time ref="leftRoller" :type="'viewerThree'" class="time"></select-time>
+ </div>
+ <div class="map-box" id="viewer-container-four">
+ <select-time ref="leftRoller" :type="'viewerFour'" class="time"></select-time>
+ </div>
<div class="line-row"></div>
<div class="line-column"></div>
@@ -12,10 +20,10 @@
</template>
<script>
-let viewerOne = null
-let viewerTwo = null
-let viewerThree = null
-let viewerFour = null
+window.viewerOne = null
+window.viewerTwo = null
+window.viewerThree = null
+window.viewerFour = null
let handlerTL = null
let handlerTR = null
@@ -39,7 +47,7 @@
this.$nextTick(() => {
function initViewer () {
- viewerOne = new global.DC.Viewer('viewer-container-one', {
+ window.viewerOne = new global.DC.Viewer('viewer-container-one', {
contextOptions: {
webgl: {
alpha: true,
@@ -49,7 +57,7 @@
}
})
- viewerTwo = new global.DC.Viewer('viewer-container-two', {
+ window.viewerTwo = new global.DC.Viewer('viewer-container-two', {
contextOptions: {
webgl: {
alpha: true,
@@ -59,7 +67,7 @@
}
})
- viewerThree = new global.DC.Viewer('viewer-container-three', {
+ window.viewerThree = new global.DC.Viewer('viewer-container-three', {
contextOptions: {
webgl: {
alpha: true,
@@ -69,7 +77,7 @@
}
})
- viewerFour = new global.DC.Viewer('viewer-container-four', {
+ window.viewerFour = new global.DC.Viewer('viewer-container-four', {
contextOptions: {
webgl: {
alpha: true,
@@ -80,25 +88,25 @@
})
if (global.DC.Namespace.Cesium.FeatureDetection.supportsImageRenderingPixelated()) { // 判断是否支持图像渲染像素化处理
- viewerOne.setOptions({
+ window.viewerOne.setOptions({
resolutionScale: window.devicePixelRatio
})
- viewerTwo.setOptions({
+ window.viewerTwo.setOptions({
resolutionScale: window.devicePixelRatio
})
- viewerThree.setOptions({
+ window.viewerThree.setOptions({
resolutionScale: window.devicePixelRatio
})
- viewerFour.setOptions({
+ window.viewerFour.setOptions({
resolutionScale: window.devicePixelRatio
})
}
// 影像
- viewerOne.imageryLayers.addImageryProvider(
+ window.viewerOne.imageryLayers.addImageryProvider(
new global.DC.Namespace.Cesium.UrlTemplateImageryProvider({
url: 'http://t{s}.tianditu.gov.cn/DataServer?T=img_w&x={x}&y={y}&l={z}&tk=e9533f5acb2ac470b07f406a4d24b4f0',
subdomains: ['0', '1', '2', '3', '4', '5', '6', '7'],
@@ -108,7 +116,7 @@
})
)
- viewerTwo.imageryLayers.addImageryProvider(
+ window.viewerTwo.imageryLayers.addImageryProvider(
new global.DC.Namespace.Cesium.UrlTemplateImageryProvider({
url: 'http://t{s}.tianditu.gov.cn/DataServer?T=img_w&x={x}&y={y}&l={z}&tk=e9533f5acb2ac470b07f406a4d24b4f0',
subdomains: ['0', '1', '2', '3', '4', '5', '6', '7'],
@@ -118,7 +126,7 @@
})
)
- viewerThree.imageryLayers.addImageryProvider(
+ window.viewerThree.imageryLayers.addImageryProvider(
new global.DC.Namespace.Cesium.UrlTemplateImageryProvider({
url: 'http://t{s}.tianditu.gov.cn/DataServer?T=img_w&x={x}&y={y}&l={z}&tk=e9533f5acb2ac470b07f406a4d24b4f0',
subdomains: ['0', '1', '2', '3', '4', '5', '6', '7'],
@@ -128,83 +136,13 @@
})
)
- viewerFour.imageryLayers.addImageryProvider(
+ window.viewerFour.imageryLayers.addImageryProvider(
new global.DC.Namespace.Cesium.UrlTemplateImageryProvider({
url: 'http://t{s}.tianditu.gov.cn/DataServer?T=img_w&x={x}&y={y}&l={z}&tk=e9533f5acb2ac470b07f406a4d24b4f0',
subdomains: ['0', '1', '2', '3', '4', '5', '6', '7'],
format: 'image/jpeg',
show: true,
maximumLevel: 18
- })
- )
-
- viewerOne.imageryLayers.addImageryProvider(
- new global.DC.Namespace.Cesium.WebMapTileServiceImageryProvider({
- url: 'http://arcgis.jxpskj.com:6080/arcgis/rest/services/nanchengyjjddom/MapServer/WMTS',
- // url: 'http://arcgis.jxpskj.com:6080/arcgis/rest/services/nanchengdom/MapServer/WMTS',
- layer: 'nanchengyjjddom',
- 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'
- ]
- })
- )
-
- viewerOne.imageryLayers.addImageryProvider(
- new global.DC.Namespace.Cesium.WebMapTileServiceImageryProvider({
- url: 'http://arcgis.jxpskj.com:6080/arcgis/rest/services/nanchengdom/MapServer/WMTS',
- // 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'
- ]
})
)
@@ -229,9 +167,9 @@
// })
// )
- that.initHandler(viewerOne, viewerTwo, viewerThree, viewerFour)
+ that.initHandler(window.viewerOne, window.viewerTwo, window.viewerThree, window.viewerFour)
- viewerOne.camera.setView({
+ window.viewerOne.camera.setView({
// Cesium的坐标是以地心为原点，一向指向南美洲，一向指向亚洲，一向指向北极州
// fromDegrees()方法，将经纬度和高程转换为世界坐标
destination: global.DC.Namespace.Cesium.Cartesian3.fromDegrees(
@@ -246,7 +184,7 @@
}
})
- viewerTwo.camera.setView({
+ window.viewerTwo.camera.setView({
// Cesium的坐标是以地心为原点，一向指向南美洲，一向指向亚洲，一向指向北极州
// fromDegrees()方法，将经纬度和高程转换为世界坐标
destination: global.DC.Namespace.Cesium.Cartesian3.fromDegrees(
@@ -261,7 +199,7 @@
}
})
- viewerThree.camera.setView({
+ window.viewerThree.camera.setView({
// Cesium的坐标是以地心为原点，一向指向南美洲，一向指向亚洲，一向指向北极州
// fromDegrees()方法，将经纬度和高程转换为世界坐标
destination: global.DC.Namespace.Cesium.Cartesian3.fromDegrees(
@@ -276,7 +214,7 @@
}
})
- viewerFour.camera.setView({
+ window.viewerFour.camera.setView({
// Cesium的坐标是以地心为原点，一向指向南美洲，一向指向亚洲，一向指向北极州
// fromDegrees()方法，将经纬度和高程转换为世界坐标
destination: global.DC.Namespace.Cesium.Cartesian3.fromDegrees(
@@ -376,15 +314,15 @@
handlerBL = null
handlerBR = null
- viewerOne.destroy()
- viewerTwo.destroy()
- viewerThree.destroy()
- viewerFour.destroy()
+ window.viewerOne.destroy()
+ window.viewerTwo.destroy()
+ window.viewerThree.destroy()
+ window.viewerFour.destroy()
- viewerOne = null
- viewerTwo = null
- viewerThree = null
- viewerFour = null
+ window.viewerOne = null
+ window.viewerTwo = null
+ window.viewerThree = null
+ window.viewerFour = null
}
}
</script>
@@ -407,8 +345,17 @@
flex-wrap: wrap;
.map-box {
+ position: relative;
width: 50%;
height: 50%;
+
+ .time {
+ position: absolute;
+ top: 35px;
+ left: 50%;
+ transform: translate(-50%, 0);
+ z-index: 99;
+ }
}
.line-row {
--
Gitblit v1.9.3