Skip to content

刘远 / 3d_dc

Go to a project
Toggle navigation
Toggle navigation pinning
40e47cbe by jikai
Options

111111

1 parent de8344c0
Expand all
Inline Side-by-side
Showing 6 changed files with 97 additions and 64 deletions
......@@ -6,9 +6,19 @@
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
<title><%= htmlWebpackPlugin.options.title %></title>
<script src="https://cesium.com/downloads/cesiumjs/releases/1.71/Build/Cesium/Cesium.js"></script>
<link href="https://cesium.com/downloads/cesiumjs/releases/1.71/Build/Cesium/Widgets/widgets.css"
rel="stylesheet">
<!-- <script src="https://cesium.com/downloads/cesiumjs/releases/1.71/Build/Cesium/Cesium.js"></script>
<link href="https://cesium.com/downloads/cesiumjs/releases/1.71/Build/Cesium/Widgets/widgets.css" rel="stylesheet"> -->
<link href="./Build/Cesium/Widgets/widgets.css" rel="stylesheet">
<!-- <link href="./css/bootstrap.min.css" rel="stylesheet"> -->
<link href="./css/pretty.css" rel="stylesheet">
<script type="text/javascript" src="./Build/Cesium/Cesium.js" data-main="js/main"></script>
<script type="text/javascript" src="./Build//Cesium/Widgets/CesiumNavigation/viewerCesiumNavigationMixin.js"></script>
<script type="text/javascript" src="./Build/Cesium/Workers/zlib.min.js" data-main="js/main"></script>
<script type="text/javascript" src="./js/jquery.min.js" data-main="js/main"></script>
<!-- <script src="./js/bootstrap.min.js"></script> -->
<script src="./js/spectrum.js"></script>
<script type="text/javascript" src="./js/supermap/SuperMap.Include.js"></script>
<script type="text/javascript" src="./js/require.min.js" data-main="js/main"></script>
</head>
<body>
<noscript>
......
export default
class Roller {
constructor(obj) {
this.imageryLayers = obj.imageryLayers;
this.imageryLayers.addImageryProvider(new Cesium.WebMapTileServiceImageryProvider({
url: obj.url,
layer: "tdtBasicLayer",
style: "default",
format: "image/jpeg",
tileMatrixSetID: "GoogleMapsCompatible",
show: false
})).splitDirection = Cesium.ImagerySplitDirection.LEFT;
constructor(viewer) {
let body = $('body');
this.initRollerShutter(viewer, {
splitDirection: new Cesium.Cartesian2(Cesium.ImagerySplitDirection.LEFT, Cesium.ImagerySplitDirection.NONE), // 初始时屏蔽左侧
verticalSplitPosition: body.width() / 2,
horizontalSplitPosition: body.height() / 2,
imageryLayers: [viewer.imageryLayers.addImageryProvider(new Cesium.BingMapsImageryProvider({
key : 'AqYgyS1gIIDGsxmOlncqrgA83cHnhClLwZmIJXbYXX36pfxKYtUGk12Q3splaf4Y',
url : '//dev.virtualearth.net'
}))], // 参与卷帘的影像图层数组
latestSplitDirection: null // 用于在禁用卷帘后恢复之前的卷帘方向
});
}
screen(opt) {
var slider = opt.slider, handler = new Cesium.ScreenSpaceEventHandler(slider), moveActive = false;
function move(movement) {
if (!moveActive) return;
var relativeOffset = movement.endPosition.x;
var splitPosition =
(slider.offsetLeft + relativeOffset) /
slider.parentElement.offsetWidth;
slider.style.left = 100.0 * splitPosition + "%";
opt.viewer.scene.imagerySplitPosition = splitPosition;
initRollerShutter(a, b) {
this.setRollerShutterSplit(a, b);
this.bindSliderEvt(a, b);
}
setRollerShutterSplit(viewer, rollerShutterConfig) {
let splitPosition = null, imageryLayer, body = $("body");
if (rollerShutterConfig.splitDirection.equals(new Cesium.Cartesian2(Cesium.ImagerySplitDirection.LEFT, Cesium.ImagerySplitDirection.NONE)) || rollerShutterConfig.splitDirection.equals(new Cesium.Cartesian2(Cesium.ImagerySplitDirection.RIGHT, Cesium.ImagerySplitDirection.NONE))) {
splitPosition = rollerShutterConfig.verticalSplitPosition;
} else if (rollerShutterConfig.splitDirection.equals(new Cesium.Cartesian2(Cesium.ImagerySplitDirection.NONE, Cesium.ImagerySplitDirection.TOP)) || rollerShutterConfig.splitDirection.equals(new Cesium.Cartesian2(Cesium.ImagerySplitDirection.NONE, Cesium.ImagerySplitDirection.BOTTOM))) {
splitPosition = rollerShutterConfig.horizontalSplitPosition;
}
for (imageryLayer of rollerShutterConfig.imageryLayers) {
imageryLayer.splitDirection = rollerShutterConfig.splitDirection;
}
if (splitPosition) { // 如果禁用卷帘就没有必要设置分割位置
if (rollerShutterConfig.splitDirection.equals(new Cesium.Cartesian2(Cesium.ImagerySplitDirection.LEFT, Cesium.ImagerySplitDirection.NONE)) || rollerShutterConfig.splitDirection.equals(new Cesium.Cartesian2(Cesium.ImagerySplitDirection.RIGHT, Cesium.ImagerySplitDirection.NONE))) {
viewer.scene.imagerySplitPosition.x = splitPosition / body.width();
} else if (rollerShutterConfig.splitDirection.equals(new Cesium.Cartesian2(Cesium.ImagerySplitDirection.NONE, Cesium.ImagerySplitDirection.TOP)) ||
rollerShutterConfig.splitDirection.equals(new Cesium.Cartesian2(Cesium.ImagerySplitDirection.NONE, Cesium.ImagerySplitDirection.BOTTOM))) {
viewer.scene.imagerySplitPosition.y = splitPosition / body.height();
}
}
}
bindSliderEvt(viewer, rollerShutterConfig) {
let verticalSlider = document.getElementById('vertical-slider'); // 垂直分割条
let horizontalSlider = document.getElementById('horizontal-slider'); // 水平分割条
verticalSlider.addEventListener('mousedown', mouseDown, false);
horizontalSlider.addEventListener('mousedown', mouseDown, false);
let windowHeight = $('body').height();
let sliderMove = e => { // 鼠标拖拽时执行
// 解决拖拽鼠标粘滞的问题
if (e.preventDefault) {
e.preventDefault();
} else {
e.returnValue = false;
}
if (rollerShutterConfig.splitDirection.equals(new Cesium.Cartesian2(Cesium.ImagerySplitDirection.LEFT, Cesium.ImagerySplitDirection.NONE)) || rollerShutterConfig.splitDirection.equals(new Cesium.Cartesian2(Cesium.ImagerySplitDirection.RIGHT, Cesium.ImagerySplitDirection.NONE))) {
verticalSlider.style.left = e.clientX + 'px';
rollerShutterConfig.verticalSplitPosition = e.clientX;
} else if (rollerShutterConfig.splitDirection.equals(new Cesium.Cartesian2(Cesium.ImagerySplitDirection.NONE, Cesium.ImagerySplitDirection.TOP)) || rollerShutterConfig.splitDirection.equals(new Cesium.Cartesian2(Cesium.ImagerySplitDirection.NONE, Cesium.ImagerySplitDirection.BOTTOM))) {
let clientY = e.clientY;
if (clientY < 0) {
clientY = 0;
} else if (clientY > windowHeight) {
clientY = windowHeight - $('#horizontal-slider').height();
}
horizontalSlider.style.top = clientY + 'px';
rollerShutterConfig.horizontalSplitPosition = windowHeight - clientY;
}
this.setRollerShutterSplit(viewer, rollerShutterConfig);
}
document.addEventListener('mouseup', mouseUp, false);
function mouseUp(e) {
document.removeEventListener('mousemove', sliderMove, false);
}
function mouseDown(e) {
document.addEventListener('mousemove', sliderMove, false);
}
handler.setInputAction(function () {
moveActive = true;
}, Cesium.ScreenSpaceEventType.LEFT_DOWN);
handler.setInputAction(function () {
moveActive = true;
}, Cesium.ScreenSpaceEventType.PINCH_START);
handler.setInputAction(move, Cesium.ScreenSpaceEventType.MOUSE_MOVE);
handler.setInputAction(move, Cesium.ScreenSpaceEventType.PINCH_MOVE);
handler.setInputAction(function () {
moveActive = false;
}, Cesium.ScreenSpaceEventType.LEFT_UP);
handler.setInputAction(function () {
moveActive = false;
}, Cesium.ScreenSpaceEventType.PINCH_END);
}
}
\ No newline at end of file
......
......@@ -55,6 +55,7 @@
},
startAnalysis() {
// this.isAnalysis = true;
this.$parent.viewpoint.chooseView();
},
stopAnalysis() {
// this.isAnalysis = false;
......
......@@ -74,8 +74,6 @@
sdgc: '', // 水底高程
swsd: '', // 水位深度
ymsd: '', // 淹没速度
isXmbj: true,
// isAnalysis: true
}
......@@ -90,12 +88,19 @@
},
startAnalysis() {
// this.isAnalysis = true;
let viewer = this.$parent.viewer;
this.$parent.flood.floodParse(viewer.scene, this.$parent.flood.positions2d, 0, 50);
this.$parent.flood.handlerPolygon.clear();
},
stopAnalysis() {
// this.isAnalysis = false;
// this.isAnalysis = false;
this.$parent.viewer.entities.removeAll();
// this.$parent.flood.handlerPolygon.clear();
},
handleIsXmbj(flag) {
this.isXmbj = flag;
this.$parent.flood.handlerPolygon.deactivate();
!flag && this.$parent.flood.handlerPolygon.activate();
}
}
}
......
......@@ -16,25 +16,7 @@
<el-date-picker v-model="anslysisTime" type="date" style="margin-left: 12px; width: 245px;"
placeholder="选择分析日期">
</el-date-picker>
</div>
<div class="func-input">
<div class="btn-wrapper2" :class="[isCF?'add-bg2': '']" @click="handleIsXmbj('isCF')">
<span class="center">春分</span>
</div>
<div class="btn-wrapper2" :class="[isXZ?'add-bg2': '']" @click="handleIsXmbj('isXZ')">
<span class="center">夏至</span>
</div>
<div class="btn-wrapper2" :class="[isQF?'add-bg2': '']" @click="handleIsXmbj('isQF')">
<span class="center">秋分</span>
</div>
<div class="btn-wrapper2" :class="[isLD?'add-bg2': '']" @click="handleIsXmbj('isLD')">
<span class="center">立冬</span>
</div>
<div class="btn-wrapper2" :class="[isDZ?'add-bg2': '']" @click="handleIsXmbj('isDZ')">
<span class="center">冬至</span>
</div>
</div>
</div>
<div class="func-input">
<span>时间间隔 </span>
......@@ -63,6 +45,7 @@
</template>
<script>
import shadow from "../assets/js/map/shadow";
let maxW = 24 * 60 * 60 * 1000 - 1 * 60 * 1000
export default {
name: 'yyAnslysis',
......@@ -92,13 +75,15 @@
}
}
},
mounted() {},
mounted() {
this.shadow instanceof shadow || (this.shadow = new shadow());
},
methods: {
closePop() {
this.$emit('closePop', 'yyAnslysis')
},
startAnalysis() {
console.log(this.shadow);
},
stopAnalysis() {
......