Skip to content

刘远 / 3d_dc

Go to a project
Toggle navigation
Toggle navigation pinning
d3b8532c by 焦小希
Options

Merge branch 'master' of http://yun.pashanhoo.com:9090/liuyuan/3d_dc

2 parents 4d5d3f41 386e0a84
Expand all
Inline Side-by-side
Showing 40 changed files with 273 additions and 174 deletions
This file is too large to display.
......@@ -11,6 +11,7 @@
"core-js": "^3.6.5",
"echarts": "^4.8.0",
"element-ui": "^2.13.2",
"esri-loader": "^2.15.0",
"vue": "^2.6.11",
"vue-router": "^3.2.0",
"vuex": "^3.4.0"
......
......@@ -18,7 +18,6 @@
<!-- <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>
......@@ -34,8 +33,8 @@
<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"> -->
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.js"></script>
</head>
......
......@@ -19,10 +19,7 @@
padding: 0px;
list-style: none;
}
.cesium-viewer-toolbar, .cesium-viewer-animationContainer, .cesium-viewer-bottom, .cesium-viewer-fullscreenContainer {
display: none !important;
}
</style>
......
......@@ -10,7 +10,7 @@ export default class createDraw {
}
distance() {
this.handlerDis.measureEvt.addEventListener(result => {
var dis = Number(result.distance), distance = dis > 1000 ? (dis / 1000).toFixed(2) + 'km' : dis.toFixed(2) + 'm';
var dis = Number(result.distance), distance = dis > 1000 ? (dis / 1000).toFixed(2) + 'km' : dis.toFixed(2) + 'm';
this.handlerDis.disLabel.text = '距离:' + distance;
});
this.handlerDis.activeEvt.addEventListener(this.handle());
......
import objectManage from './maputils';
export default class flood {
constructor(viewer) {
constructor() {
this.positions2d = [];
this.handlerPolygon = new Cesium.DrawHandler(viewer, Cesium.DrawMode.Polygon);
this.handlerPolygon = new Cesium.DrawHandler(objectManage.viewer, Cesium.DrawMode.Polygon);
this.handlerPolygon.drawEvt.addEventListener(polygon => {
var array = [].concat(polygon.object.positions), positions = [];
var array = [].concat(polygon.object.positions);
for(var i = 0, len = array.length; i < len; i++){
var cartographic = Cesium.Cartographic.fromCartesian(array[i]);
var longitude = Cesium.Math.toDegrees(cartographic.longitude);
var latitude = Cesium.Math.toDegrees(cartographic.latitude);
var h=cartographic.height;
if(positions.indexOf(longitude)===-1&&positions.indexOf(latitude)===-1){
positions.push(longitude);
positions.push(latitude);
positions.push(h);
this.positions2d.push(longitude);
this.positions2d.push(latitude);
this.positions2d.push(1000.0);
}
}
return positions;
this.positions2d.push(longitude);
this.positions2d.push(latitude);
this.positions2d.push(cartographic.height);
}
});
}
initHyp() {
......@@ -70,11 +64,19 @@ export default class flood {
}
});
}
floodParse(scene, positions2d, waterHeight, targetHeight) {
var River1 = new Cesium.Primitive({
floodParse(waterHeight, targetHeight) {
!this.positions2d.length && (this.positions2d = [
116.44391163897568, 39.922128887755996, 10,
116.47222524452756, 39.921663337343915, 10,
116.47147655687662, 39.903608069115315, 10,
116.44520545789665, 39.902556426686864, 10,
116.44515353439972, 39.90683243165845, 10,
116.4437677267605, 39.9069642145195, 10
]);
this.river = new Cesium.Primitive({
geometryInstances : new Cesium.GeometryInstance({
geometry :new Cesium.PolygonGeometry({
polygonHierarchy : new Cesium.PolygonHierarchy(Cesium.Cartesian3.fromDegreesArrayHeights(positions2d)),
polygonHierarchy : new Cesium.PolygonHierarchy(Cesium.Cartesian3.fromDegreesArrayHeights(this.positions2d)),
extrudedHeight: targetHeight,
height: waterHeight,
vertexFormat : Cesium.EllipsoidSurfaceAppearance.VERTEX_FORMAT
......@@ -96,6 +98,10 @@ export default class flood {
}),
show : true
});
scene.primitives.add(River1);
objectManage.viewer.scene.primitives.add(this.river);
}
remove() {
this.positions2d = [];
objectManage.viewer.scene.primitives.remove(this.river);
}
}
\ No newline at end of file
......
import objectManage from './maputils';
export default class heightControl {
constructor(opt) {
this.handlerPolygon = new Cesium.DrawHandler(objectManage.viewer, Cesium.DrawMode.Polygon);
this.building = objectManage.viewer.scene.layers.find("build1");
this.building1 = objectManage.viewer.scene.layers.find("build2");
this.arr = [];
var i = 0;
while(i < 2000) this.arr.push(i++);
this.handlerPolygon.drawEvt.addEventListener(result => {
var array = [].concat(result.object.positions), positions = [];
var polygon = result.object;
if(!polygon) return;
polygon.show = false;
this.handlerPolygon.polyline.show = false;
for(var i = 0, len = array.length; i < len; i++){
var cartographic = Cesium.Cartographic.fromCartesian(array[i]);
var longitude = Cesium.Math.toDegrees(cartographic.longitude);
var latitude = Cesium.Math.toDegrees(cartographic.latitude);
if(positions.indexOf(longitude)===-1&&positions.indexOf(latitude)===-1){
positions.push(longitude);
positions.push(latitude);
}
}
this.addPolygon(Object.assign(opt, {p: positions}));
this.splice(opt.h);
});
}
addPolygon(opt) {
this.polygon = objectManage.viewer.entities.add({
id: 'polygonA',
polygon: {
hierarchy: Cesium.Cartesian3.fromDegreesArray(opt.p),
height: opt.h,
material: new Cesium.Color(1, 1, 0.20, 0.5),
outline: true,
outlineColor: Cesium.Color.RED
}
}).polygon;
}
splice(h) {
this.building.clipLineColor = Cesium.Color.WHITE.withAlpha(0.0);
this.building1.setObjsColor(this.arr, Cesium.Color.DARKORANGE.withAlpha(0.5));
this.building.setCustomClipBox({
dimensions: new Cesium.Cartesian3(5000, 5000, h * 2),
position: Cesium.Cartesian3.fromDegrees(116.44391163897568, 39.922128887755996, h / h - 1),
clipMode: "clip_behind_any_plane"
});
this.building1.setCustomClipBox({
dimensions: new Cesium.Cartesian3(5000, 5000, h * 2),
position: Cesium.Cartesian3.fromDegrees(116.44391163897568, 39.922128887755996, h / h - 1),
clipMode: "clip_behind_all_plane"
});
}
remove() {
objectManage.viewer.entities.removeAll();
}
}
\ No newline at end of file
import objectManage from './maputils';
export default class shadow {
constructor() {
this.points = [];
this.shadowQuery = new Cesium.ShadowQueryPoints(objectManage.viewer.scene);
this.shadowQuery.build();
this.setCurrentTime();
this.init();
}
setCurrentTime() {
objectManage.viewer.clock.currentTime = Cesium.JulianDate.fromDate(new Date());
let d = new Date();
d.setHours(20)
objectManage.viewer.clock.currentTime = Cesium.JulianDate.fromDate(d);
objectManage.viewer.clock.multiplier = 1;
objectManage.viewer.clock.shouldAnimate = true;
}
init() {
this.handlerPolygon = new Cesium.DrawHandler(objectManage.viewer, Cesium.DrawMode.Polygon, 0);
this.tooltip = this.createTooltip(document.body);
this.points = [];
this.handlerPolygon = new Cesium.DrawHandler(objectManage.viewer, Cesium.DrawMode.Polygon, 0);
this.handlerPolygon.activeEvt.addEventListener(a => {
let body = $('body').removeClass('measureCur');
a && body.addClass('measureCur');
......
import objectManage from './maputils';
export default class viewpoint {
constructor(viewer) {
this.viewer = viewer;
this.sightline = new Cesium.Sightline(viewer.scene);
constructor() {
this.sightline = new Cesium.Sightline(objectManage.viewer.scene);
this.sightline.couldRemove = false;
this.sightline.build();
this.handlerPoint = new Cesium.DrawHandler(viewer, Cesium.DrawMode.Point);
this.handlerPoint = new Cesium.DrawHandler(objectManage.viewer, Cesium.DrawMode.Point);
this.handlerPoint.drawEvt.addEventListener(result => {
var point = result.object;
point.show = false;
......@@ -14,9 +14,9 @@ export default class viewpoint {
var longitude = Cesium.Math.toDegrees(cartographic.longitude);
var latitude = Cesium.Math.toDegrees(cartographic.latitude);
var height = cartographic.height;
if(viewer.scene.viewFlag) {
if(objectManage.viewer.scene.viewFlag) {
this.sightline.viewPosition = [longitude, latitude, height];
viewer.scene.viewFlag = false;
objectManage.viewer.scene.viewFlag = false;
this.addPoint();
}else {
this.sightline.addTargetPoint({
......@@ -29,13 +29,19 @@ export default class viewpoint {
}
chooseView() {
if(this.handlerPoint.active) return;
this.viewer.scene.viewFlag = true;
this.viewer.entities.removeAll();
objectManage.viewer.scene.viewFlag = true;
objectManage.viewer.entities.removeAll();
this.sightline.removeAllTargetPoint();
this.handlerPoint.activate();
}
addPoint() {
this.viewer.scene.viewFlag = false;
objectManage.viewer.scene.viewFlag = false;
this.handlerPoint.activate();
}
remove() {
this.sightline.destroy();
this.sightline = new Cesium.Sightline(objectManage.viewer.scene);
this.sightline.couldRemove = false;
this.sightline.build();
}
}
\ No newline at end of file
......
import objectManage from './maputils';
export default class visual {
constructor(viewer) {
this.viewer = viewer;
viewer.scene.viewFlag = true;
this.pointHandler = new Cesium.DrawHandler(viewer, Cesium.DrawMode.Point);
this.viewshed3D = new Cesium.ViewShed3D(viewer.scene);
constructor() {
objectManage.viewer.scene.viewFlag = true;
this.pointHandler = new Cesium.DrawHandler(objectManage.viewer, Cesium.DrawMode.Point);
this.viewshed3D = new Cesium.ViewShed3D(objectManage.viewer.scene);
this.viewPosition;
this.viewModel = {
direction: 1.0,
......@@ -15,7 +15,7 @@ export default class visual {
invisibleAreaColor: '#ffffffff'
};
Cesium.knockout.track(this.viewModel);
this.init(viewer.scene);
this.init(objectManage.viewer.scene);
}
init(scene) {
this.handler = new Cesium.ScreenSpaceEventHandler(scene.canvas);
......@@ -49,29 +49,33 @@ export default class visual {
this.pointHandler.drawEvt.addEventListener(result => {
var point = result.object;
var position = point.position;
viewPosition = position;
this.viewPosition = position;
// 将获取的点的位置转化成经纬度
var cartographic = Cesium.Cartographic.fromCartesian(position);
var longitude = Cesium.Math.toDegrees(cartographic.longitude);
var latitude = Cesium.Math.toDegrees(cartographic.latitude);
var height = cartographic.height + 1.8;
point.position = Cesium.Cartesian3.fromDegrees(longitude, latitude, height);
if (this.viewer.scene.viewFlag) {
if (objectManage.viewer.scene.viewFlag) {
// 设置视口位置
this.viewshed3D.viewPosition = [longitude, latitude, height];
this.viewshed3D.build();
// 将标记置为false以激活鼠标移动回调里面的设置可视域操作
this.viewer.scene.viewFlag = false;
objectManage.viewer.scene.viewFlag = false;
}
});
}
chooseView() {
if (this.pointHandler.active) return;
//先清除之前的可视域分析
this.viewer.entities.removeAll();
objectManage.viewer.entities.removeAll();
this.viewshed3D.distance = 0.1;
this.viewer.scene.viewFlag = true;
objectManage.viewer.scene.viewFlag = true;
//激活绘制点类
this.pointHandler.activate();
}
remove() {
this.viewshed3D.destroy();
this.viewshed3D = new Cesium.ViewShed3D(objectManage.viewer.scene);
}
}
\ No newline at end of file
......
......@@ -35,6 +35,7 @@
</template>
<script>
import viewpoint from "../assets/js/map/viewpoint";
export default {
name: 'allSee',
components: {},
......@@ -45,7 +46,9 @@
// isAnalysis: true
}
},
mounted() {},
mounted() {
this.viewpoint instanceof viewpoint || (this.viewpoint = new viewpoint());
},
methods: {
closePop() {
this.$emit('closePop', 'allSee')
......@@ -54,11 +57,10 @@
},
startAnalysis() {
// this.isAnalysis = true;
this.$parent.viewpoint.chooseView();
this.viewpoint.chooseView();
},
stopAnalysis() {
// this.isAnalysis = false;
this.viewpoint.remove();
}
}
......
......@@ -12,29 +12,35 @@
<div style="margin-top: 10px; font-size: 14px;">方案对比</div>
</div>
</div>
<div @click="EKgfz()">
<div @click="EAddProject()">
<div>
<img src="../assets/一张图/新增项目.png" alt="">
<div style="margin-top: 10px; font-size: 14px;">新增项目</div>
</div>
</div>
<!-- <div @click="EKgfz()">
<div>
<img src="../assets/一张图/icon_方案审查_辅助审查_控高分析.png" alt="">
<div style="margin-top: 10px; font-size: 14px;">控高分析</div>
</div>
</div>
</div> -->
</div>
<div class="box">
<div @click="EGzfx()">
<!-- <div class="box"> -->
<!-- <div @click="EGzfx()">
<div>
<img src="../assets/一张图/icon_方案审查_辅助审查_光照分析.png" alt="">
<div style="margin-top: 10px; font-size: 14px;">光照分析</div>
</div>
</div>
</div> -->
<!-- css 占位 -->
<div style="visibility:hidden">
<!-- <div>
<div>
<img src="../assets/一张图/icon_方案审查_辅助审查_控高分析.png" alt="">
<div style="margin-top: 10px; font-size: 14px;">控高分析</div>
<img src="../assets/一张图/新增项目.png" alt="">
<div style="margin-top: 10px; font-size: 14px;">新增项目</div>
</div>
</div>
</div> -->
</div>
<!-- </div> -->
</div>
</div>
</template>
......@@ -76,6 +82,10 @@
EGzfx() {
this.$emit('EGzfx');
},
// 新增项目
EAddProject() {
this.$emit('EAddProject');
}
}
}
</script>
......
......@@ -6,12 +6,12 @@
</div>
</div>
<div class="mian">
<div class="title">
<div class="title-bt">
<span>控高分析</span>
<span @click="closePop" class="close">×</span>
</div>
<div class="" style="padding: 18px 24px 0px 24px;">
<el-slider v-model="height" :min='0' :max='1000' :format-tooltip="formatTooltip"
<el-slider v-model="height" :min='1' :max='1000' :format-tooltip="formatTooltip"
@change='EheightChange'></el-slider>
</div>
<div class="func-btn">
......@@ -24,62 +24,40 @@
<span>清除分析结果</span>
</div>
</div>
<div class="table-box" style="padding: 18px 24px 30px 24px;">
<el-table :data="tableData" :highlight-current-row='false' height="242" border style="width: 100%">
<el-table-column prop="name" label="名称" align='center'>
</el-table-column>
<el-table-column prop="height" label="高度(m)" align='center'>
</el-table-column>
<el-table-column prop="superelevation" label="超高度(m)" align='center'>
</el-table-column>
</el-table>
</div>
</div>
</div>
</template>
<script>
import heightControl from "../assets/js/map/heightControl";
export default {
name: 'kgAnalusis',
components: {},
data() {
return {
height: 320,
tableData: [{
name: '1号楼',
height: '34',
superelevation: '4'
}, {
name: '1号楼',
height: '34',
superelevation: '4'
}, {
name: '1号楼',
height: '34',
superelevation: '4'
}, {
name: '1号楼',
height: '34',
superelevation: '4'
},]
height: 100
}
},
mounted() {},
mounted() {
this.heightControl instanceof heightControl || (this.heightControl = new heightControl({h: this.height}));
},
methods: {
closePop() {
this.$emit('closePop', 'kgAnalusis')
},
startAnalysis() {
this.heightControl.handlerPolygon.deactivate();
this.heightControl.handlerPolygon.activate();
},
stopAnalysis() {
this.heightControl.remove();
},
formatTooltip(val) {
return val + '米';
},
EheightChange() {
this.heightControl.polygon.height = this.height;
this.heightControl.splice(this.height);
}
}
}
......@@ -132,7 +110,7 @@
}
.title {
.title-bt {
display: flex;
justify-content: space-between;
border-bottom: 1px solid rgba(255, 255, 255, 0.15);
......
......@@ -34,7 +34,7 @@
</div>
<div style="margin-top: 16px;">
<auxiliaryReview @EFadb='EFadb' @EKgfz='EKgfz' @EGzfx='EGzfx'></auxiliaryReview>
<auxiliaryReview @EFadb='EFadb' @EKgfz='EKgfz' @EGzfx='EGzfx' @EAddProject='EAddProject'></auxiliaryReview>
</div>
</div>
</template>
......@@ -84,6 +84,10 @@
EGzfx() {
this.$emit('EGzfx');
},
// 新增项目
EAddProject() {
this.$emit('EAddProject');
},
}
}
</script>
......@@ -118,5 +122,6 @@
.assert-list .name {
transform: translateX(56px);
line-height: 36px;
font-size: 16px;
}
</style>
\ No newline at end of file
......
......@@ -76,7 +76,7 @@
<!--淹没分析 -->
<div class="func-ico" :class="[ymAnslysis?'selected':'']" @click="handleymAnslysis('ymAnslysis')">
<el-tooltip class="item" effect="dark" content="淹没" placement="left">
<img src="../assets/一张图/icon_通视.png" alt="">
<img src="../assets/一张图/淹没分析.png" alt="">
</el-tooltip>
</div>
......@@ -84,28 +84,28 @@
<!--阴影分析 -->
<div class="func-ico" :class="[yyAnslysis?'selected':'']" @click="handleyyAnslysis('yyAnslysis')">
<el-tooltip class="item" effect="dark" content="阴影" placement="left">
<img src="../assets/一张图/icon_通视.png" alt="">
<img src="../assets/一张图/阴影分析.png" alt="">
</el-tooltip>
</div>
<!--控高分析 -->
<!-- <div class="func-ico" :class="[kgAnalusis?'selected':'']" @click="handlekgAnalusis('kgAnalusis')">
<div class="func-ico" :class="[kgAnalusis?'selected':'']" @click="handlekgAnalusis('kgAnalusis')">
<el-tooltip class="item" effect="dark" content="控高" placement="left">
<img src="../assets/一张图/icon_通视.png" alt="">
<img src="../assets/一张图/控高分析.png" alt="">
</el-tooltip>
</div> -->
</div>
<!--天际线分析 -->
<div class="func-ico" :class="[tjxAnslysis?'selected':'']" @click="handletjxAnslysis('tjxAnslysis')">
<!-- <div class="func-ico" :class="[tjxAnslysis?'selected':'']" @click="handletjxAnslysis('tjxAnslysis')">
<el-tooltip class="item" effect="dark" content="天际线" placement="left">
<img src="../assets/一张图/icon_通视.png" alt="">
</el-tooltip>
</div>
</div> -->
<!--可视域分析 -->
<div class="func-ico" :class="[visualField?'selected':'']" @click="handlevisualField('visualField')">
<el-tooltip class="item" effect="dark" content="可视域分析" placement="left">
<img src="../assets/一张图/icon_通视.png" alt="">
<img src="../assets/一张图/视域分析.png" alt="">
</el-tooltip>
</div>
......
......@@ -49,7 +49,8 @@
src: 'https://ss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=3820738330,1510784229&fm=26&gp=0.jpg'
}
},
mounted() {},
mounted() {
},
methods: {
closePop() {
this.$emit('closePop', 'tjxAnslysis')
......@@ -58,7 +59,7 @@
},
stopAnalysis() {
},
}
}
......
......@@ -20,44 +20,54 @@
</div>
<div class="func-input">
<span class="width-class">翻转</span>
<el-slider style="width: 150px;" v-model="flip" :min='0' :max='360' :step='1'></el-slider>
<el-input-number v-model="flip" controls-position="right"
style="width:100px; height:38px; margin-left: 12px;" :step='step' :min="0" :max="360">
<el-slider style="width: 150px;" v-model="pitch" :min='1' :max='90' :step='1'></el-slider>
<el-input-number v-model="pitch" controls-position="right"
style="width:100px; height:38px; margin-left: 12px;" :step='step' :min="1" :max="90">
</el-input-number>
<span style="margin-left: 12px;">度</span>
</div>
<div class="func-input">
<span class="width-class">距离</span>
<el-slider style="width: 150px;" v-model="distance" :min='0' :max='10000' :step='1'></el-slider>
<el-slider style="width: 150px;" v-model="distance" :min='1' :max='500' :step='1'></el-slider>
<el-input-number v-model="distance" controls-position="right"
style="width:100px; height:38px; margin-left: 12px;" :step='step' :min="0" :max="10000">
style="width:100px; height:38px; margin-left: 12px;" :step='step' :min="1" :max="500">
</el-input-number>
<span style="margin-left: 12px;">米</span>
</div>
<div class="func-input">
<span class="width-class">水平视场角</span>
<el-slider style="width: 150px;" v-model="level" :min='0' :max='360' :step='1'></el-slider>
<el-input-number v-model="level" controls-position="right"
style="width:100px; height:38px; margin-left: 12px;" :step='step' :min="0" :max="360">
<el-slider style="width: 150px;" v-model="horizontalFov" :min='1' :max='120' :step='1'></el-slider>
<el-input-number v-model="horizontalFov" controls-position="right"
style="width:100px; height:38px; margin-left: 12px;" :step='step' :min="1" :max="120">
</el-input-number>
<span style="margin-left: 12px;">度</span>
</div>
<div class="func-input">
<span class="width-class">垂直视场角</span>
<el-slider style="width: 150px;" v-model="vertical" :min='0' :max='360' :step='1'></el-slider>
<el-input-number v-model="vertical" controls-position="right"
style="width:100px; height:38px; margin-left: 12px;" :step='step' :min="0" :max="360">
<el-slider style="width: 150px;" v-model="verticalFov" :min='1' :max='90' :step='1'></el-slider>
<el-input-number v-model="verticalFov" controls-position="right"
style="width:100px; height:38px; margin-left: 12px;" :step='step' :min="1" :max="90">
</el-input-number>
<span style="margin-left: 12px;">度</span>
</div>
<div class="select-color">
<div class="block">
<div class="demonstration">可见区域颜色</div>
<el-color-picker v-model="yesColor"></el-color-picker>
<el-color-picker v-model="visibleAreaColor"></el-color-picker>
</div>
<div class="block">
<div class="demonstration">不可见区域颜色</div>
<el-color-picker v-model="noColor"></el-color-picker>
<el-color-picker v-model="hiddenAreaColor"></el-color-picker>
</div>
</div>
<div class="func-btn">
<div class="btn-wrapper add-bg" @click="startAnalysis">
<img style="width: 20px; height: 20px; margin: 0 5px 0 44px" src="../assets/icon_开始分析.png" alt="">
<span>开始绘制</span>
</div>
<div class="btn-wrapper" @click="stopAnalysis" style="margin-left: 30px;">
<img style="width: 20px; height: 20px;margin: 0 5px 0 26px" src="../assets/icon_清除分析结果.png" alt="">
<span>清除绘制结果</span>
</div>
</div>
</div>
......@@ -65,6 +75,7 @@
</template>
<script>
import visual from "../assets/js/map/visual";
export default {
name: 'allSee',
components: {},
......@@ -72,31 +83,51 @@
return {
step: 1,
num: 1,
direction: 180, // 方向
flip: 90, // 翻转
distance: 0, // 距离
level: 180, // 水平视场角
vertical: 180, // 垂直视场角
yesColor: 'red', // 可见区域颜色
noColor: 'rgba(255, 69, 0, 0.68)', // 不可见区域颜色
direction: 1, // 方向
pitch: 1, // 翻转
distance: 1, // 距离
horizontalFov: 1, // 水平视场角
verticalFov: 1, // 垂直视场角
visibleAreaColor: 'red', // 可见区域颜色
hiddenAreaColor: 'rgba(255, 69, 0, 0.68)', // 不可见区域颜色
isXmbj: true,
// isAnalysis: true
}
},
mounted() {},
watch: {
direction: function(a) {
this.visual.viewshed3D.direction = a;
},
pitch: function(a) {
this.visual.viewshed3D.pitch = a;
},
distance: function(a) {
this.visual.viewshed3D.distance = a;
},
horizontalFov: function(a) {
this.visual.viewshed3D.horizontalFov = a;
},
verticalFov: function(a) {
this.visual.viewshed3D.verticalFov = a;
},
visibleAreaColor: function(a) {
this.visual.viewshed3D.visibleAreaColor = Cesium.Color.fromCssColorString(a);
},
hiddenAreaColor: function(a) {
this.visual.viewshed3D.hiddenAreaColor = Cesium.Color.fromCssColorString(a);
}
},
mounted() {
this.visual instanceof visual || (this.visual = new visual());
},
methods: {
closePop() {
this.$emit('closePop', 'visualField')
},
handleChange() {
},
startAnalysis() {
// this.isAnalysis = true;
this.visual.chooseView();
},
stopAnalysis() {
// this.isAnalysis = false;
this.visual.remove();
},
handleIsXmbj(flag) {
this.isXmbj = flag;
......@@ -237,7 +268,7 @@
display: flex;
justify-content: space-around;
text-align: center;
padding: 30px 0px;
padding: 15px 0 0 0;
}
.demonstration {
......
......@@ -59,6 +59,8 @@
</template>
<script>
import flood from "../assets/js/map/flood";
import objectManage from '../assets/js/map/maputils';
export default {
name: 'allSee',
components: {},
......@@ -67,13 +69,15 @@
step: 0.01,
num: 1,
sdgc: '', // 水底高程
swsd: '', // 水位深度
swsd: 50, // 水位深度
ymsd: '', // 淹没速度
isXmbj: true,
// isAnalysis: true
}
},
mounted() {},
mounted() {
this.flood instanceof flood || (this.flood = new flood());
},
methods: {
closePop() {
this.$emit('closePop', 'ymAnslysis')
......@@ -82,20 +86,16 @@
},
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();
this.flood.floodParse(0, this.swsd);
this.flood.handlerPolygon.clear();
},
stopAnalysis() {
// this.isAnalysis = false;
this.$parent.viewer.entities.removeAll();
// this.$parent.flood.handlerPolygon.clear();
this.flood.remove();
},
handleIsXmbj(flag) {
this.isXmbj = flag;
this.$parent.flood.handlerPolygon.deactivate();
!flag && this.$parent.flood.handlerPolygon.activate();
this.flood.handlerPolygon.deactivate();
!flag && this.flood.handlerPolygon.activate();
}
}
}
......
......@@ -20,14 +20,14 @@
<div class="func-input">
<span>开始时间</span>
<el-time-picker style="margin:0 12px; width: 245px;" v-model="staTime"
:picker-options="pickerOptions" placeholder="选择开始时间">
<el-time-picker style="margin:0 12px; width: 245px;" v-model="staTime" :picker-options="pickerOptions"
placeholder="选择开始时间">
</el-time-picker>
</div>
<div class="func-input">
<span>结束时间</span>
<el-time-picker style="margin:0 12px; width: 245px;" v-model="endTime"
:picker-options="pickerOptions" placeholder="选择结束时间">
<el-time-picker style="margin:0 12px; width: 245px;" v-model="endTime" :picker-options="pickerOptions"
placeholder="选择结束时间">
</el-time-picker>
</div>
......@@ -63,12 +63,16 @@
<div class="func-btn">
<div class="btn-wrapper add-bg" @click="startAnalysis">
<img style="width: 20px; height: 20px; margin: 0 5px 0 44px" src="../assets/icon_开始分析.png" alt="">
<span>开始分析</span>
<img style="width: 20px; height: 20px; margin: 0 5px 0 26px" src="../assets/icon_开始分析.png" alt="">
<span>分析</span>
</div>
<div class="btn-wrapper add-bg" @click="sunshine" style="margin-left: 30px;">
<img style="width: 20px; height: 20px; margin: 0 5px 0 26px" src="../assets/icon_开始分析.png" alt="">
<span>日照</span>
</div>
<div class="btn-wrapper" @click="stopAnalysis" style="margin-left: 30px;">
<img style="width: 20px; height: 20px;margin: 0 5px 0 26px" src="../assets/icon_清除分析结果.png" alt="">
<span>清除分析结果</span>
<span>清除</span>
</div>
</div>
</div>
......@@ -77,17 +81,18 @@
<script>
let maxW = 24 * 60 * 60 * 1000 - 1 * 60 * 1000
import shadow from "../assets/js/map/shadow";
export default {
name: 'yyAnslysis',
components: {},
data() {
return {
isCF: true, // 春分
isXZ: false, // 夏至
isQF: false, // 秋分
isLD: false, // 立冬
isDZ: false, // 冬至
keepTqArr: ['isCF', 'isXZ', 'isQF', 'isLD', 'isDZ'],
// isCF: true, // 春分
// isXZ: false, // 夏至
// isQF: false, // 秋分
// isLD: false, // 立冬
// isDZ: false, // 冬至
// keepTqArr: ['isCF', 'isXZ', 'isQF', 'isLD', 'isDZ'],
anslysisTime: '',
timeS: 30, // 时间间隔
......@@ -103,7 +108,7 @@
// label: this.$createElement('strong', '50%')
// }
},
pickerOptions: { // 时间选择器 时间范围限制
pickerOptions: { // 时间选择器 时间范围限制
selectableRange: '00:00:00 - 23:59:59'
},
staTime: '', // 开始时间
......@@ -121,19 +126,15 @@
this.$emit('closePop', 'yyAnslysis')
},
startAnalysis() {
console.log(this.shadow);
this.shadow.handlerPolygon.deactivate();
this.shadow.handlerPolygon.activate();
},
sunshine() {
this.shadow.sunlight();
},
stopAnalysis() {
},
/**
* val 值分别对应
* isCF, // 春分
isXZ, // 夏至
isQF, // 秋分
isLD, // 立冬
isDZ, // 冬至
*/
handleIsXmbj(val) {
let self = this;
this.keepTqArr.forEach(ele => {
......@@ -177,7 +178,6 @@
.box {
background: rgba(4, 10, 10, 0.58);
box-shadow: 0px 4px 9px 0px rgba(0, 0, 0, 0.5);
/* filter: blur(10px); */
height: 100px;
position: absolute;
width: 100%;
......@@ -217,7 +217,6 @@
.func-input {
display: flex;
align-items: center;
/* justify-content: space-between; */
padding: 18px 24px 0px 24px;
font-size: 18px;
cursor: pointer;
......
......@@ -12,7 +12,6 @@ import 'element-ui/lib/theme-chalk/index.css';
Vue.use(ElementUI);
Vue.prototype.$echarts = echarts;
Vue.prototype.config = config;
Vue.prototype.commons = commons;
......