Merge branch 'master' of http://yun.pashanhoo.com:9090/liuyuan/3d_dc
Showing
40 changed files
with
837 additions
and
286 deletions
3d_dc.rar
0 → 100644
This file is too large to display.
| ... | @@ -11,6 +11,7 @@ | ... | @@ -11,6 +11,7 @@ |
| 11 | "core-js": "^3.6.5", | 11 | "core-js": "^3.6.5", |
| 12 | "echarts": "^4.8.0", | 12 | "echarts": "^4.8.0", |
| 13 | "element-ui": "^2.13.2", | 13 | "element-ui": "^2.13.2", |
| 14 | "esri-loader": "^2.15.0", | ||
| 14 | "vue": "^2.6.11", | 15 | "vue": "^2.6.11", |
| 15 | "vue-router": "^3.2.0", | 16 | "vue-router": "^3.2.0", |
| 16 | "vuex": "^3.4.0" | 17 | "vuex": "^3.4.0" | ... | ... |
| ... | @@ -18,7 +18,6 @@ | ... | @@ -18,7 +18,6 @@ |
| 18 | <!-- <script src="./js/bootstrap.min.js"></script> --> | 18 | <!-- <script src="./js/bootstrap.min.js"></script> --> |
| 19 | <script src="./js/spectrum.js"></script> | 19 | <script src="./js/spectrum.js"></script> |
| 20 | <script type="text/javascript" src="./js/supermap/SuperMap.Include.js"></script> | 20 | <script type="text/javascript" src="./js/supermap/SuperMap.Include.js"></script> |
| 21 | <script type="text/javascript" src="./js/require.min.js" data-main="js/main"></script> | ||
| 22 | </head> | 21 | </head> |
| 23 | <body> | 22 | <body> |
| 24 | <noscript> | 23 | <noscript> |
| ... | @@ -34,8 +33,8 @@ | ... | @@ -34,8 +33,8 @@ |
| 34 | <meta name="viewport" content="width=device-width,initial-scale=1.0"> | 33 | <meta name="viewport" content="width=device-width,initial-scale=1.0"> |
| 35 | <link rel="icon" href="<%= BASE_URL %>favicon.ico"> | 34 | <link rel="icon" href="<%= BASE_URL %>favicon.ico"> |
| 36 | <title><%= htmlWebpackPlugin.options.title %></title> | 35 | <title><%= htmlWebpackPlugin.options.title %></title> |
| 37 | <script src="https://cesium.com/downloads/cesiumjs/releases/1.71/Build/Cesium/Cesium.js"></script> | 36 | <!-- <script src="https://cesium.com/downloads/cesiumjs/releases/1.71/Build/Cesium/Cesium.js"></script> |
| 38 | <link href="https://cesium.com/downloads/cesiumjs/releases/1.71/Build/Cesium/Widgets/widgets.css" rel="stylesheet"> | 37 | <link href="https://cesium.com/downloads/cesiumjs/releases/1.71/Build/Cesium/Widgets/widgets.css" rel="stylesheet"> --> |
| 39 | 38 | ||
| 40 | <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.js"></script> | 39 | <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.js"></script> |
| 41 | </head> | 40 | </head> | ... | ... |
| ... | @@ -19,10 +19,7 @@ | ... | @@ -19,10 +19,7 @@ |
| 19 | padding: 0px; | 19 | padding: 0px; |
| 20 | list-style: none; | 20 | list-style: none; |
| 21 | } | 21 | } |
| 22 | |||
| 23 | .cesium-viewer-toolbar, .cesium-viewer-animationContainer, .cesium-viewer-bottom, .cesium-viewer-fullscreenContainer { | 22 | .cesium-viewer-toolbar, .cesium-viewer-animationContainer, .cesium-viewer-bottom, .cesium-viewer-fullscreenContainer { |
| 24 | display: none !important; | 23 | display: none !important; |
| 25 | } | 24 | } |
| 26 | |||
| 27 | |||
| 28 | </style> | 25 | </style> | ... | ... |
| 1 | import objectManage from './maputils'; | ||
| 1 | export default class flood { | 2 | export default class flood { |
| 2 | constructor(viewer) { | 3 | constructor() { |
| 3 | this.positions2d = []; | 4 | this.positions2d = []; |
| 4 | this.handlerPolygon = new Cesium.DrawHandler(viewer, Cesium.DrawMode.Polygon); | 5 | this.handlerPolygon = new Cesium.DrawHandler(objectManage.viewer, Cesium.DrawMode.Polygon); |
| 5 | this.handlerPolygon.drawEvt.addEventListener(polygon => { | 6 | this.handlerPolygon.drawEvt.addEventListener(polygon => { |
| 6 | var array = [].concat(polygon.object.positions), positions = []; | 7 | var array = [].concat(polygon.object.positions); |
| 7 | for(var i = 0, len = array.length; i < len; i++){ | 8 | for(var i = 0, len = array.length; i < len; i++){ |
| 8 | var cartographic = Cesium.Cartographic.fromCartesian(array[i]); | 9 | var cartographic = Cesium.Cartographic.fromCartesian(array[i]); |
| 9 | var longitude = Cesium.Math.toDegrees(cartographic.longitude); | 10 | var longitude = Cesium.Math.toDegrees(cartographic.longitude); |
| 10 | var latitude = Cesium.Math.toDegrees(cartographic.latitude); | 11 | var latitude = Cesium.Math.toDegrees(cartographic.latitude); |
| 11 | var h=cartographic.height; | ||
| 12 | if(positions.indexOf(longitude)===-1&&positions.indexOf(latitude)===-1){ | ||
| 13 | positions.push(longitude); | ||
| 14 | positions.push(latitude); | ||
| 15 | positions.push(h); | ||
| 16 | this.positions2d.push(longitude); | 12 | this.positions2d.push(longitude); |
| 17 | this.positions2d.push(latitude); | 13 | this.positions2d.push(latitude); |
| 18 | this.positions2d.push(1000.0); | 14 | this.positions2d.push(cartographic.height); |
| 19 | } | 15 | } |
| 20 | } | ||
| 21 | return positions; | ||
| 22 | }); | 16 | }); |
| 23 | } | 17 | } |
| 24 | initHyp() { | 18 | initHyp() { |
| ... | @@ -70,11 +64,19 @@ export default class flood { | ... | @@ -70,11 +64,19 @@ export default class flood { |
| 70 | } | 64 | } |
| 71 | }); | 65 | }); |
| 72 | } | 66 | } |
| 73 | floodParse(scene, positions2d, waterHeight, targetHeight) { | 67 | floodParse(waterHeight, targetHeight) { |
| 74 | var River1 = new Cesium.Primitive({ | 68 | !this.positions2d.length && (this.positions2d = [ |
| 69 | 116.44391163897568, 39.922128887755996, 10, | ||
| 70 | 116.47222524452756, 39.921663337343915, 10, | ||
| 71 | 116.47147655687662, 39.903608069115315, 10, | ||
| 72 | 116.44520545789665, 39.902556426686864, 10, | ||
| 73 | 116.44515353439972, 39.90683243165845, 10, | ||
| 74 | 116.4437677267605, 39.9069642145195, 10 | ||
| 75 | ]); | ||
| 76 | this.river = new Cesium.Primitive({ | ||
| 75 | geometryInstances : new Cesium.GeometryInstance({ | 77 | geometryInstances : new Cesium.GeometryInstance({ |
| 76 | geometry :new Cesium.PolygonGeometry({ | 78 | geometry :new Cesium.PolygonGeometry({ |
| 77 | polygonHierarchy : new Cesium.PolygonHierarchy(Cesium.Cartesian3.fromDegreesArrayHeights(positions2d)), | 79 | polygonHierarchy : new Cesium.PolygonHierarchy(Cesium.Cartesian3.fromDegreesArrayHeights(this.positions2d)), |
| 78 | extrudedHeight: targetHeight, | 80 | extrudedHeight: targetHeight, |
| 79 | height: waterHeight, | 81 | height: waterHeight, |
| 80 | vertexFormat : Cesium.EllipsoidSurfaceAppearance.VERTEX_FORMAT | 82 | vertexFormat : Cesium.EllipsoidSurfaceAppearance.VERTEX_FORMAT |
| ... | @@ -96,6 +98,10 @@ export default class flood { | ... | @@ -96,6 +98,10 @@ export default class flood { |
| 96 | }), | 98 | }), |
| 97 | show : true | 99 | show : true |
| 98 | }); | 100 | }); |
| 99 | scene.primitives.add(River1); | 101 | objectManage.viewer.scene.primitives.add(this.river); |
| 102 | } | ||
| 103 | remove() { | ||
| 104 | this.positions2d = []; | ||
| 105 | objectManage.viewer.scene.primitives.remove(this.river); | ||
| 100 | } | 106 | } |
| 101 | } | 107 | } |
| ... | \ No newline at end of file | ... | \ No newline at end of file | ... | ... |
src/assets/js/map/heightControl.js
0 → 100644
| 1 | import objectManage from './maputils'; | ||
| 2 | export default class heightControl { | ||
| 3 | constructor(opt) { | ||
| 4 | this.handlerPolygon = new Cesium.DrawHandler(objectManage.viewer, Cesium.DrawMode.Polygon); | ||
| 5 | this.building = objectManage.viewer.scene.layers.find("build1"); | ||
| 6 | this.building1 = objectManage.viewer.scene.layers.find("build2"); | ||
| 7 | this.arr = []; | ||
| 8 | var i = 0; | ||
| 9 | while(i < 2000) this.arr.push(i++); | ||
| 10 | this.handlerPolygon.drawEvt.addEventListener(result => { | ||
| 11 | var array = [].concat(result.object.positions), positions = []; | ||
| 12 | var polygon = result.object; | ||
| 13 | if(!polygon) return; | ||
| 14 | polygon.show = false; | ||
| 15 | this.handlerPolygon.polyline.show = false; | ||
| 16 | for(var i = 0, len = array.length; i < len; i++){ | ||
| 17 | var cartographic = Cesium.Cartographic.fromCartesian(array[i]); | ||
| 18 | var longitude = Cesium.Math.toDegrees(cartographic.longitude); | ||
| 19 | var latitude = Cesium.Math.toDegrees(cartographic.latitude); | ||
| 20 | if(positions.indexOf(longitude)===-1&&positions.indexOf(latitude)===-1){ | ||
| 21 | positions.push(longitude); | ||
| 22 | positions.push(latitude); | ||
| 23 | } | ||
| 24 | } | ||
| 25 | this.addPolygon(Object.assign(opt, {p: positions})); | ||
| 26 | this.splice(opt.h); | ||
| 27 | }); | ||
| 28 | } | ||
| 29 | addPolygon(opt) { | ||
| 30 | this.polygon = objectManage.viewer.entities.add({ | ||
| 31 | id: 'polygonA', | ||
| 32 | polygon: { | ||
| 33 | hierarchy: Cesium.Cartesian3.fromDegreesArray(opt.p), | ||
| 34 | height: opt.h, | ||
| 35 | material: new Cesium.Color(1, 1, 0.20, 0.5), | ||
| 36 | outline: true, | ||
| 37 | outlineColor: Cesium.Color.RED | ||
| 38 | } | ||
| 39 | }).polygon; | ||
| 40 | } | ||
| 41 | splice(h) { | ||
| 42 | this.building.clipLineColor = Cesium.Color.WHITE.withAlpha(0.0); | ||
| 43 | this.building1.setObjsColor(this.arr, Cesium.Color.DARKORANGE.withAlpha(0.5)); | ||
| 44 | this.building.setCustomClipBox({ | ||
| 45 | dimensions: new Cesium.Cartesian3(5000, 5000, h * 2), | ||
| 46 | position: Cesium.Cartesian3.fromDegrees(116.44391163897568, 39.922128887755996, h / h - 1), | ||
| 47 | clipMode: "clip_behind_any_plane" | ||
| 48 | }); | ||
| 49 | this.building1.setCustomClipBox({ | ||
| 50 | dimensions: new Cesium.Cartesian3(5000, 5000, h * 2), | ||
| 51 | position: Cesium.Cartesian3.fromDegrees(116.44391163897568, 39.922128887755996, h / h - 1), | ||
| 52 | clipMode: "clip_behind_all_plane" | ||
| 53 | }); | ||
| 54 | } | ||
| 55 | remove() { | ||
| 56 | objectManage.viewer.entities.removeAll(); | ||
| 57 | } | ||
| 58 | } | ||
| ... | \ No newline at end of file | ... | \ No newline at end of file |
| 1 | import objectManage from './maputils'; | 1 | import objectManage from './maputils'; |
| 2 | export default class shadow { | 2 | export default class shadow { |
| 3 | constructor() { | 3 | constructor() { |
| 4 | this.points = []; | ||
| 4 | this.shadowQuery = new Cesium.ShadowQueryPoints(objectManage.viewer.scene); | 5 | this.shadowQuery = new Cesium.ShadowQueryPoints(objectManage.viewer.scene); |
| 6 | this.shadowQuery.build(); | ||
| 5 | this.setCurrentTime(); | 7 | this.setCurrentTime(); |
| 6 | this.init(); | 8 | this.init(); |
| 7 | } | 9 | } |
| 8 | setCurrentTime() { | 10 | setCurrentTime() { |
| 9 | objectManage.viewer.clock.currentTime = Cesium.JulianDate.fromDate(new Date()); | 11 | let d = new Date(); |
| 12 | d.setHours(20) | ||
| 13 | objectManage.viewer.clock.currentTime = Cesium.JulianDate.fromDate(d); | ||
| 10 | objectManage.viewer.clock.multiplier = 1; | 14 | objectManage.viewer.clock.multiplier = 1; |
| 11 | objectManage.viewer.clock.shouldAnimate = true; | 15 | objectManage.viewer.clock.shouldAnimate = true; |
| 12 | } | 16 | } |
| 13 | init() { | 17 | init() { |
| 14 | this.handlerPolygon = new Cesium.DrawHandler(objectManage.viewer, Cesium.DrawMode.Polygon, 0); | ||
| 15 | this.tooltip = this.createTooltip(document.body); | 18 | this.tooltip = this.createTooltip(document.body); |
| 16 | this.points = []; | 19 | this.handlerPolygon = new Cesium.DrawHandler(objectManage.viewer, Cesium.DrawMode.Polygon, 0); |
| 17 | this.handlerPolygon.activeEvt.addEventListener(a => { | 20 | this.handlerPolygon.activeEvt.addEventListener(a => { |
| 18 | let body = $('body').removeClass('measureCur'); | 21 | let body = $('body').removeClass('measureCur'); |
| 19 | a && body.addClass('measureCur'); | 22 | a && body.addClass('measureCur'); | ... | ... |
| 1 | import objectManage from './maputils'; | ||
| 1 | export default class viewpoint { | 2 | export default class viewpoint { |
| 2 | constructor(viewer) { | 3 | constructor() { |
| 3 | this.viewer = viewer; | 4 | this.sightline = new Cesium.Sightline(objectManage.viewer.scene); |
| 4 | this.sightline = new Cesium.Sightline(viewer.scene); | ||
| 5 | this.sightline.couldRemove = false; | 5 | this.sightline.couldRemove = false; |
| 6 | this.sightline.build(); | 6 | this.sightline.build(); |
| 7 | this.handlerPoint = new Cesium.DrawHandler(viewer, Cesium.DrawMode.Point); | 7 | this.handlerPoint = new Cesium.DrawHandler(objectManage.viewer, Cesium.DrawMode.Point); |
| 8 | this.handlerPoint.drawEvt.addEventListener(result => { | 8 | this.handlerPoint.drawEvt.addEventListener(result => { |
| 9 | var point = result.object; | 9 | var point = result.object; |
| 10 | point.show = false; | 10 | point.show = false; |
| ... | @@ -14,9 +14,9 @@ export default class viewpoint { | ... | @@ -14,9 +14,9 @@ export default class viewpoint { |
| 14 | var longitude = Cesium.Math.toDegrees(cartographic.longitude); | 14 | var longitude = Cesium.Math.toDegrees(cartographic.longitude); |
| 15 | var latitude = Cesium.Math.toDegrees(cartographic.latitude); | 15 | var latitude = Cesium.Math.toDegrees(cartographic.latitude); |
| 16 | var height = cartographic.height; | 16 | var height = cartographic.height; |
| 17 | if(viewer.scene.viewFlag) { | 17 | if(objectManage.viewer.scene.viewFlag) { |
| 18 | this.sightline.viewPosition = [longitude, latitude, height]; | 18 | this.sightline.viewPosition = [longitude, latitude, height]; |
| 19 | viewer.scene.viewFlag = false; | 19 | objectManage.viewer.scene.viewFlag = false; |
| 20 | this.addPoint(); | 20 | this.addPoint(); |
| 21 | }else { | 21 | }else { |
| 22 | this.sightline.addTargetPoint({ | 22 | this.sightline.addTargetPoint({ |
| ... | @@ -29,13 +29,19 @@ export default class viewpoint { | ... | @@ -29,13 +29,19 @@ export default class viewpoint { |
| 29 | } | 29 | } |
| 30 | chooseView() { | 30 | chooseView() { |
| 31 | if(this.handlerPoint.active) return; | 31 | if(this.handlerPoint.active) return; |
| 32 | this.viewer.scene.viewFlag = true; | 32 | objectManage.viewer.scene.viewFlag = true; |
| 33 | this.viewer.entities.removeAll(); | 33 | objectManage.viewer.entities.removeAll(); |
| 34 | this.sightline.removeAllTargetPoint(); | 34 | this.sightline.removeAllTargetPoint(); |
| 35 | this.handlerPoint.activate(); | 35 | this.handlerPoint.activate(); |
| 36 | } | 36 | } |
| 37 | addPoint() { | 37 | addPoint() { |
| 38 | this.viewer.scene.viewFlag = false; | 38 | objectManage.viewer.scene.viewFlag = false; |
| 39 | this.handlerPoint.activate(); | 39 | this.handlerPoint.activate(); |
| 40 | } | 40 | } |
| 41 | remove() { | ||
| 42 | this.sightline.destroy(); | ||
| 43 | this.sightline = new Cesium.Sightline(objectManage.viewer.scene); | ||
| 44 | this.sightline.couldRemove = false; | ||
| 45 | this.sightline.build(); | ||
| 46 | } | ||
| 41 | } | 47 | } |
| ... | \ No newline at end of file | ... | \ No newline at end of file | ... | ... |
| 1 | import objectManage from './maputils'; | ||
| 1 | export default class visual { | 2 | export default class visual { |
| 2 | constructor(viewer) { | 3 | constructor() { |
| 3 | this.viewer = viewer; | 4 | objectManage.viewer.scene.viewFlag = true; |
| 4 | viewer.scene.viewFlag = true; | 5 | this.pointHandler = new Cesium.DrawHandler(objectManage.viewer, Cesium.DrawMode.Point); |
| 5 | this.pointHandler = new Cesium.DrawHandler(viewer, Cesium.DrawMode.Point); | 6 | this.viewshed3D = new Cesium.ViewShed3D(objectManage.viewer.scene); |
| 6 | this.viewshed3D = new Cesium.ViewShed3D(viewer.scene); | ||
| 7 | this.viewPosition; | 7 | this.viewPosition; |
| 8 | this.viewModel = { | 8 | this.viewModel = { |
| 9 | direction: 1.0, | 9 | direction: 1.0, |
| ... | @@ -15,7 +15,7 @@ export default class visual { | ... | @@ -15,7 +15,7 @@ export default class visual { |
| 15 | invisibleAreaColor: '#ffffffff' | 15 | invisibleAreaColor: '#ffffffff' |
| 16 | }; | 16 | }; |
| 17 | Cesium.knockout.track(this.viewModel); | 17 | Cesium.knockout.track(this.viewModel); |
| 18 | this.init(viewer.scene); | 18 | this.init(objectManage.viewer.scene); |
| 19 | } | 19 | } |
| 20 | init(scene) { | 20 | init(scene) { |
| 21 | this.handler = new Cesium.ScreenSpaceEventHandler(scene.canvas); | 21 | this.handler = new Cesium.ScreenSpaceEventHandler(scene.canvas); |
| ... | @@ -49,29 +49,33 @@ export default class visual { | ... | @@ -49,29 +49,33 @@ export default class visual { |
| 49 | this.pointHandler.drawEvt.addEventListener(result => { | 49 | this.pointHandler.drawEvt.addEventListener(result => { |
| 50 | var point = result.object; | 50 | var point = result.object; |
| 51 | var position = point.position; | 51 | var position = point.position; |
| 52 | viewPosition = position; | 52 | this.viewPosition = position; |
| 53 | // 将获取的点的位置转化成经纬度 | 53 | // 将获取的点的位置转化成经纬度 |
| 54 | var cartographic = Cesium.Cartographic.fromCartesian(position); | 54 | var cartographic = Cesium.Cartographic.fromCartesian(position); |
| 55 | var longitude = Cesium.Math.toDegrees(cartographic.longitude); | 55 | var longitude = Cesium.Math.toDegrees(cartographic.longitude); |
| 56 | var latitude = Cesium.Math.toDegrees(cartographic.latitude); | 56 | var latitude = Cesium.Math.toDegrees(cartographic.latitude); |
| 57 | var height = cartographic.height + 1.8; | 57 | var height = cartographic.height + 1.8; |
| 58 | point.position = Cesium.Cartesian3.fromDegrees(longitude, latitude, height); | 58 | point.position = Cesium.Cartesian3.fromDegrees(longitude, latitude, height); |
| 59 | if (this.viewer.scene.viewFlag) { | 59 | if (objectManage.viewer.scene.viewFlag) { |
| 60 | // 设置视口位置 | 60 | // 设置视口位置 |
| 61 | this.viewshed3D.viewPosition = [longitude, latitude, height]; | 61 | this.viewshed3D.viewPosition = [longitude, latitude, height]; |
| 62 | this.viewshed3D.build(); | 62 | this.viewshed3D.build(); |
| 63 | // 将标记置为false以激活鼠标移动回调里面的设置可视域操作 | 63 | // 将标记置为false以激活鼠标移动回调里面的设置可视域操作 |
| 64 | this.viewer.scene.viewFlag = false; | 64 | objectManage.viewer.scene.viewFlag = false; |
| 65 | } | 65 | } |
| 66 | }); | 66 | }); |
| 67 | } | 67 | } |
| 68 | chooseView() { | 68 | chooseView() { |
| 69 | if (this.pointHandler.active) return; | 69 | if (this.pointHandler.active) return; |
| 70 | //先清除之前的可视域分析 | 70 | //先清除之前的可视域分析 |
| 71 | this.viewer.entities.removeAll(); | 71 | objectManage.viewer.entities.removeAll(); |
| 72 | this.viewshed3D.distance = 0.1; | 72 | this.viewshed3D.distance = 0.1; |
| 73 | this.viewer.scene.viewFlag = true; | 73 | objectManage.viewer.scene.viewFlag = true; |
| 74 | //激活绘制点类 | 74 | //激活绘制点类 |
| 75 | this.pointHandler.activate(); | 75 | this.pointHandler.activate(); |
| 76 | } | 76 | } |
| 77 | remove() { | ||
| 78 | this.viewshed3D.destroy(); | ||
| 79 | this.viewshed3D = new Cesium.ViewShed3D(objectManage.viewer.scene); | ||
| 80 | } | ||
| 77 | } | 81 | } |
| ... | \ No newline at end of file | ... | \ No newline at end of file | ... | ... |
src/assets/一张图/doc.png
0 → 100644
854 Bytes
src/assets/一张图/doc@2x.png
0 → 100644
1.59 KB
src/assets/一张图/max.png
0 → 100644
828 Bytes
src/assets/一张图/max@2x.png
0 → 100644
1.57 KB
src/assets/一张图/xls.png
0 → 100644
802 Bytes
src/assets/一张图/xls@2x.png
0 → 100644
1.47 KB
src/assets/一张图/导入.png
0 → 100644
604 Bytes
src/assets/一张图/导入@2x.png
0 → 100644
1 KB
src/assets/一张图/控高分析.png
0 → 100644
416 Bytes
src/assets/一张图/控高分析@2x.png
0 → 100644
503 Bytes
src/assets/一张图/新增项目.png
0 → 100644
3.95 KB
src/assets/一张图/新增项目@2x.png
0 → 100644
12.5 KB
src/assets/一张图/淹没分析.png
0 → 100644
756 Bytes
src/assets/一张图/淹没分析@2x.png
0 → 100644
1.61 KB
src/assets/一张图/视域分析.png
0 → 100644
641 Bytes
src/assets/一张图/视域分析@2x.png
0 → 100644
1.13 KB
src/assets/一张图/阴影分析.png
0 → 100644
561 Bytes
src/assets/一张图/阴影分析@2x.png
0 → 100644
849 Bytes
src/components/addProjectMsg.vue
0 → 100644
| 1 | // 建设项目信息表 弹窗 | ||
| 2 | <template> | ||
| 3 | <div class="container"> | ||
| 4 | <div class="wrapper"> | ||
| 5 | <div class="box"> | ||
| 6 | </div> | ||
| 7 | </div> | ||
| 8 | <div class="mian"> | ||
| 9 | <div class="title-bt"> | ||
| 10 | <span>建设项目信息表</span> | ||
| 11 | <span @click="closePop" class="close">×</span> | ||
| 12 | </div> | ||
| 13 | <div class="main-box"> | ||
| 14 | <div class="basic-msg"> | ||
| 15 | <div class="title-basic"> | ||
| 16 | <div class="vertical-line"></div> | ||
| 17 | <span>基本信息</span> | ||
| 18 | </div> | ||
| 19 | </div> | ||
| 20 | <div class="project-detail"> | ||
| 21 | <div class="project"> | ||
| 22 | <span class="title-name title-line-1">*项目编号</span> | ||
| 23 | <el-input v-model="col1" placeholder="请输入项目编号" class="input-one"></el-input> | ||
| 24 | </div> | ||
| 25 | <div class="project"> | ||
| 26 | <span class="title-name title-line-2">*规划类型</span> | ||
| 27 | <el-input v-model="col2" placeholder="请输入规划类型" class="input-one"></el-input> | ||
| 28 | </div> | ||
| 29 | <div class="project"> | ||
| 30 | <span class="title-name title-line-3">*规划级别</span> | ||
| 31 | <el-input v-model="col3" placeholder="请输入规划级别" class="input-one"></el-input> | ||
| 32 | </div> | ||
| 33 | <div class="project"> | ||
| 34 | <span class="title-name title-line-4">*行政辖区</span> | ||
| 35 | <el-input v-model="col4" placeholder="请输入行政辖区" class="input-one"></el-input> | ||
| 36 | </div> | ||
| 37 | </div> | ||
| 38 | <div class="project-detail"> | ||
| 39 | <div class="project"> | ||
| 40 | <span class="title-name title-line-1">*规划名称</span> | ||
| 41 | <el-input v-model="col5" placeholder="请输入规划名称" class="input-two"></el-input> | ||
| 42 | </div> | ||
| 43 | <div class="project"> | ||
| 44 | <span class="title-name title-line-3">*规划范围</span> | ||
| 45 | <el-input v-model="col6" placeholder="请输入规划类型" class="input-two"></el-input> | ||
| 46 | </div> | ||
| 47 | </div> | ||
| 48 | <div class="project-detail"> | ||
| 49 | <div class="project"> | ||
| 50 | <span class="title-name title-line-1">*规划基准年</span> | ||
| 51 | <el-input v-model="col7" placeholder="请输入规划基准年" class="input-one"></el-input> | ||
| 52 | </div> | ||
| 53 | <div class="project"> | ||
| 54 | <span class="title-name title-line-2">*规划期限(年)</span> | ||
| 55 | <el-input v-model="col8" placeholder="请输入规划期限(年)" class="input-one"></el-input> | ||
| 56 | </div> | ||
| 57 | <div class="project"> | ||
| 58 | <span class="title-name title-line-3">*近期(年)</span> | ||
| 59 | <el-input v-model="col9" placeholder="请输入近期(年)" class="input-one"></el-input> | ||
| 60 | </div> | ||
| 61 | <div class="project"> | ||
| 62 | <span class="title-name title-line-4">*远期(年)</span> | ||
| 63 | <el-input v-model="col10" placeholder="请输入远期(年)" class="input-one"></el-input> | ||
| 64 | </div> | ||
| 65 | </div> | ||
| 66 | <div class="project-detail"> | ||
| 67 | <div class="project"> | ||
| 68 | <span class="title-name title-line-1">*总面积(平方公里)</span> | ||
| 69 | <el-input v-model="col8" placeholder="请输入总面积(平方公里)" class="input-one"></el-input> | ||
| 70 | </div> | ||
| 71 | <div class="project"> | ||
| 72 | <span class="title-name title-line-2">*规划基准年</span> | ||
| 73 | <el-input v-model="col9" placeholder="请输入规划基准年" class="input-one"></el-input> | ||
| 74 | </div> | ||
| 75 | <div class="project" style="visibility:hidden;"> | ||
| 76 | <span class="title-name title-line-3">*远期(年)</span> | ||
| 77 | <el-input v-model="col10" placeholder="请输入远期(年)" class="input-one"></el-input> | ||
| 78 | </div> | ||
| 79 | <div class="project" style="visibility:hidden;"> | ||
| 80 | <span class="title-name title-line-4">*远期(年)</span> | ||
| 81 | <el-input v-model="col10" placeholder="请输入远期(年)" class="input-one"></el-input> | ||
| 82 | </div> | ||
| 83 | </div> | ||
| 84 | <div class="basic-msg"> | ||
| 85 | <div class="title-basic"> | ||
| 86 | <div class="vertical-line"></div> | ||
| 87 | <span>设计方案查询</span> | ||
| 88 | <el-upload class="upload-demo" action="" :accept='accept' :show-file-list='false' | ||
| 89 | :before-upload="importantPrograme"> | ||
| 90 | <div class="import-programme"> | ||
| 91 | <img src="../assets/一张图/导入.png" alt="" | ||
| 92 | style="width: 18px; height: 19px; margin-right: 12px;"> | ||
| 93 | <span>导入方案</span> | ||
| 94 | </div> | ||
| 95 | </el-upload> | ||
| 96 | </div> | ||
| 97 | </div> | ||
| 98 | <div style="display: flex;"> | ||
| 99 | <div v-if='isimportan1' style="width: 49%; padding-bottom: 36px;"> | ||
| 100 | <div class="box-programe"> | ||
| 101 | <span class="de-programe">*设计方案一</span> | ||
| 102 | <div style="margin-left: 12px; cursor: pointer;"> | ||
| 103 | <el-tooltip class="item" effect="dark" content="科技路.doc" placement="top"> | ||
| 104 | <img src="../assets/一张图/doc@2x.png" alt="" | ||
| 105 | style="width: 19px; height: 26px; margin-right: 12px;"> </el-tooltip> | ||
| 106 | <el-tooltip class="item" effect="dark" content="科技路.xls" placement="top"> | ||
| 107 | <img src="../assets/一张图/xls@2x.png" alt="" | ||
| 108 | style="width: 19px; height: 26px; margin-right: 12px;"> | ||
| 109 | </el-tooltip> | ||
| 110 | <el-tooltip class="item" effect="dark" content="科技路.max" placement="top"> | ||
| 111 | <img src="../assets/一张图/max@2x.png" alt="" | ||
| 112 | style="width: 19px; height: 26px; margin-right: 12px;"> | ||
| 113 | </el-tooltip> | ||
| 114 | </div> | ||
| 115 | </div> | ||
| 116 | <div class="table-programe"> | ||
| 117 | <div class="table-box"> | ||
| 118 | <span class="fixed-width">项目编号</span> | ||
| 119 | <span class="fixed-width-2">/</span> | ||
| 120 | </div> | ||
| 121 | <div class="table-box"> | ||
| 122 | <span class="fixed-width">项目名称</span> | ||
| 123 | <span class="fixed-width-2">/</span> | ||
| 124 | </div> | ||
| 125 | <div class="table-box"> | ||
| 126 | <span class="fixed-width">项目地址</span> | ||
| 127 | <span class="fixed-width-2">科技四路以北、科技三路以北、经八路以东、绿带以东</span> | ||
| 128 | </div> | ||
| 129 | <div class="table-box"> | ||
| 130 | <span class="fixed-width">用地性质</span> | ||
| 131 | <span class="fixed-width-2">二类居住用地</span> | ||
| 132 | </div> | ||
| 133 | <div class="table-box"> | ||
| 134 | <span class="fixed-width">净用地面积</span> | ||
| 135 | <span class="fixed-width-2">2.36</span> | ||
| 136 | </div> | ||
| 137 | <div class="table-box"> | ||
| 138 | <span class="fixed-width">容积率</span> | ||
| 139 | <span class="fixed-width-2">≤3.8</span> | ||
| 140 | </div> | ||
| 141 | <div class="table-box"> | ||
| 142 | <span class="fixed-width">绿地率</span> | ||
| 143 | <span class="fixed-width-2">≥23</span> | ||
| 144 | </div> | ||
| 145 | <div class="table-box"> | ||
| 146 | <span class="fixed-width">建筑密度</span> | ||
| 147 | <span class="fixed-width-2">≤21</span> | ||
| 148 | </div> | ||
| 149 | <div class="table-box"> | ||
| 150 | <span class="fixed-width">建筑高度</span> | ||
| 151 | <span class="fixed-width-2">≤110</span> | ||
| 152 | </div> | ||
| 153 | </div> | ||
| 154 | </div> | ||
| 155 | <div v-if='isimportan2' style="width: 49%; padding-bottom: 36px;"> | ||
| 156 | <div class="box-programe"> | ||
| 157 | <span class="de-programe">*设计方案二</span> | ||
| 158 | <div style="margin-left: 12px; cursor: pointer;"> | ||
| 159 | <el-tooltip class="item" effect="dark" content="科技路.doc" placement="top"> | ||
| 160 | <img src="../assets/一张图/doc@2x.png" alt="" | ||
| 161 | style="width: 19px; height: 26px; margin-right: 12px;"> </el-tooltip> | ||
| 162 | <el-tooltip class="item" effect="dark" content="科技路.xls" placement="top"> | ||
| 163 | <img src="../assets/一张图/xls@2x.png" alt="" | ||
| 164 | style="width: 19px; height: 26px; margin-right: 12px;"> | ||
| 165 | </el-tooltip> | ||
| 166 | <el-tooltip class="item" effect="dark" content="科技路.max" placement="top"> | ||
| 167 | <img src="../assets/一张图/max@2x.png" alt="" | ||
| 168 | style="width: 19px; height: 26px; margin-right: 12px;"> | ||
| 169 | </el-tooltip> | ||
| 170 | </div> | ||
| 171 | </div> | ||
| 172 | <div class="table-programe"> | ||
| 173 | <div class="table-box"> | ||
| 174 | <span class="fixed-width">项目编号</span> | ||
| 175 | <span class="fixed-width-2">/</span> | ||
| 176 | </div> | ||
| 177 | <div class="table-box"> | ||
| 178 | <span class="fixed-width">项目名称</span> | ||
| 179 | <span class="fixed-width-2">/</span> | ||
| 180 | </div> | ||
| 181 | <div class="table-box"> | ||
| 182 | <span class="fixed-width">项目地址</span> | ||
| 183 | <span class="fixed-width-2">科技四路以南、科技五路以北、经十二路以东、皂河绿带以西</span> | ||
| 184 | </div> | ||
| 185 | <div class="table-box"> | ||
| 186 | <span class="fixed-width">用地性质</span> | ||
| 187 | <span class="fixed-width-2">二类居住用地</span> | ||
| 188 | </div> | ||
| 189 | <div class="table-box"> | ||
| 190 | <span class="fixed-width">净用地面积</span> | ||
| 191 | <span class="fixed-width-2">5.56</span> | ||
| 192 | </div> | ||
| 193 | <div class="table-box"> | ||
| 194 | <span class="fixed-width">容积率</span> | ||
| 195 | <span class="fixed-width-2">≤2.8</span> | ||
| 196 | </div> | ||
| 197 | <div class="table-box"> | ||
| 198 | <span class="fixed-width">绿地率</span> | ||
| 199 | <span class="fixed-width-2">≥35</span> | ||
| 200 | </div> | ||
| 201 | <div class="table-box"> | ||
| 202 | <span class="fixed-width">建筑密度</span> | ||
| 203 | <span class="fixed-width-2">≤25</span> | ||
| 204 | </div> | ||
| 205 | <div class="table-box"> | ||
| 206 | <span class="fixed-width">建筑高度</span> | ||
| 207 | <span class="fixed-width-2">≤120</span> | ||
| 208 | </div> | ||
| 209 | </div> | ||
| 210 | </div> | ||
| 211 | </div> | ||
| 212 | </div> | ||
| 213 | </div> | ||
| 214 | </div> | ||
| 215 | </template> | ||
| 216 | |||
| 217 | <script> | ||
| 218 | export default { | ||
| 219 | name: 'kgAnalusis', | ||
| 220 | components: {}, | ||
| 221 | data() { | ||
| 222 | return { | ||
| 223 | col1: '', | ||
| 224 | col2: '', | ||
| 225 | col3: '', | ||
| 226 | col4: '', | ||
| 227 | col5: '', | ||
| 228 | col6: '', | ||
| 229 | col7: '', | ||
| 230 | col8: '', | ||
| 231 | col9: '', | ||
| 232 | col10: '', | ||
| 233 | col11: '', | ||
| 234 | col12: '', | ||
| 235 | |||
| 236 | isimportan1: false, | ||
| 237 | isimportan2: false, | ||
| 238 | |||
| 239 | accept: '.zip', | ||
| 240 | } | ||
| 241 | }, | ||
| 242 | mounted() {}, | ||
| 243 | methods: { | ||
| 244 | closePop() { | ||
| 245 | this.$emit('closeAddProjectMsg') | ||
| 246 | }, | ||
| 247 | EheightChange() { | ||
| 248 | |||
| 249 | }, | ||
| 250 | importantPrograme(e) { | ||
| 251 | debugger | ||
| 252 | if (!this.isimportan1) { | ||
| 253 | this.isimportan1 = true; | ||
| 254 | } else { | ||
| 255 | this.isimportan2 = true; | ||
| 256 | } | ||
| 257 | } | ||
| 258 | } | ||
| 259 | } | ||
| 260 | </script> | ||
| 261 | |||
| 262 | <style scoped> | ||
| 263 | .container { | ||
| 264 | position: relative; | ||
| 265 | color: #fff; | ||
| 266 | font-size: 16px; | ||
| 267 | width: 1350px; | ||
| 268 | /* height: 750px; */ | ||
| 269 | } | ||
| 270 | |||
| 271 | .wrapper { | ||
| 272 | position: absolute; | ||
| 273 | width: 100%; | ||
| 274 | height: 100%; | ||
| 275 | z-index: 1; | ||
| 276 | border: 1px solid rgba(151, 151, 151, 0.73); | ||
| 277 | } | ||
| 278 | |||
| 279 | .box { | ||
| 280 | background: rgba(4, 10, 10, 0.73); | ||
| 281 | box-shadow: 0px 4px 9px 0px rgba(0, 0, 0, 0.5); | ||
| 282 | /* filter: blur(10px); */ | ||
| 283 | height: 100px; | ||
| 284 | position: absolute; | ||
| 285 | width: 100%; | ||
| 286 | height: 100%; | ||
| 287 | z-index: 1; | ||
| 288 | } | ||
| 289 | |||
| 290 | .mian { | ||
| 291 | position: relative; | ||
| 292 | width: 100%; | ||
| 293 | height: 100%; | ||
| 294 | z-index: 1000; | ||
| 295 | /* overflow-x: hidden; */ | ||
| 296 | } | ||
| 297 | |||
| 298 | .main-box { | ||
| 299 | max-height: 730px; | ||
| 300 | overflow-y: auto; | ||
| 301 | } | ||
| 302 | |||
| 303 | .title-bt { | ||
| 304 | display: flex; | ||
| 305 | justify-content: space-between; | ||
| 306 | border-bottom: 1px solid rgba(255, 255, 255, 0.15); | ||
| 307 | padding: 18px 24px; | ||
| 308 | font-size: 20px; | ||
| 309 | } | ||
| 310 | |||
| 311 | .func-input { | ||
| 312 | display: flex; | ||
| 313 | align-items: center; | ||
| 314 | /* justify-content: space-between; */ | ||
| 315 | padding: 18px 24px 0px 24px; | ||
| 316 | font-size: 18px; | ||
| 317 | cursor: pointer; | ||
| 318 | } | ||
| 319 | |||
| 320 | .func { | ||
| 321 | padding: 18px 24px; | ||
| 322 | } | ||
| 323 | |||
| 324 | |||
| 325 | |||
| 326 | .func-btn { | ||
| 327 | display: flex; | ||
| 328 | padding: 18px 24px 30px 24px; | ||
| 329 | align-items: center; | ||
| 330 | font-size: 18px; | ||
| 331 | cursor: pointer; | ||
| 332 | } | ||
| 333 | |||
| 334 | .title-basic { | ||
| 335 | display: flex; | ||
| 336 | align-items: center; | ||
| 337 | padding: 20px 31px; | ||
| 338 | font-size: 18px; | ||
| 339 | } | ||
| 340 | |||
| 341 | .vertical-line { | ||
| 342 | width: 4px; | ||
| 343 | height: 15px; | ||
| 344 | background: rgba(255, 255, 255, 1); | ||
| 345 | margin-right: 6px; | ||
| 346 | } | ||
| 347 | |||
| 348 | .input-one { | ||
| 349 | width: 180px; | ||
| 350 | height: 38px; | ||
| 351 | margin-left: 12px; | ||
| 352 | } | ||
| 353 | |||
| 354 | .input-two { | ||
| 355 | width: 508px; | ||
| 356 | height: 38px; | ||
| 357 | margin-left: 12px; | ||
| 358 | } | ||
| 359 | |||
| 360 | .project-detail { | ||
| 361 | display: flex; | ||
| 362 | justify-content: space-around; | ||
| 363 | } | ||
| 364 | |||
| 365 | .project { | ||
| 366 | margin-bottom: 24px; | ||
| 367 | } | ||
| 368 | |||
| 369 | .title-line-1 { | ||
| 370 | display: inline-block; | ||
| 371 | width: 140px; | ||
| 372 | text-align: right; | ||
| 373 | } | ||
| 374 | |||
| 375 | .title-line-2 { | ||
| 376 | display: inline-block; | ||
| 377 | width: 100px; | ||
| 378 | text-align: right; | ||
| 379 | } | ||
| 380 | |||
| 381 | .title-line-3 { | ||
| 382 | display: inline-block; | ||
| 383 | width: 100px; | ||
| 384 | text-align: right; | ||
| 385 | } | ||
| 386 | |||
| 387 | .title-line-4 { | ||
| 388 | display: inline-block; | ||
| 389 | width: 100px; | ||
| 390 | text-align: right; | ||
| 391 | } | ||
| 392 | |||
| 393 | .import-programme { | ||
| 394 | display: flex; | ||
| 395 | align-items: center; | ||
| 396 | cursor: pointer; | ||
| 397 | padding: 10px 38px; | ||
| 398 | border: 1px solid rgba(151, 151, 151, 0.58); | ||
| 399 | margin-left: 20px; | ||
| 400 | background: rgba(4, 10, 10, 0.58); | ||
| 401 | box-shadow: 0px 4px 9px 0px rgba(0, 0, 0, 0.5); | ||
| 402 | font-size: 18px; | ||
| 403 | } | ||
| 404 | |||
| 405 | .de-programe { | ||
| 406 | display: inline-block; | ||
| 407 | width: 156px; | ||
| 408 | font-size: 18px; | ||
| 409 | text-align: right; | ||
| 410 | } | ||
| 411 | |||
| 412 | .box-programe { | ||
| 413 | display: flex; | ||
| 414 | align-items: center; | ||
| 415 | } | ||
| 416 | |||
| 417 | .table-box { | ||
| 418 | padding: 10px 10px; | ||
| 419 | display: flex; | ||
| 420 | border: 1px solid #6D7278; | ||
| 421 | } | ||
| 422 | |||
| 423 | .fixed-width { | ||
| 424 | display: inline-block; | ||
| 425 | width: 100px; | ||
| 426 | text-align: right; | ||
| 427 | } | ||
| 428 | |||
| 429 | .fixed-width-2 { | ||
| 430 | display: inline-block; | ||
| 431 | width: 322px; | ||
| 432 | text-align: left; | ||
| 433 | margin-left: 52px; | ||
| 434 | } | ||
| 435 | |||
| 436 | .table-programe { | ||
| 437 | margin-left: 165px; | ||
| 438 | margin-top: 17px; | ||
| 439 | border: 1px solid rgba(151, 151, 151, 0.58); | ||
| 440 | font-size: 18px; | ||
| 441 | } | ||
| 442 | |||
| 443 | .close { | ||
| 444 | cursor: pointer; | ||
| 445 | } | ||
| 446 | |||
| 447 | >>>input::-webkit-input-placeholder { | ||
| 448 | font-size: 16px; | ||
| 449 | color: rgba(255, 255, 255, 0.78) !important; | ||
| 450 | } | ||
| 451 | |||
| 452 | >>>.el-input__inner { | ||
| 453 | background: rgba(4, 10, 10, 0.58) !important; | ||
| 454 | border: 1px solid rgba(242, 242, 242, 0.4); | ||
| 455 | color: #fff; | ||
| 456 | } | ||
| 457 | |||
| 458 | >>>.el-input__suffix { | ||
| 459 | color: #fff; | ||
| 460 | font-size: 17px; | ||
| 461 | } | ||
| 462 | |||
| 463 | >>>.el-input-number__increase, | ||
| 464 | >>>.el-input-number__decrease { | ||
| 465 | background: rgba(4, 10, 10, 0.58); | ||
| 466 | } | ||
| 467 | |||
| 468 | >>>.el-input-number.is-controls-right .el-input-number__decrease, | ||
| 469 | >>>.el-input-number__increase { | ||
| 470 | border-left: 1px solid rgba(4, 10, 10, 0.58); | ||
| 471 | } | ||
| 472 | |||
| 473 | >>>.el-icon-arrow-up:before, | ||
| 474 | >>>.el-icon-arrow-down:before { | ||
| 475 | color: #fff; | ||
| 476 | } | ||
| 477 | |||
| 478 | >>>.el-input-number.is-controls-right .el-input-number__increase { | ||
| 479 | border-bottom: 1px solid rgba(4, 10, 10, 0.58); | ||
| 480 | } | ||
| 481 | |||
| 482 | |||
| 483 | >>>.el-table th.is-leaf, | ||
| 484 | >>>.el-table { | ||
| 485 | background-color: transparent !important; | ||
| 486 | color: #fff; | ||
| 487 | } | ||
| 488 | |||
| 489 | >>>.el-table tr { | ||
| 490 | background-color: transparent !important; | ||
| 491 | } | ||
| 492 | |||
| 493 | >>>.el-slider__button { | ||
| 494 | background-color: #2FA5FF; | ||
| 495 | border: 2px solid #FFFFFF; | ||
| 496 | box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.20); | ||
| 497 | } | ||
| 498 | |||
| 499 | >>>.el-table__row td { | ||
| 500 | background: transparent !important; | ||
| 501 | } | ||
| 502 | </style> | ||
| ... | \ No newline at end of file | ... | \ No newline at end of file |
| ... | @@ -35,6 +35,7 @@ | ... | @@ -35,6 +35,7 @@ |
| 35 | </template> | 35 | </template> |
| 36 | 36 | ||
| 37 | <script> | 37 | <script> |
| 38 | import viewpoint from "../assets/js/map/viewpoint"; | ||
| 38 | export default { | 39 | export default { |
| 39 | name: 'allSee', | 40 | name: 'allSee', |
| 40 | components: {}, | 41 | components: {}, |
| ... | @@ -45,7 +46,9 @@ | ... | @@ -45,7 +46,9 @@ |
| 45 | // isAnalysis: true | 46 | // isAnalysis: true |
| 46 | } | 47 | } |
| 47 | }, | 48 | }, |
| 48 | mounted() {}, | 49 | mounted() { |
| 50 | this.viewpoint instanceof viewpoint || (this.viewpoint = new viewpoint()); | ||
| 51 | }, | ||
| 49 | methods: { | 52 | methods: { |
| 50 | closePop() { | 53 | closePop() { |
| 51 | this.$emit('closePop', 'allSee') | 54 | this.$emit('closePop', 'allSee') |
| ... | @@ -54,11 +57,10 @@ | ... | @@ -54,11 +57,10 @@ |
| 54 | 57 | ||
| 55 | }, | 58 | }, |
| 56 | startAnalysis() { | 59 | startAnalysis() { |
| 57 | // this.isAnalysis = true; | 60 | this.viewpoint.chooseView(); |
| 58 | this.$parent.viewpoint.chooseView(); | ||
| 59 | }, | 61 | }, |
| 60 | stopAnalysis() { | 62 | stopAnalysis() { |
| 61 | // this.isAnalysis = false; | 63 | this.viewpoint.remove(); |
| 62 | } | 64 | } |
| 63 | 65 | ||
| 64 | } | 66 | } | ... | ... |
| ... | @@ -12,29 +12,35 @@ | ... | @@ -12,29 +12,35 @@ |
| 12 | <div style="margin-top: 10px; font-size: 14px;">方案对比</div> | 12 | <div style="margin-top: 10px; font-size: 14px;">方案对比</div> |
| 13 | </div> | 13 | </div> |
| 14 | </div> | 14 | </div> |
| 15 | <div @click="EKgfz()"> | 15 | <div @click="EAddProject()"> |
| 16 | <div> | ||
| 17 | <img src="../assets/一张图/新增项目.png" alt=""> | ||
| 18 | <div style="margin-top: 10px; font-size: 14px;">新增项目</div> | ||
| 19 | </div> | ||
| 20 | </div> | ||
| 21 | <!-- <div @click="EKgfz()"> | ||
| 16 | <div> | 22 | <div> |
| 17 | <img src="../assets/一张图/icon_方案审查_辅助审查_控高分析.png" alt=""> | 23 | <img src="../assets/一张图/icon_方案审查_辅助审查_控高分析.png" alt=""> |
| 18 | <div style="margin-top: 10px; font-size: 14px;">控高分析</div> | 24 | <div style="margin-top: 10px; font-size: 14px;">控高分析</div> |
| 19 | </div> | 25 | </div> |
| 26 | </div> --> | ||
| 20 | </div> | 27 | </div> |
| 21 | </div> | 28 | <!-- <div class="box"> --> |
| 22 | <div class="box"> | 29 | <!-- <div @click="EGzfx()"> |
| 23 | <div @click="EGzfx()"> | ||
| 24 | <div> | 30 | <div> |
| 25 | <img src="../assets/一张图/icon_方案审查_辅助审查_光照分析.png" alt=""> | 31 | <img src="../assets/一张图/icon_方案审查_辅助审查_光照分析.png" alt=""> |
| 26 | <div style="margin-top: 10px; font-size: 14px;">光照分析</div> | 32 | <div style="margin-top: 10px; font-size: 14px;">光照分析</div> |
| 27 | </div> | 33 | </div> |
| 28 | </div> | 34 | </div> --> |
| 29 | <!-- css 占位 --> | 35 | <!-- css 占位 --> |
| 30 | <div style="visibility:hidden"> | 36 | <!-- <div> |
| 31 | <div> | 37 | <div> |
| 32 | <img src="../assets/一张图/icon_方案审查_辅助审查_控高分析.png" alt=""> | 38 | <img src="../assets/一张图/新增项目.png" alt=""> |
| 33 | <div style="margin-top: 10px; font-size: 14px;">控高分析</div> | 39 | <div style="margin-top: 10px; font-size: 14px;">新增项目</div> |
| 34 | </div> | ||
| 35 | </div> | 40 | </div> |
| 41 | </div> --> | ||
| 36 | 42 | ||
| 37 | </div> | 43 | <!-- </div> --> |
| 38 | </div> | 44 | </div> |
| 39 | </div> | 45 | </div> |
| 40 | </template> | 46 | </template> |
| ... | @@ -76,6 +82,10 @@ | ... | @@ -76,6 +82,10 @@ |
| 76 | EGzfx() { | 82 | EGzfx() { |
| 77 | this.$emit('EGzfx'); | 83 | this.$emit('EGzfx'); |
| 78 | }, | 84 | }, |
| 85 | // 新增项目 | ||
| 86 | EAddProject() { | ||
| 87 | this.$emit('EAddProject'); | ||
| 88 | } | ||
| 79 | } | 89 | } |
| 80 | } | 90 | } |
| 81 | </script> | 91 | </script> | ... | ... |
| ... | @@ -6,12 +6,12 @@ | ... | @@ -6,12 +6,12 @@ |
| 6 | </div> | 6 | </div> |
| 7 | </div> | 7 | </div> |
| 8 | <div class="mian"> | 8 | <div class="mian"> |
| 9 | <div class="title"> | 9 | <div class="title-bt"> |
| 10 | <span>控高分析</span> | 10 | <span>控高分析</span> |
| 11 | <span @click="closePop" class="close">×</span> | 11 | <span @click="closePop" class="close">×</span> |
| 12 | </div> | 12 | </div> |
| 13 | <div class="" style="padding: 18px 24px 0px 24px;"> | 13 | <div class="" style="padding: 18px 24px 0px 24px;"> |
| 14 | <el-slider v-model="height" :min='0' :max='1000' :format-tooltip="formatTooltip" | 14 | <el-slider v-model="height" :min='1' :max='1000' :format-tooltip="formatTooltip" |
| 15 | @change='EheightChange'></el-slider> | 15 | @change='EheightChange'></el-slider> |
| 16 | </div> | 16 | </div> |
| 17 | <div class="func-btn"> | 17 | <div class="func-btn"> |
| ... | @@ -24,62 +24,40 @@ | ... | @@ -24,62 +24,40 @@ |
| 24 | <span>清除分析结果</span> | 24 | <span>清除分析结果</span> |
| 25 | </div> | 25 | </div> |
| 26 | </div> | 26 | </div> |
| 27 | <div class="table-box" style="padding: 18px 24px 30px 24px;"> | ||
| 28 | <el-table :data="tableData" :highlight-current-row='false' height="242" border style="width: 100%"> | ||
| 29 | <el-table-column prop="name" label="名称" align='center'> | ||
| 30 | </el-table-column> | ||
| 31 | <el-table-column prop="height" label="高度(m)" align='center'> | ||
| 32 | </el-table-column> | ||
| 33 | <el-table-column prop="superelevation" label="超高度(m)" align='center'> | ||
| 34 | </el-table-column> | ||
| 35 | </el-table> | ||
| 36 | </div> | ||
| 37 | </div> | 27 | </div> |
| 38 | </div> | 28 | </div> |
| 39 | </template> | 29 | </template> |
| 40 | 30 | ||
| 41 | <script> | 31 | <script> |
| 32 | import heightControl from "../assets/js/map/heightControl"; | ||
| 42 | export default { | 33 | export default { |
| 43 | name: 'kgAnalusis', | 34 | name: 'kgAnalusis', |
| 44 | components: {}, | 35 | components: {}, |
| 45 | data() { | 36 | data() { |
| 46 | return { | 37 | return { |
| 47 | height: 320, | 38 | height: 100 |
| 48 | tableData: [{ | ||
| 49 | name: '1号楼', | ||
| 50 | height: '34', | ||
| 51 | superelevation: '4' | ||
| 52 | }, { | ||
| 53 | name: '1号楼', | ||
| 54 | height: '34', | ||
| 55 | superelevation: '4' | ||
| 56 | }, { | ||
| 57 | name: '1号楼', | ||
| 58 | height: '34', | ||
| 59 | superelevation: '4' | ||
| 60 | }, { | ||
| 61 | name: '1号楼', | ||
| 62 | height: '34', | ||
| 63 | superelevation: '4' | ||
| 64 | },] | ||
| 65 | } | 39 | } |
| 66 | }, | 40 | }, |
| 67 | mounted() {}, | 41 | mounted() { |
| 42 | this.heightControl instanceof heightControl || (this.heightControl = new heightControl({h: this.height})); | ||
| 43 | }, | ||
| 68 | methods: { | 44 | methods: { |
| 69 | closePop() { | 45 | closePop() { |
| 70 | this.$emit('closePop', 'kgAnalusis') | 46 | this.$emit('closePop', 'kgAnalusis') |
| 71 | }, | 47 | }, |
| 72 | startAnalysis() { | 48 | startAnalysis() { |
| 73 | 49 | this.heightControl.handlerPolygon.deactivate(); | |
| 50 | this.heightControl.handlerPolygon.activate(); | ||
| 74 | }, | 51 | }, |
| 75 | stopAnalysis() { | 52 | stopAnalysis() { |
| 76 | 53 | this.heightControl.remove(); | |
| 77 | }, | 54 | }, |
| 78 | formatTooltip(val) { | 55 | formatTooltip(val) { |
| 79 | return val + '米'; | 56 | return val + '米'; |
| 80 | }, | 57 | }, |
| 81 | EheightChange() { | 58 | EheightChange() { |
| 82 | 59 | this.heightControl.polygon.height = this.height; | |
| 60 | this.heightControl.splice(this.height); | ||
| 83 | } | 61 | } |
| 84 | } | 62 | } |
| 85 | } | 63 | } |
| ... | @@ -132,7 +110,7 @@ | ... | @@ -132,7 +110,7 @@ |
| 132 | } | 110 | } |
| 133 | 111 | ||
| 134 | 112 | ||
| 135 | .title { | 113 | .title-bt { |
| 136 | display: flex; | 114 | display: flex; |
| 137 | justify-content: space-between; | 115 | justify-content: space-between; |
| 138 | border-bottom: 1px solid rgba(255, 255, 255, 0.15); | 116 | border-bottom: 1px solid rgba(255, 255, 255, 0.15); | ... | ... |
| ... | @@ -34,7 +34,7 @@ | ... | @@ -34,7 +34,7 @@ |
| 34 | </div> | 34 | </div> |
| 35 | 35 | ||
| 36 | <div style="margin-top: 16px;"> | 36 | <div style="margin-top: 16px;"> |
| 37 | <auxiliaryReview @EFadb='EFadb' @EKgfz='EKgfz' @EGzfx='EGzfx'></auxiliaryReview> | 37 | <auxiliaryReview @EFadb='EFadb' @EKgfz='EKgfz' @EGzfx='EGzfx' @EAddProject='EAddProject'></auxiliaryReview> |
| 38 | </div> | 38 | </div> |
| 39 | </div> | 39 | </div> |
| 40 | </template> | 40 | </template> |
| ... | @@ -84,6 +84,10 @@ | ... | @@ -84,6 +84,10 @@ |
| 84 | EGzfx() { | 84 | EGzfx() { |
| 85 | this.$emit('EGzfx'); | 85 | this.$emit('EGzfx'); |
| 86 | }, | 86 | }, |
| 87 | // 新增项目 | ||
| 88 | EAddProject() { | ||
| 89 | this.$emit('EAddProject'); | ||
| 90 | }, | ||
| 87 | } | 91 | } |
| 88 | } | 92 | } |
| 89 | </script> | 93 | </script> |
| ... | @@ -118,5 +122,6 @@ | ... | @@ -118,5 +122,6 @@ |
| 118 | .assert-list .name { | 122 | .assert-list .name { |
| 119 | transform: translateX(56px); | 123 | transform: translateX(56px); |
| 120 | line-height: 36px; | 124 | line-height: 36px; |
| 125 | font-size: 16px; | ||
| 121 | } | 126 | } |
| 122 | </style> | 127 | </style> |
| ... | \ No newline at end of file | ... | \ No newline at end of file | ... | ... |
| ... | @@ -76,7 +76,7 @@ | ... | @@ -76,7 +76,7 @@ |
| 76 | <!--淹没分析 --> | 76 | <!--淹没分析 --> |
| 77 | <div class="func-ico" :class="[ymAnslysis?'selected':'']" @click="handleymAnslysis('ymAnslysis')"> | 77 | <div class="func-ico" :class="[ymAnslysis?'selected':'']" @click="handleymAnslysis('ymAnslysis')"> |
| 78 | <el-tooltip class="item" effect="dark" content="淹没" placement="left"> | 78 | <el-tooltip class="item" effect="dark" content="淹没" placement="left"> |
| 79 | <img src="../assets/一张图/icon_通视.png" alt=""> | 79 | <img src="../assets/一张图/淹没分析.png" alt=""> |
| 80 | </el-tooltip> | 80 | </el-tooltip> |
| 81 | </div> | 81 | </div> |
| 82 | 82 | ||
| ... | @@ -84,28 +84,28 @@ | ... | @@ -84,28 +84,28 @@ |
| 84 | <!--阴影分析 --> | 84 | <!--阴影分析 --> |
| 85 | <div class="func-ico" :class="[yyAnslysis?'selected':'']" @click="handleyyAnslysis('yyAnslysis')"> | 85 | <div class="func-ico" :class="[yyAnslysis?'selected':'']" @click="handleyyAnslysis('yyAnslysis')"> |
| 86 | <el-tooltip class="item" effect="dark" content="阴影" placement="left"> | 86 | <el-tooltip class="item" effect="dark" content="阴影" placement="left"> |
| 87 | <img src="../assets/一张图/icon_通视.png" alt=""> | 87 | <img src="../assets/一张图/阴影分析.png" alt=""> |
| 88 | </el-tooltip> | 88 | </el-tooltip> |
| 89 | </div> | 89 | </div> |
| 90 | <!--控高分析 --> | 90 | <!--控高分析 --> |
| 91 | <!-- <div class="func-ico" :class="[kgAnalusis?'selected':'']" @click="handlekgAnalusis('kgAnalusis')"> | 91 | <div class="func-ico" :class="[kgAnalusis?'selected':'']" @click="handlekgAnalusis('kgAnalusis')"> |
| 92 | 92 | ||
| 93 | <el-tooltip class="item" effect="dark" content="控高" placement="left"> | 93 | <el-tooltip class="item" effect="dark" content="控高" placement="left"> |
| 94 | <img src="../assets/一张图/icon_通视.png" alt=""> | 94 | <img src="../assets/一张图/控高分析.png" alt=""> |
| 95 | </el-tooltip> | 95 | </el-tooltip> |
| 96 | </div> --> | 96 | </div> |
| 97 | 97 | ||
| 98 | <!--天际线分析 --> | 98 | <!--天际线分析 --> |
| 99 | <div class="func-ico" :class="[tjxAnslysis?'selected':'']" @click="handletjxAnslysis('tjxAnslysis')"> | 99 | <!-- <div class="func-ico" :class="[tjxAnslysis?'selected':'']" @click="handletjxAnslysis('tjxAnslysis')"> |
| 100 | <el-tooltip class="item" effect="dark" content="天际线" placement="left"> | 100 | <el-tooltip class="item" effect="dark" content="天际线" placement="left"> |
| 101 | <img src="../assets/一张图/icon_通视.png" alt=""> | 101 | <img src="../assets/一张图/icon_通视.png" alt=""> |
| 102 | </el-tooltip> | 102 | </el-tooltip> |
| 103 | </div> | 103 | </div> --> |
| 104 | 104 | ||
| 105 | <!--可视域分析 --> | 105 | <!--可视域分析 --> |
| 106 | <div class="func-ico" :class="[visualField?'selected':'']" @click="handlevisualField('visualField')"> | 106 | <div class="func-ico" :class="[visualField?'selected':'']" @click="handlevisualField('visualField')"> |
| 107 | <el-tooltip class="item" effect="dark" content="可视域分析" placement="left"> | 107 | <el-tooltip class="item" effect="dark" content="可视域分析" placement="left"> |
| 108 | <img src="../assets/一张图/icon_通视.png" alt=""> | 108 | <img src="../assets/一张图/视域分析.png" alt=""> |
| 109 | </el-tooltip> | 109 | </el-tooltip> |
| 110 | </div> | 110 | </div> |
| 111 | 111 | ... | ... |
| ... | @@ -49,7 +49,8 @@ | ... | @@ -49,7 +49,8 @@ |
| 49 | src: 'https://ss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=3820738330,1510784229&fm=26&gp=0.jpg' | 49 | src: 'https://ss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=3820738330,1510784229&fm=26&gp=0.jpg' |
| 50 | } | 50 | } |
| 51 | }, | 51 | }, |
| 52 | mounted() {}, | 52 | mounted() { |
| 53 | }, | ||
| 53 | methods: { | 54 | methods: { |
| 54 | closePop() { | 55 | closePop() { |
| 55 | this.$emit('closePop', 'tjxAnslysis') | 56 | this.$emit('closePop', 'tjxAnslysis') | ... | ... |
| ... | @@ -20,44 +20,54 @@ | ... | @@ -20,44 +20,54 @@ |
| 20 | </div> | 20 | </div> |
| 21 | <div class="func-input"> | 21 | <div class="func-input"> |
| 22 | <span class="width-class">翻转</span> | 22 | <span class="width-class">翻转</span> |
| 23 | <el-slider style="width: 150px;" v-model="flip" :min='0' :max='360' :step='1'></el-slider> | 23 | <el-slider style="width: 150px;" v-model="pitch" :min='1' :max='90' :step='1'></el-slider> |
| 24 | <el-input-number v-model="flip" controls-position="right" | 24 | <el-input-number v-model="pitch" controls-position="right" |
| 25 | style="width:100px; height:38px; margin-left: 12px;" :step='step' :min="0" :max="360"> | 25 | style="width:100px; height:38px; margin-left: 12px;" :step='step' :min="1" :max="90"> |
| 26 | </el-input-number> | 26 | </el-input-number> |
| 27 | <span style="margin-left: 12px;">度</span> | 27 | <span style="margin-left: 12px;">度</span> |
| 28 | </div> | 28 | </div> |
| 29 | <div class="func-input"> | 29 | <div class="func-input"> |
| 30 | <span class="width-class">距离</span> | 30 | <span class="width-class">距离</span> |
| 31 | <el-slider style="width: 150px;" v-model="distance" :min='0' :max='10000' :step='1'></el-slider> | 31 | <el-slider style="width: 150px;" v-model="distance" :min='1' :max='500' :step='1'></el-slider> |
| 32 | <el-input-number v-model="distance" controls-position="right" | 32 | <el-input-number v-model="distance" controls-position="right" |
| 33 | style="width:100px; height:38px; margin-left: 12px;" :step='step' :min="0" :max="10000"> | 33 | style="width:100px; height:38px; margin-left: 12px;" :step='step' :min="1" :max="500"> |
| 34 | </el-input-number> | 34 | </el-input-number> |
| 35 | <span style="margin-left: 12px;">米</span> | 35 | <span style="margin-left: 12px;">米</span> |
| 36 | </div> | 36 | </div> |
| 37 | <div class="func-input"> | 37 | <div class="func-input"> |
| 38 | <span class="width-class">水平视场角</span> | 38 | <span class="width-class">水平视场角</span> |
| 39 | <el-slider style="width: 150px;" v-model="level" :min='0' :max='360' :step='1'></el-slider> | 39 | <el-slider style="width: 150px;" v-model="horizontalFov" :min='1' :max='120' :step='1'></el-slider> |
| 40 | <el-input-number v-model="level" controls-position="right" | 40 | <el-input-number v-model="horizontalFov" controls-position="right" |
| 41 | style="width:100px; height:38px; margin-left: 12px;" :step='step' :min="0" :max="360"> | 41 | style="width:100px; height:38px; margin-left: 12px;" :step='step' :min="1" :max="120"> |
| 42 | </el-input-number> | 42 | </el-input-number> |
| 43 | <span style="margin-left: 12px;">度</span> | 43 | <span style="margin-left: 12px;">度</span> |
| 44 | </div> | 44 | </div> |
| 45 | <div class="func-input"> | 45 | <div class="func-input"> |
| 46 | <span class="width-class">垂直视场角</span> | 46 | <span class="width-class">垂直视场角</span> |
| 47 | <el-slider style="width: 150px;" v-model="vertical" :min='0' :max='360' :step='1'></el-slider> | 47 | <el-slider style="width: 150px;" v-model="verticalFov" :min='1' :max='90' :step='1'></el-slider> |
| 48 | <el-input-number v-model="vertical" controls-position="right" | 48 | <el-input-number v-model="verticalFov" controls-position="right" |
| 49 | style="width:100px; height:38px; margin-left: 12px;" :step='step' :min="0" :max="360"> | 49 | style="width:100px; height:38px; margin-left: 12px;" :step='step' :min="1" :max="90"> |
| 50 | </el-input-number> | 50 | </el-input-number> |
| 51 | <span style="margin-left: 12px;">度</span> | 51 | <span style="margin-left: 12px;">度</span> |
| 52 | </div> | 52 | </div> |
| 53 | <div class="select-color"> | 53 | <div class="select-color"> |
| 54 | <div class="block"> | 54 | <div class="block"> |
| 55 | <div class="demonstration">可见区域颜色</div> | 55 | <div class="demonstration">可见区域颜色</div> |
| 56 | <el-color-picker v-model="yesColor"></el-color-picker> | 56 | <el-color-picker v-model="visibleAreaColor"></el-color-picker> |
| 57 | </div> | 57 | </div> |
| 58 | <div class="block"> | 58 | <div class="block"> |
| 59 | <div class="demonstration">不可见区域颜色</div> | 59 | <div class="demonstration">不可见区域颜色</div> |
| 60 | <el-color-picker v-model="noColor"></el-color-picker> | 60 | <el-color-picker v-model="hiddenAreaColor"></el-color-picker> |
| 61 | </div> | ||
| 62 | </div> | ||
| 63 | <div class="func-btn"> | ||
| 64 | <div class="btn-wrapper add-bg" @click="startAnalysis"> | ||
| 65 | <img style="width: 20px; height: 20px; margin: 0 5px 0 44px" src="../assets/icon_开始分析.png" alt=""> | ||
| 66 | <span>开始绘制</span> | ||
| 67 | </div> | ||
| 68 | <div class="btn-wrapper" @click="stopAnalysis" style="margin-left: 30px;"> | ||
| 69 | <img style="width: 20px; height: 20px;margin: 0 5px 0 26px" src="../assets/icon_清除分析结果.png" alt=""> | ||
| 70 | <span>清除绘制结果</span> | ||
| 61 | </div> | 71 | </div> |
| 62 | </div> | 72 | </div> |
| 63 | </div> | 73 | </div> |
| ... | @@ -65,6 +75,7 @@ | ... | @@ -65,6 +75,7 @@ |
| 65 | </template> | 75 | </template> |
| 66 | 76 | ||
| 67 | <script> | 77 | <script> |
| 78 | import visual from "../assets/js/map/visual"; | ||
| 68 | export default { | 79 | export default { |
| 69 | name: 'allSee', | 80 | name: 'allSee', |
| 70 | components: {}, | 81 | components: {}, |
| ... | @@ -72,31 +83,51 @@ | ... | @@ -72,31 +83,51 @@ |
| 72 | return { | 83 | return { |
| 73 | step: 1, | 84 | step: 1, |
| 74 | num: 1, | 85 | num: 1, |
| 75 | direction: 180, // 方向 | 86 | direction: 1, // 方向 |
| 76 | flip: 90, // 翻转 | 87 | pitch: 1, // 翻转 |
| 77 | distance: 0, // 距离 | 88 | distance: 1, // 距离 |
| 78 | level: 180, // 水平视场角 | 89 | horizontalFov: 1, // 水平视场角 |
| 79 | vertical: 180, // 垂直视场角 | 90 | verticalFov: 1, // 垂直视场角 |
| 80 | yesColor: 'red', // 可见区域颜色 | 91 | visibleAreaColor: 'red', // 可见区域颜色 |
| 81 | noColor: 'rgba(255, 69, 0, 0.68)', // 不可见区域颜色 | 92 | hiddenAreaColor: 'rgba(255, 69, 0, 0.68)', // 不可见区域颜色 |
| 82 | |||
| 83 | isXmbj: true, | 93 | isXmbj: true, |
| 84 | // isAnalysis: true | ||
| 85 | } | 94 | } |
| 86 | }, | 95 | }, |
| 87 | mounted() {}, | 96 | watch: { |
| 97 | direction: function(a) { | ||
| 98 | this.visual.viewshed3D.direction = a; | ||
| 99 | }, | ||
| 100 | pitch: function(a) { | ||
| 101 | this.visual.viewshed3D.pitch = a; | ||
| 102 | }, | ||
| 103 | distance: function(a) { | ||
| 104 | this.visual.viewshed3D.distance = a; | ||
| 105 | }, | ||
| 106 | horizontalFov: function(a) { | ||
| 107 | this.visual.viewshed3D.horizontalFov = a; | ||
| 108 | }, | ||
| 109 | verticalFov: function(a) { | ||
| 110 | this.visual.viewshed3D.verticalFov = a; | ||
| 111 | }, | ||
| 112 | visibleAreaColor: function(a) { | ||
| 113 | this.visual.viewshed3D.visibleAreaColor = Cesium.Color.fromCssColorString(a); | ||
| 114 | }, | ||
| 115 | hiddenAreaColor: function(a) { | ||
| 116 | this.visual.viewshed3D.hiddenAreaColor = Cesium.Color.fromCssColorString(a); | ||
| 117 | } | ||
| 118 | }, | ||
| 119 | mounted() { | ||
| 120 | this.visual instanceof visual || (this.visual = new visual()); | ||
| 121 | }, | ||
| 88 | methods: { | 122 | methods: { |
| 89 | closePop() { | 123 | closePop() { |
| 90 | this.$emit('closePop', 'visualField') | 124 | this.$emit('closePop', 'visualField') |
| 91 | }, | 125 | }, |
| 92 | handleChange() { | ||
| 93 | |||
| 94 | }, | ||
| 95 | startAnalysis() { | 126 | startAnalysis() { |
| 96 | // this.isAnalysis = true; | 127 | this.visual.chooseView(); |
| 97 | }, | 128 | }, |
| 98 | stopAnalysis() { | 129 | stopAnalysis() { |
| 99 | // this.isAnalysis = false; | 130 | this.visual.remove(); |
| 100 | }, | 131 | }, |
| 101 | handleIsXmbj(flag) { | 132 | handleIsXmbj(flag) { |
| 102 | this.isXmbj = flag; | 133 | this.isXmbj = flag; |
| ... | @@ -237,7 +268,7 @@ | ... | @@ -237,7 +268,7 @@ |
| 237 | display: flex; | 268 | display: flex; |
| 238 | justify-content: space-around; | 269 | justify-content: space-around; |
| 239 | text-align: center; | 270 | text-align: center; |
| 240 | padding: 30px 0px; | 271 | padding: 15px 0 0 0; |
| 241 | } | 272 | } |
| 242 | 273 | ||
| 243 | .demonstration { | 274 | .demonstration { | ... | ... |
| ... | @@ -59,6 +59,8 @@ | ... | @@ -59,6 +59,8 @@ |
| 59 | </template> | 59 | </template> |
| 60 | 60 | ||
| 61 | <script> | 61 | <script> |
| 62 | import flood from "../assets/js/map/flood"; | ||
| 63 | import objectManage from '../assets/js/map/maputils'; | ||
| 62 | export default { | 64 | export default { |
| 63 | name: 'allSee', | 65 | name: 'allSee', |
| 64 | components: {}, | 66 | components: {}, |
| ... | @@ -67,13 +69,15 @@ | ... | @@ -67,13 +69,15 @@ |
| 67 | step: 0.01, | 69 | step: 0.01, |
| 68 | num: 1, | 70 | num: 1, |
| 69 | sdgc: '', // 水底高程 | 71 | sdgc: '', // 水底高程 |
| 70 | swsd: '', // 水位深度 | 72 | swsd: 50, // 水位深度 |
| 71 | ymsd: '', // 淹没速度 | 73 | ymsd: '', // 淹没速度 |
| 72 | isXmbj: true, | 74 | isXmbj: true, |
| 73 | // isAnalysis: true | 75 | // isAnalysis: true |
| 74 | } | 76 | } |
| 75 | }, | 77 | }, |
| 76 | mounted() {}, | 78 | mounted() { |
| 79 | this.flood instanceof flood || (this.flood = new flood()); | ||
| 80 | }, | ||
| 77 | methods: { | 81 | methods: { |
| 78 | closePop() { | 82 | closePop() { |
| 79 | this.$emit('closePop', 'ymAnslysis') | 83 | this.$emit('closePop', 'ymAnslysis') |
| ... | @@ -82,20 +86,16 @@ | ... | @@ -82,20 +86,16 @@ |
| 82 | 86 | ||
| 83 | }, | 87 | }, |
| 84 | startAnalysis() { | 88 | startAnalysis() { |
| 85 | // this.isAnalysis = true; | 89 | this.flood.floodParse(0, this.swsd); |
| 86 | let viewer = this.$parent.viewer; | 90 | this.flood.handlerPolygon.clear(); |
| 87 | this.$parent.flood.floodParse(viewer.scene, this.$parent.flood.positions2d, 0, 50); | ||
| 88 | this.$parent.flood.handlerPolygon.clear(); | ||
| 89 | }, | 91 | }, |
| 90 | stopAnalysis() { | 92 | stopAnalysis() { |
| 91 | // this.isAnalysis = false; | 93 | this.flood.remove(); |
| 92 | this.$parent.viewer.entities.removeAll(); | ||
| 93 | // this.$parent.flood.handlerPolygon.clear(); | ||
| 94 | }, | 94 | }, |
| 95 | handleIsXmbj(flag) { | 95 | handleIsXmbj(flag) { |
| 96 | this.isXmbj = flag; | 96 | this.isXmbj = flag; |
| 97 | this.$parent.flood.handlerPolygon.deactivate(); | 97 | this.flood.handlerPolygon.deactivate(); |
| 98 | !flag && this.$parent.flood.handlerPolygon.activate(); | 98 | !flag && this.flood.handlerPolygon.activate(); |
| 99 | } | 99 | } |
| 100 | } | 100 | } |
| 101 | } | 101 | } | ... | ... |
| ... | @@ -20,14 +20,14 @@ | ... | @@ -20,14 +20,14 @@ |
| 20 | 20 | ||
| 21 | <div class="func-input"> | 21 | <div class="func-input"> |
| 22 | <span>开始时间</span> | 22 | <span>开始时间</span> |
| 23 | <el-time-picker style="margin:0 12px; width: 245px;" v-model="staTime" | 23 | <el-time-picker style="margin:0 12px; width: 245px;" v-model="staTime" :picker-options="pickerOptions" |
| 24 | :picker-options="pickerOptions" placeholder="选择开始时间"> | 24 | placeholder="选择开始时间"> |
| 25 | </el-time-picker> | 25 | </el-time-picker> |
| 26 | </div> | 26 | </div> |
| 27 | <div class="func-input"> | 27 | <div class="func-input"> |
| 28 | <span>结束时间</span> | 28 | <span>结束时间</span> |
| 29 | <el-time-picker style="margin:0 12px; width: 245px;" v-model="endTime" | 29 | <el-time-picker style="margin:0 12px; width: 245px;" v-model="endTime" :picker-options="pickerOptions" |
| 30 | :picker-options="pickerOptions" placeholder="选择结束时间"> | 30 | placeholder="选择结束时间"> |
| 31 | </el-time-picker> | 31 | </el-time-picker> |
| 32 | </div> | 32 | </div> |
| 33 | 33 | ||
| ... | @@ -63,12 +63,16 @@ | ... | @@ -63,12 +63,16 @@ |
| 63 | 63 | ||
| 64 | <div class="func-btn"> | 64 | <div class="func-btn"> |
| 65 | <div class="btn-wrapper add-bg" @click="startAnalysis"> | 65 | <div class="btn-wrapper add-bg" @click="startAnalysis"> |
| 66 | <img style="width: 20px; height: 20px; margin: 0 5px 0 44px" src="../assets/icon_开始分析.png" alt=""> | 66 | <img style="width: 20px; height: 20px; margin: 0 5px 0 26px" src="../assets/icon_开始分析.png" alt=""> |
| 67 | <span>开始分析</span> | 67 | <span>分析</span> |
| 68 | </div> | ||
| 69 | <div class="btn-wrapper add-bg" @click="sunshine" style="margin-left: 30px;"> | ||
| 70 | <img style="width: 20px; height: 20px; margin: 0 5px 0 26px" src="../assets/icon_开始分析.png" alt=""> | ||
| 71 | <span>日照</span> | ||
| 68 | </div> | 72 | </div> |
| 69 | <div class="btn-wrapper" @click="stopAnalysis" style="margin-left: 30px;"> | 73 | <div class="btn-wrapper" @click="stopAnalysis" style="margin-left: 30px;"> |
| 70 | <img style="width: 20px; height: 20px;margin: 0 5px 0 26px" src="../assets/icon_清除分析结果.png" alt=""> | 74 | <img style="width: 20px; height: 20px;margin: 0 5px 0 26px" src="../assets/icon_清除分析结果.png" alt=""> |
| 71 | <span>清除分析结果</span> | 75 | <span>清除</span> |
| 72 | </div> | 76 | </div> |
| 73 | </div> | 77 | </div> |
| 74 | </div> | 78 | </div> |
| ... | @@ -77,17 +81,18 @@ | ... | @@ -77,17 +81,18 @@ |
| 77 | 81 | ||
| 78 | <script> | 82 | <script> |
| 79 | let maxW = 24 * 60 * 60 * 1000 - 1 * 60 * 1000 | 83 | let maxW = 24 * 60 * 60 * 1000 - 1 * 60 * 1000 |
| 84 | import shadow from "../assets/js/map/shadow"; | ||
| 80 | export default { | 85 | export default { |
| 81 | name: 'yyAnslysis', | 86 | name: 'yyAnslysis', |
| 82 | components: {}, | 87 | components: {}, |
| 83 | data() { | 88 | data() { |
| 84 | return { | 89 | return { |
| 85 | isCF: true, // 春分 | 90 | // isCF: true, // 春分 |
| 86 | isXZ: false, // 夏至 | 91 | // isXZ: false, // 夏至 |
| 87 | isQF: false, // 秋分 | 92 | // isQF: false, // 秋分 |
| 88 | isLD: false, // 立冬 | 93 | // isLD: false, // 立冬 |
| 89 | isDZ: false, // 冬至 | 94 | // isDZ: false, // 冬至 |
| 90 | keepTqArr: ['isCF', 'isXZ', 'isQF', 'isLD', 'isDZ'], | 95 | // keepTqArr: ['isCF', 'isXZ', 'isQF', 'isLD', 'isDZ'], |
| 91 | 96 | ||
| 92 | anslysisTime: '', | 97 | anslysisTime: '', |
| 93 | timeS: 30, // 时间间隔 | 98 | timeS: 30, // 时间间隔 |
| ... | @@ -121,19 +126,15 @@ | ... | @@ -121,19 +126,15 @@ |
| 121 | this.$emit('closePop', 'yyAnslysis') | 126 | this.$emit('closePop', 'yyAnslysis') |
| 122 | }, | 127 | }, |
| 123 | startAnalysis() { | 128 | startAnalysis() { |
| 124 | console.log(this.shadow); | 129 | this.shadow.handlerPolygon.deactivate(); |
| 130 | this.shadow.handlerPolygon.activate(); | ||
| 131 | }, | ||
| 132 | sunshine() { | ||
| 133 | this.shadow.sunlight(); | ||
| 125 | }, | 134 | }, |
| 126 | stopAnalysis() { | 135 | stopAnalysis() { |
| 127 | 136 | ||
| 128 | }, | 137 | }, |
| 129 | /** | ||
| 130 | * val 值分别对应 | ||
| 131 | * isCF, // 春分 | ||
| 132 | isXZ, // 夏至 | ||
| 133 | isQF, // 秋分 | ||
| 134 | isLD, // 立冬 | ||
| 135 | isDZ, // 冬至 | ||
| 136 | */ | ||
| 137 | handleIsXmbj(val) { | 138 | handleIsXmbj(val) { |
| 138 | let self = this; | 139 | let self = this; |
| 139 | this.keepTqArr.forEach(ele => { | 140 | this.keepTqArr.forEach(ele => { |
| ... | @@ -177,7 +178,6 @@ | ... | @@ -177,7 +178,6 @@ |
| 177 | .box { | 178 | .box { |
| 178 | background: rgba(4, 10, 10, 0.58); | 179 | background: rgba(4, 10, 10, 0.58); |
| 179 | box-shadow: 0px 4px 9px 0px rgba(0, 0, 0, 0.5); | 180 | box-shadow: 0px 4px 9px 0px rgba(0, 0, 0, 0.5); |
| 180 | /* filter: blur(10px); */ | ||
| 181 | height: 100px; | 181 | height: 100px; |
| 182 | position: absolute; | 182 | position: absolute; |
| 183 | width: 100%; | 183 | width: 100%; |
| ... | @@ -217,7 +217,6 @@ | ... | @@ -217,7 +217,6 @@ |
| 217 | .func-input { | 217 | .func-input { |
| 218 | display: flex; | 218 | display: flex; |
| 219 | align-items: center; | 219 | align-items: center; |
| 220 | /* justify-content: space-between; */ | ||
| 221 | padding: 18px 24px 0px 24px; | 220 | padding: 18px 24px 0px 24px; |
| 222 | font-size: 18px; | 221 | font-size: 18px; |
| 223 | cursor: pointer; | 222 | cursor: pointer; | ... | ... |
| ... | @@ -12,7 +12,6 @@ import 'element-ui/lib/theme-chalk/index.css'; | ... | @@ -12,7 +12,6 @@ import 'element-ui/lib/theme-chalk/index.css'; |
| 12 | 12 | ||
| 13 | Vue.use(ElementUI); | 13 | Vue.use(ElementUI); |
| 14 | 14 | ||
| 15 | |||
| 16 | Vue.prototype.$echarts = echarts; | 15 | Vue.prototype.$echarts = echarts; |
| 17 | Vue.prototype.config = config; | 16 | Vue.prototype.config = config; |
| 18 | Vue.prototype.commons = commons; | 17 | Vue.prototype.commons = commons; | ... | ... |
| ... | @@ -25,12 +25,12 @@ | ... | @@ -25,12 +25,12 @@ |
| 25 | @roundSee='EroundSee' | 25 | @roundSee='EroundSee' |
| 26 | @horizon='Ehorizon' | 26 | @horizon='Ehorizon' |
| 27 | @allSee='EallSee' | 27 | @allSee='EallSee' |
| 28 | |||
| 29 | @ymAnslysis='EymAnslysis' | 28 | @ymAnslysis='EymAnslysis' |
| 30 | @tjxAnslysis='EtjxAnslysis' | 29 | @tjxAnslysis='EtjxAnslysis' |
| 31 | @visualField='EvisualField' | 30 | @visualField='EvisualField' |
| 32 | @yyAnslysis='EyyAnslysis' | 31 | @yyAnslysis='EyyAnslysis' |
| 33 | @kgAnalusis='EkgAnalusis' | 32 | @kgAnalusis='EkgAnalusis' |
| 33 | |||
| 34 | :enlarge='enlarge' | 34 | :enlarge='enlarge' |
| 35 | :narrow='narrow' | 35 | :narrow='narrow' |
| 36 | :coordinate='coordinate' | 36 | :coordinate='coordinate' |
| ... | @@ -53,9 +53,9 @@ | ... | @@ -53,9 +53,9 @@ |
| 53 | <div class="bottomNav"> | 53 | <div class="bottomNav"> |
| 54 | <bottomNav></bottomNav> | 54 | <bottomNav></bottomNav> |
| 55 | </div> | 55 | </div> |
| 56 | <!-- <div class="leftAssert"> | 56 | <div class="leftAssert"> |
| 57 | <leftAssert @EFadb='EFadb' @EKgfz='EKgfz' @EGzfx='EGzfx'></leftAssert> | 57 | <leftAssert @EFadb='EFadb' @EKgfz='EKgfz' @EGzfx='EGzfx' @EAddProject='EAddProject'></leftAssert> |
| 58 | </div> --> | 58 | </div> |
| 59 | <!-- <div class="mapPop"> | 59 | <!-- <div class="mapPop"> |
| 60 | <mapPop></mapPop> | 60 | <mapPop></mapPop> |
| 61 | </div> --> | 61 | </div> --> |
| ... | @@ -71,13 +71,12 @@ | ... | @@ -71,13 +71,12 @@ |
| 71 | <horizon @closePop='closePop'></horizon> | 71 | <horizon @closePop='closePop'></horizon> |
| 72 | </div> | 72 | </div> |
| 73 | 73 | ||
| 74 | <div class="allSee tjx-anslysis" v-if='tjxAnslysis'> | 74 | <div class="allSee" v-if='visualField'> |
| 75 | <tjxAnslysis @closePop='closePop'></tjxAnslysis> | 75 | <visualField @closePop='closePop'></visualField> |
| 76 | </div> | 76 | </div> |
| 77 | 77 | ||
| 78 | 78 | <div class="allSee" v-if='tjxAnslysis'> | |
| 79 | <div class="allSee tjx-anslysis" v-if='visualField'> | 79 | <tjxAnslysis @closePop='closePop'></tjxAnslysis> |
| 80 | <visualField @closePop='closePop'></visualField> | ||
| 81 | </div> | 80 | </div> |
| 82 | 81 | ||
| 83 | <div class="allSee" v-if='yyAnslysis'> | 82 | <div class="allSee" v-if='yyAnslysis'> |
| ... | @@ -88,13 +87,16 @@ | ... | @@ -88,13 +87,16 @@ |
| 88 | <kgAnalusis @closePop='closePop'></kgAnalusis> | 87 | <kgAnalusis @closePop='closePop'></kgAnalusis> |
| 89 | </div> | 88 | </div> |
| 90 | 89 | ||
| 90 | <div class="add-project-msg" v-if='addProjectMsg'> | ||
| 91 | <addProjectMsg @closeAddProjectMsg='EcloseAddProjectMsg'></addProjectMsg> | ||
| 92 | </div> | ||
| 93 | |||
| 94 | |||
| 91 | <div id="cesiumContainer"> | 95 | <div id="cesiumContainer"> |
| 92 | <div id="vertical-slider" style="display: none;"></div> | 96 | <div id="vertical-slider" style="display: none;"></div> |
| 93 | <div id="horizontal-slider" style="display: none;"></div> | 97 | <div id="horizontal-slider" style="display: none;"></div> |
| 94 | </div> | 98 | </div> |
| 95 | 99 | ||
| 96 | |||
| 97 | |||
| 98 | <!-- <div id="split_up" style="display: none;"></div> | 100 | <!-- <div id="split_up" style="display: none;"></div> |
| 99 | <div id="split_bottom" style="display: none;"></div> | 101 | <div id="split_bottom" style="display: none;"></div> |
| 100 | <div id="split_left" style="display: none;"></div> | 102 | <div id="split_left" style="display: none;"></div> |
| ... | @@ -127,16 +129,16 @@ | ... | @@ -127,16 +129,16 @@ |
| 127 | import objectManage from '../assets/js/map/maputils'; | 129 | import objectManage from '../assets/js/map/maputils'; |
| 128 | import createDraw from '../assets/js/map/createDraw'; | 130 | import createDraw from '../assets/js/map/createDraw'; |
| 129 | import roller from "../assets/js/map/roller"; | 131 | import roller from "../assets/js/map/roller"; |
| 130 | import flood from "../assets/js/map/flood"; | 132 | // import flood from "../assets/js/map/flood"; |
| 131 | import viewpoint from "../assets/js/map/viewpoint"; | 133 | // import viewpoint from "../assets/js/map/viewpoint"; |
| 132 | import visual from "../assets/js/map/visual"; | 134 | // import visual from "../assets/js/map/visual"; |
| 133 | 135 | ||
| 134 | 136 | ||
| 135 | import TopTitle from '../components/topTitle'; | 137 | import TopTitle from '../components/topTitle'; |
| 136 | import rightTopFunc from '../components/rightTopFunc'; | 138 | import rightTopFunc from '../components/rightTopFunc'; |
| 137 | import rightFunc from '../components/rightFunc'; | 139 | import rightFunc from '../components/rightFunc'; |
| 138 | import bottomNav from '../components/bottomNav'; | 140 | import bottomNav from '../components/bottomNav'; |
| 139 | // import leftAssert from '../components/leftAssert'; | 141 | import leftAssert from '../components/leftAssert'; |
| 140 | // import mapPop from '../components/mapPop'; | 142 | // import mapPop from '../components/mapPop'; |
| 141 | 143 | ||
| 142 | import allSee from '../components/allSee'; //通视 | 144 | import allSee from '../components/allSee'; //通视 |
| ... | @@ -145,9 +147,13 @@ | ... | @@ -145,9 +147,13 @@ |
| 145 | import tjxAnslysis from '../components/tjxAnslysis'; // 天际线分析 | 147 | import tjxAnslysis from '../components/tjxAnslysis'; // 天际线分析 |
| 146 | import yyAnslysis from '../components/yyAnslysis'; // 阴影分析 | 148 | import yyAnslysis from '../components/yyAnslysis'; // 阴影分析 |
| 147 | import kgAnalusis from '../components/kgAnalusis'; // 控高分析 | 149 | import kgAnalusis from '../components/kgAnalusis'; // 控高分析 |
| 150 | import visualField from '../components/visualField'; //可视域分析 | ||
| 151 | import addProjectMsg from '../components/addProjectMsg'; // 建设项目信息表 | ||
| 152 | |||
| 153 | |||
| 148 | import URL_CONFIG from "./../config/urlConfig.vue"; | 154 | import URL_CONFIG from "./../config/urlConfig.vue"; |
| 149 | const Cesium = window.Cesium; | 155 | const Cesium = window.Cesium; |
| 150 | import visualField from '../components/visualField' //可视域分析 | 156 | |
| 151 | 157 | ||
| 152 | export default { | 158 | export default { |
| 153 | components: { | 159 | components: { |
| ... | @@ -155,16 +161,18 @@ | ... | @@ -155,16 +161,18 @@ |
| 155 | rightTopFunc, | 161 | rightTopFunc, |
| 156 | rightFunc, | 162 | rightFunc, |
| 157 | bottomNav, | 163 | bottomNav, |
| 158 | // leftAssert, | 164 | leftAssert, |
| 159 | // mapPop, | 165 | // mapPop, |
| 160 | 166 | ||
| 161 | allSee, | 167 | allSee, |
| 162 | ymAnslysis, | 168 | ymAnslysis, |
| 163 | horizon, | 169 | horizon, |
| 164 | tjxAnslysis, | ||
| 165 | visualField, | 170 | visualField, |
| 171 | tjxAnslysis, | ||
| 166 | yyAnslysis, | 172 | yyAnslysis, |
| 167 | kgAnalusis, | 173 | kgAnalusis, |
| 174 | |||
| 175 | addProjectMsg, | ||
| 168 | }, | 176 | }, |
| 169 | data() { | 177 | data() { |
| 170 | return { | 178 | return { |
| ... | @@ -192,32 +200,46 @@ | ... | @@ -192,32 +200,46 @@ |
| 192 | keepArr: ['isReturn', 'enlarge', 'narrow', 'coordinate', 'distance', | 200 | keepArr: ['isReturn', 'enlarge', 'narrow', 'coordinate', 'distance', |
| 193 | 'area', 'marker', 'rollerShutter', 'splitScreen', 'toNorth', | 201 | 'area', 'marker', 'rollerShutter', 'splitScreen', 'toNorth', |
| 194 | 'topSee', 'roundSee', 'horizon', 'allSee', 'ymAnslysis', | 202 | 'topSee', 'roundSee', 'horizon', 'allSee', 'ymAnslysis', |
| 195 | 'tjxAnslysis', 'yyAnslysis', 'kgAnalusis', 'visualField'] | 203 | 'tjxAnslysis', 'yyAnslysis', 'visualField', 'kgAnalusis'], |
| 204 | |||
| 205 | addProjectMsg: false, // 建设项目信息表 | ||
| 196 | } | 206 | } |
| 197 | }, | 207 | }, |
| 198 | mounted() { | 208 | mounted() { |
| 199 | this.viewer = new Cesium.Viewer('cesiumContainer'); | 209 | this.viewer = new Cesium.Viewer('cesiumContainer', {shadows : true}); |
| 200 | this.viewer.imageryLayers.addImageryProvider(new Cesium.TiandituImageryProvider({ | 210 | this.viewer.imageryLayers.addImageryProvider(new Cesium.TiandituImageryProvider({ |
| 201 | credit : new Cesium.Credit('天地图全球影像服务'), | 211 | credit : new Cesium.Credit('天地图全球影像服务'), |
| 202 | token: URL_CONFIG.TOKEN_TIANDITU | 212 | token: URL_CONFIG.TOKEN_TIANDITU |
| 203 | })); | 213 | })); |
| 204 | let scene = this.viewer.scene | 214 | let scene = this.viewer.scene |
| 205 | scene.shadowMap.darkness = 1.275; //设置第二重烘焙纹理的效果(明暗程度) | 215 | scene.shadowMap.darkness = 1; //设置第二重烘焙纹理的效果(明暗程度) |
| 206 | scene.skyAtmosphere.brightnessShift=0.4; | 216 | scene.skyAtmosphere.brightnessShift=0.4; |
| 207 | scene.debugShowFramesPerSecond = true; | 217 | scene.debugShowFramesPerSecond = true; |
| 208 | scene.hdrEnabled = false; | 218 | scene.hdrEnabled = false; |
| 209 | scene.sun.show = false; | 219 | scene.sun.show = true; |
| 210 | this.draw = new createDraw(this.viewer); | 220 | this.draw = new createDraw(this.viewer); |
| 211 | Cesium.when.all([ | 221 | |
| 212 | scene.addS3MTilesLayerByScp(URL_CONFIG.SCP_CBD_GROUND1, { | 222 | var promise = []; |
| 223 | // promise[0] = scene.addS3MTilesLayerByScp(URL_CONFIG.SCP_CBD_GROUND1, { | ||
| 224 | // name: 'ground' | ||
| 225 | // }); | ||
| 226 | promise[0] = scene.addS3MTilesLayerByScp(URL_CONFIG.SCP_CBD_BUILD, { | ||
| 227 | name: 'build1' | ||
| 228 | }); | ||
| 229 | promise[1] = scene.addS3MTilesLayerByScp(URL_CONFIG.SCP_CBD_BUILD, { | ||
| 230 | name: 'build2' | ||
| 231 | }); | ||
| 232 | promise[2] = scene.addS3MTilesLayerByScp(URL_CONFIG.SCP_CBD_GROUND1, { | ||
| 213 | name: 'ground' | 233 | name: 'ground' |
| 214 | }), | 234 | }); |
| 215 | scene.addS3MTilesLayerByScp(URL_CONFIG.SCP_CBD_BUILD, { | 235 | |
| 216 | name: 'build' | 236 | Cesium.when.all(promise, layers => { |
| 217 | }) | ||
| 218 | ], layer => { | ||
| 219 | // this.layers = layer; | 237 | // this.layers = layer; |
| 220 | objectManage.viewer = this.viewer; | 238 | objectManage.viewer = this.viewer; |
| 239 | // layers[0].selectEnabled = false; | ||
| 240 | // layers[1].selectEnabled = false; | ||
| 241 | // layers[0].shadowType = 2; | ||
| 242 | // layers[1].shadowType = 2; | ||
| 221 | scene.camera.setView({ | 243 | scene.camera.setView({ |
| 222 | destination : Cesium.Cartesian3.fromDegrees(116.44621857300415, 39.899281526734555, 216.7793905027196), | 244 | destination : Cesium.Cartesian3.fromDegrees(116.44621857300415, 39.899281526734555, 216.7793905027196), |
| 223 | orientation : { | 245 | orientation : { |
| ... | @@ -232,6 +254,7 @@ | ... | @@ -232,6 +254,7 @@ |
| 232 | widget.showErrorPanel(title, undefined, e); | 254 | widget.showErrorPanel(title, undefined, e); |
| 233 | } | 255 | } |
| 234 | }); | 256 | }); |
| 257 | |||
| 235 | }, | 258 | }, |
| 236 | methods: { | 259 | methods: { |
| 237 | searchRoat(val) { | 260 | searchRoat(val) { |
| ... | @@ -308,93 +331,7 @@ | ... | @@ -308,93 +331,7 @@ |
| 308 | ,EtopSee() {} | 331 | ,EtopSee() {} |
| 309 | // 环视 | 332 | // 环视 |
| 310 | ,EroundSee() { | 333 | ,EroundSee() { |
| 311 | // var parentEntity = this.viewer.entities.add(new Cesium.Entity()), positions = [], cartesian, polyline; | 334 | |
| 312 | // this.handler = new Cesium.ScreenSpaceEventHandler(this.viewer.scene.canvas) | ||
| 313 | // this.handler.setInputAction(evt => { | ||
| 314 | |||
| 315 | // cartesian = this.viewer.scene.pickPosition(evt.position); | ||
| 316 | // // cartesian = this.draw.getCatesian3FromPX(evt.position, this.viewer, []); | ||
| 317 | // positions.push(cartesian.clone()); | ||
| 318 | // // addCompany.createPoint.call(this, {position: cartesian}) | ||
| 319 | |||
| 320 | // if(positions.length === 1) { | ||
| 321 | // this.handler.setInputAction(moveEvent => { | ||
| 322 | // positions[1] = this.viewer.scene.pickPosition(moveEvent.endPosition); | ||
| 323 | // // positions[1] = this.draw.getCatesian3FromPX(moveEvent.endPosition, this.viewer, []); | ||
| 324 | // !polyline && (polyline = addCompany.createPolyline.call(this, positions)); | ||
| 325 | // }, Cesium.ScreenSpaceEventType.MOUSE_MOVE); | ||
| 326 | // return; | ||
| 327 | // } | ||
| 328 | |||
| 329 | |||
| 330 | // this.handler.destroy(); | ||
| 331 | // // console.log(Cesium.Cartesian3.distance(positions[0], positions[1])); | ||
| 332 | // // var cartesian = this.draw.getCatesian3FromPX(evt.position, this.viewer, []); | ||
| 333 | // var viewPointEntity = this.viewer.entities.add({ | ||
| 334 | // parent: parentEntity, | ||
| 335 | // position: positions[0], | ||
| 336 | // ellipsoid: { | ||
| 337 | // radii: new Cesium.Cartesian3(5, 5, 5), | ||
| 338 | // material: Cesium.Color.GREEN | ||
| 339 | // } | ||
| 340 | // }); | ||
| 341 | // // // 世界坐标转换为投影坐标 | ||
| 342 | // var webMercatorProjection = new Cesium.WebMercatorProjection(this.viewer.scene.globe.ellipsoid); | ||
| 343 | // var viewPointWebMercator = webMercatorProjection.project(Cesium.Cartographic.fromCartesian(positions[0])); | ||
| 344 | // // // 排除碰撞监测的对象 | ||
| 345 | // var objectsToExclude = [viewPointEntity]; | ||
| 346 | |||
| 347 | // // 目标点集合 | ||
| 348 | // var destPoints = []; | ||
| 349 | // // 视域点和目标点的距离 | ||
| 350 | // var radius = Cesium.Cartesian3.distance(positions[0], positions[1]); // 视距1000米 | ||
| 351 | // // 计算一圈 | ||
| 352 | // for (var i = 0; i <= 30; i++) { | ||
| 353 | // // 度数转弧度 | ||
| 354 | // var radians = Cesium.Math.toRadians(i); | ||
| 355 | // // 计算目标点 | ||
| 356 | // var toPoint = new Cesium.Cartesian3(viewPointWebMercator.x + radius * Math.cos(radians), viewPointWebMercator.y + radius * Math.sin(radians), 10); | ||
| 357 | // // 投影坐标转世界坐标 | ||
| 358 | // toPoint = webMercatorProjection.unproject(toPoint); | ||
| 359 | // destPoints.push(Cesium.Cartographic.toCartesian(toPoint.clone())); | ||
| 360 | // } | ||
| 361 | // let viewer = this.viewer; | ||
| 362 | // // 绘制线 | ||
| 363 | // function drawLine(leftPoint, secPoint, color) { | ||
| 364 | // viewer.entities.add({ | ||
| 365 | // polyline: { | ||
| 366 | // positions: [leftPoint, secPoint], | ||
| 367 | // arcType: Cesium.ArcType.NONE, | ||
| 368 | // width: 5, | ||
| 369 | // material: color, | ||
| 370 | // depthFailMaterial: color | ||
| 371 | // } | ||
| 372 | // }) | ||
| 373 | // } | ||
| 374 | // pickFromRay.call(this); | ||
| 375 | // function pickFromRay() { | ||
| 376 | // for (var i = 0; i < destPoints.length; i++) { | ||
| 377 | // // 计算射线的方向,目标点left 视域点right | ||
| 378 | // var direction = Cesium.Cartesian3.normalize(Cesium.Cartesian3.subtract(destPoints[i], positions[0], new Cesium.Cartesian3()), new Cesium.Cartesian3()); | ||
| 379 | // console.log(direction); | ||
| 380 | // // 建立射线 | ||
| 381 | // var ray = new Cesium.Ray(positions[0], direction); | ||
| 382 | // var result = viewer.scene.pickFromRay(ray, objectsToExclude); // 计算交互点,返回第一个 | ||
| 383 | // showIntersection(result, destPoints[i], positions[0]); | ||
| 384 | // } | ||
| 385 | // } | ||
| 386 | // // 处理交互点 | ||
| 387 | // function showIntersection(result, destPoint, cartesian) { | ||
| 388 | // // 如果是场景模型的交互点,排除交互点是地球表面 | ||
| 389 | // if (Cesium.defined(result) && Cesium.defined(result.object)) { | ||
| 390 | // drawLine(result.position, cartesian, Cesium.Color.GREEN); // 可视区域 | ||
| 391 | // drawLine(result.position, destPoint, Cesium.Color.RED); // 不可视区域 | ||
| 392 | // } else { | ||
| 393 | // drawLine(cartesian, destPoint, Cesium.Color.GREEN); | ||
| 394 | // } | ||
| 395 | // } | ||
| 396 | // this.handler.destroy(); | ||
| 397 | // }, Cesium.ScreenSpaceEventType.LEFT_CLICK); | ||
| 398 | } | 335 | } |
| 399 | // 视域 | 336 | // 视域 |
| 400 | ,Ehorizon(val) { | 337 | ,Ehorizon(val) { |
| ... | @@ -405,13 +342,11 @@ | ... | @@ -405,13 +342,11 @@ |
| 405 | ,EallSee(val) { | 342 | ,EallSee(val) { |
| 406 | this[val] = !this[val]; | 343 | this[val] = !this[val]; |
| 407 | this.onlySelect(val); | 344 | this.onlySelect(val); |
| 408 | this.viewpoint instanceof viewpoint || (this.viewpoint = new viewpoint(this.viewer)); | ||
| 409 | }, | 345 | }, |
| 410 | // 淹没分析 | 346 | // 淹没分析 |
| 411 | EymAnslysis(val) { | 347 | EymAnslysis(val) { |
| 412 | this[val] = !this[val]; | 348 | this[val] = !this[val]; |
| 413 | this.onlySelect(val); | 349 | this.onlySelect(val); |
| 414 | this.flood instanceof flood || (this.flood = new flood(this.viewer)); | ||
| 415 | }, | 350 | }, |
| 416 | // 天际线分析 | 351 | // 天际线分析 |
| 417 | EtjxAnslysis(val) { | 352 | EtjxAnslysis(val) { |
| ... | @@ -437,6 +372,9 @@ | ... | @@ -437,6 +372,9 @@ |
| 437 | closePop(val) { | 372 | closePop(val) { |
| 438 | this[val] = false; | 373 | this[val] = false; |
| 439 | }, | 374 | }, |
| 375 | EcloseAddProjectMsg() { | ||
| 376 | this.addProjectMsg = false; | ||
| 377 | }, | ||
| 440 | onlySelect(val) { | 378 | onlySelect(val) { |
| 441 | this.keepArr.forEach(ele => { | 379 | this.keepArr.forEach(ele => { |
| 442 | if(val == ele) { | 380 | if(val == ele) { |
| ... | @@ -457,6 +395,10 @@ | ... | @@ -457,6 +395,10 @@ |
| 457 | // 光照分析 | 395 | // 光照分析 |
| 458 | EGzfx() { | 396 | EGzfx() { |
| 459 | }, | 397 | }, |
| 398 | // 打开新增项目列表 | ||
| 399 | EAddProject() { | ||
| 400 | this.addProjectMsg = true; | ||
| 401 | } | ||
| 460 | } | 402 | } |
| 461 | } | 403 | } |
| 462 | </script> | 404 | </script> |
| ... | @@ -617,6 +559,14 @@ | ... | @@ -617,6 +559,14 @@ |
| 617 | top: 416px; | 559 | top: 416px; |
| 618 | } | 560 | } |
| 619 | 561 | ||
| 562 | .add-project-msg { | ||
| 563 | position: absolute; | ||
| 564 | z-index: 1000; | ||
| 565 | top: 50%; | ||
| 566 | left: 50%; | ||
| 567 | transform: translate(-50%, -50%); | ||
| 568 | } | ||
| 569 | |||
| 620 | .tjx-anslysis { | 570 | .tjx-anslysis { |
| 621 | top: 265px; | 571 | top: 265px; |
| 622 | } | 572 | } | ... | ... |
-
Please register or sign in to post a comment