11111111
Showing
2 changed files
with
12 additions
and
108 deletions
| 1 | <template> | 1 | <template> | 
| 2 | <div> | 2 | <div> | 
| 3 | 3 | ||
| 4 | <div id="cesiumContainer"> | 4 | <div id="cesiumContainer" ref="cesium"> | 
| 5 | <div id="vertical-slider" style="display: none;"></div> | 5 | <div id="vertical-slider" style="display: none;"></div> | 
| 6 | <div id="horizontal-slider" style="display: none;"></div> | 6 | <div id="horizontal-slider" style="display: none;"></div> | 
| 7 | </div> | 7 | </div> | 
| ... | @@ -21,9 +21,7 @@ | ... | @@ -21,9 +21,7 @@ | 
| 21 | 21 | ||
| 22 | }, | 22 | }, | 
| 23 | data() { | 23 | data() { | 
| 24 | return { | 24 | return {} | 
| 25 | viewer: undefined | ||
| 26 | } | ||
| 27 | }, | 25 | }, | 
| 28 | mounted() { | 26 | mounted() { | 
| 29 | let viewer = new Cesium.Viewer('cesiumContainer', {shadows : true}); | 27 | let viewer = new Cesium.Viewer('cesiumContainer', {shadows : true}); | ... | ... | 
| ... | @@ -91,36 +91,9 @@ | ... | @@ -91,36 +91,9 @@ | 
| 91 | <addProjectMsg @closeAddProjectMsg='EcloseAddProjectMsg'></addProjectMsg> | 91 | <addProjectMsg @closeAddProjectMsg='EcloseAddProjectMsg'></addProjectMsg> | 
| 92 | </div> | 92 | </div> | 
| 93 | 93 | ||
| 94 | 94 | <!-- <threeMap ref="threeMap"></threeMap> | |
| 95 | <div id="cesiumContainer"> | 95 | <arcgisMap ref="arcgisMap"></arcgisMap> --> | 
| 96 | <div id="vertical-slider" style="display: none;"></div> | 96 | <component :is="map"></component> <!-- 动态组件--> | 
| 97 | <div id="horizontal-slider" style="display: none;"></div> | ||
| 98 | </div> | ||
| 99 | |||
| 100 | <!-- <div id="split_up" style="display: none;"></div> | ||
| 101 | <div id="split_bottom" style="display: none;"></div> | ||
| 102 | <div id="split_left" style="display: none;"></div> | ||
| 103 | <div id="split_right" style="display: none;"></div> --> | ||
| 104 | <!-- <div id="loadingbar" class="spinner"> | ||
| 105 | <div class="spinner-container container1"> | ||
| 106 | <div class="circle1"></div> | ||
| 107 | <div class="circle2"></div> | ||
| 108 | <div class="circle3"></div> | ||
| 109 | <div class="circle4"></div> | ||
| 110 | </div> | ||
| 111 | <div class="spinner-container container2"> | ||
| 112 | <div class="circle1"></div> | ||
| 113 | <div class="circle2"></div> | ||
| 114 | <div class="circle3"></div> | ||
| 115 | <div class="circle4"></div> | ||
| 116 | </div> | ||
| 117 | <div class="spinner-container container3"> | ||
| 118 | <div class="circle1"></div> | ||
| 119 | <div class="circle2"></div> | ||
| 120 | <div class="circle3"></div> | ||
| 121 | <div class="circle4"></div> | ||
| 122 | </div> | ||
| 123 | </div> --> | ||
| 124 | 97 | ||
| 125 | </div> | 98 | </div> | 
| 126 | </template> | 99 | </template> | 
| ... | @@ -129,9 +102,7 @@ | ... | @@ -129,9 +102,7 @@ | 
| 129 | import objectManage from '../assets/js/map/maputils'; | 102 | import objectManage from '../assets/js/map/maputils'; | 
| 130 | import createDraw from '../assets/js/map/createDraw'; | 103 | import createDraw from '../assets/js/map/createDraw'; | 
| 131 | import roller from "../assets/js/map/roller"; | 104 | import roller from "../assets/js/map/roller"; | 
| 132 | // import flood from "../assets/js/map/flood"; | 105 | import { loadModules } from "esri-loader"; | 
| 133 | // import viewpoint from "../assets/js/map/viewpoint"; | ||
| 134 | // import visual from "../assets/js/map/visual"; | ||
| 135 | 106 | ||
| 136 | 107 | ||
| 137 | import TopTitle from '../components/topTitle'; | 108 | import TopTitle from '../components/topTitle'; | 
| ... | @@ -141,6 +112,8 @@ | ... | @@ -141,6 +112,8 @@ | 
| 141 | import leftAssert from '../components/leftAssert'; | 112 | import leftAssert from '../components/leftAssert'; | 
| 142 | // import mapPop from '../components/mapPop'; | 113 | // import mapPop from '../components/mapPop'; | 
| 143 | 114 | ||
| 115 | import arcgisMap from '../components/arcgisMap'; //二维地图 | ||
| 116 | import threeMap from '../components/threeMap'; //三维地图 | ||
| 144 | import allSee from '../components/allSee'; //通视 | 117 | import allSee from '../components/allSee'; //通视 | 
| 145 | import ymAnslysis from '../components/ymAnslysis'; //淹没分析 | 118 | import ymAnslysis from '../components/ymAnslysis'; //淹没分析 | 
| 146 | import horizon from '../components/horizon'; // 视域分析 | 119 | import horizon from '../components/horizon'; // 视域分析 | 
| ... | @@ -163,6 +136,8 @@ | ... | @@ -163,6 +136,8 @@ | 
| 163 | bottomNav, | 136 | bottomNav, | 
| 164 | leftAssert, | 137 | leftAssert, | 
| 165 | // mapPop, | 138 | // mapPop, | 
| 139 | arcgisMap, | ||
| 140 | threeMap, | ||
| 166 | 141 | ||
| 167 | allSee, | 142 | allSee, | 
| 168 | ymAnslysis, | 143 | ymAnslysis, | 
| ... | @@ -208,107 +183,38 @@ | ... | @@ -208,107 +183,38 @@ | 
| 208 | } | 183 | } | 
| 209 | }, | 184 | }, | 
| 210 | mounted() { | 185 | mounted() { | 
| 211 | this.viewer = new Cesium.Viewer('cesiumContainer', {shadows : true}); | ||
| 212 | this.viewer.imageryLayers.addImageryProvider(new Cesium.TiandituImageryProvider({ | ||
| 213 | credit : new Cesium.Credit('天地图全球影像服务'), | ||
| 214 | token: URL_CONFIG.TOKEN_TIANDITU | ||
| 215 | })); | ||
| 216 | let scene = this.viewer.scene | ||
| 217 | scene.shadowMap.darkness = 1; //设置第二重烘焙纹理的效果(明暗程度) | ||
| 218 | scene.skyAtmosphere.brightnessShift=0.4; | ||
| 219 | scene.debugShowFramesPerSecond = true; | ||
| 220 | scene.hdrEnabled = false; | ||
| 221 | scene.sun.show = true; | ||
| 222 | this.draw = new createDraw(this.viewer); | ||
| 223 | |||
| 224 | var promise = []; | ||
| 225 | // promise[0] = scene.addS3MTilesLayerByScp(URL_CONFIG.SCP_CBD_GROUND1, { | ||
| 226 | // name: 'ground' | ||
| 227 | // }); | ||
| 228 | promise[0] = scene.addS3MTilesLayerByScp(URL_CONFIG.SCP_CBD_BUILD, { | ||
| 229 | name: 'build1' | ||
| 230 | }); | ||
| 231 | promise[1] = scene.addS3MTilesLayerByScp(URL_CONFIG.SCP_CBD_BUILD, { | ||
| 232 | name: 'build2' | ||
| 233 | }); | ||
| 234 | promise[2] = scene.addS3MTilesLayerByScp(URL_CONFIG.SCP_CBD_GROUND1, { | ||
| 235 | name: 'ground' | ||
| 236 | }); | ||
| 237 | |||
| 238 | Cesium.when.all(promise, layers => { | ||
| 239 | // this.layers = layer; | ||
| 240 | objectManage.viewer = this.viewer; | 186 | objectManage.viewer = this.viewer; | 
| 241 | // layers[0].selectEnabled = false; | ||
| 242 | // layers[1].selectEnabled = false; | ||
| 243 | console.log(layers); | ||
| 244 | layers[1].shadowType = 2; | ||
| 245 | layers[2].shadowType = 2; | ||
| 246 | scene.camera.setView({ | ||
| 247 | destination : Cesium.Cartesian3.fromDegrees(116.44621857300415, 39.899281526734555, 216.7793905027196), | ||
| 248 | orientation : { | ||
| 249 | heading : 0.41348036210986194, | ||
| 250 | pitch : -0.13636490404291735, | ||
| 251 | roll : 6.283185307179563 | ||
| 252 | } | ||
| 253 | }); | ||
| 254 | }, function(e){ | ||
| 255 | if (widget._showRenderLoopErrors) { | ||
| 256 | var title = '加载SCP失败,请检查网络连接状态或者url地址是否正确?'; | ||
| 257 | widget.showErrorPanel(title, undefined, e); | ||
| 258 | } | ||
| 259 | }); | ||
| 260 | |||
| 261 | }, | 187 | }, | 
| 262 | methods: { | 188 | methods: { | 
| 263 | searchRoat(val) { | 189 | searchRoat(val) { | 
| 264 | /** | ||
| 265 | * @param {*} val '为地名地址道路的输入值' | ||
| 266 | */ | ||
| 267 | this.commons.log(val) | 190 | this.commons.log(val) | 
| 268 | }, | 191 | }, | 
| 269 | is2D(flag) { | 192 | is2D(flag) { | 
| 270 | /** | 193 | this.map = flag ? 'arcgisMap' : 'threeMap'; | 
| 271 | * @param {*} flag 'true 选中2D, falss 反之为3D' | ||
| 272 | */ | ||
| 273 | this.commons.log(flag) | ||
| 274 | }, | 194 | }, | 
| 275 | isCamera(flag) { | 195 | isCamera(flag) { | 
| 276 | /** | ||
| 277 | * @param {*} flag 'true 选中影像, falss 反之' | ||
| 278 | */ | ||
| 279 | this.commons.log(flag) | 196 | this.commons.log(flag) | 
| 280 | }, | 197 | }, | 
| 281 | isLayer(flag) { | 198 | isLayer(flag) { | 
| 282 | /** | ||
| 283 | * @param {*} flag 'true 选中图层, falss 反之' | ||
| 284 | */ | ||
| 285 | this.commons.log(flag) | 199 | this.commons.log(flag) | 
| 286 | }, | 200 | }, | 
| 287 | isClear(flag) { | 201 | isClear(flag) { | 
| 288 | // this.commons.log(flag) | ||
| 289 | this.draw.handlerDis.clear(); | 202 | this.draw.handlerDis.clear(); | 
| 290 | this.draw.handlerArea.clear(); | 203 | this.draw.handlerArea.clear(); | 
| 291 | this.draw.handlerHeight.clear(); | 204 | this.draw.handlerHeight.clear(); | 
| 292 | this.viewer.scene.layers.find("build1").clearCustomClipBox(); | 205 | this.viewer.scene.layers.find("build1").clearCustomClipBox(); | 
| 293 | this.viewer.scene.layers.find("build2").clearCustomClipBox(); | 206 | this.viewer.scene.layers.find("build2").clearCustomClipBox(); | 
| 294 | } | 207 | } | 
| 295 | |||
| 296 | // rightFunc | ||
| 297 | // 复位 | ||
| 298 | ,EisReturn(val) {} | 208 | ,EisReturn(val) {} | 
| 299 | // 放大 | ||
| 300 | ,Eenlarge() { | 209 | ,Eenlarge() { | 
| 301 | this.viewer.camera.zoomIn(300); | 210 | this.viewer.camera.zoomIn(300); | 
| 302 | } | 211 | } | 
| 303 | // 缩小 | 212 | ,EEnarrow() { | 
| 304 | ,Enarrow() { | ||
| 305 | this.viewer.camera.zoomOut(300); | 213 | this.viewer.camera.zoomOut(300); | 
| 306 | } | 214 | } | 
| 307 | // 坐标 | ||
| 308 | ,Ecoordinate() { | 215 | ,Ecoordinate() { | 
| 309 | 216 | ||
| 310 | } | 217 | } | 
| 311 | // 距离 | ||
| 312 | ,Edistance(val) { | 218 | ,Edistance(val) { | 
| 313 | this.draw.handlerDis.activate(); | 219 | this.draw.handlerDis.activate(); | 
| 314 | } | 220 | } | ... | ... | 
- 
Please register or sign in to post a comment