| | |
| | | <template> |
| | | <div class="mapBox"> |
| | | <div id="mapdiv"> |
| | | <div |
| | | class="menu_Top" |
| | | v-if="$store.state.mapMenuBoolean" |
| | | > |
| | | <div class="menu_Top" v-if="$store.state.mapMenuBoolean"> |
| | | <map-menu-top v-if="$store.state.mapMenuBoxFlag == '1'" /> |
| | | <map-space-top v-if="$store.state.mapMenuBoxFlag == '2'" /> |
| | | </div> |
| | | |
| | | <div |
| | | class="bufferBox" |
| | | v-if="showBufferBoxDialog" |
| | | > |
| | | <div class="bufferBox" v-if="showBufferBoxDialog"> |
| | | <el-card class="box-card"> |
| | | <div |
| | | slot="header" |
| | | class="clearfix" |
| | | > |
| | | <div slot="header" class="clearfix"> |
| | | <span>缓冲区分析</span> |
| | | <div style="float: right; cursor: pointer"> |
| | | <i |
| | | class="el-icon-close" |
| | | @click="closeBufferBox(1)" |
| | | ></i> |
| | | <i class="el-icon-close" @click="closeBufferBox(1)"></i> |
| | | </div> |
| | | </div> |
| | | <div class="box-body"> |
| | | <el-form |
| | | ref="form" |
| | | :model="bufFrom" |
| | | label-width="100px" |
| | | > |
| | | <el-form ref="form" :model="bufFrom" label-width="100px"> |
| | | <el-form-item label="缓冲半径(米):"> |
| | | <el-input v-model="bufFrom.val"></el-input> |
| | | </el-form-item> |
| | | <el-form-item> |
| | | <el-button |
| | | @click="addBuffer(1)" |
| | | type="info" |
| | | >点</el-button> |
| | | <el-button |
| | | @click="addBuffer(2)" |
| | | type="info" |
| | | >线</el-button> |
| | | <el-button |
| | | @click="addBuffer(3)" |
| | | type="info" |
| | | >面</el-button> |
| | | <el-button |
| | | @click="clearBuffer" |
| | | type="info" |
| | | >清除</el-button> |
| | | <el-button @click="addBuffer(1)" type="info">点</el-button> |
| | | <el-button @click="addBuffer(2)" type="info">线</el-button> |
| | | <el-button @click="addBuffer(3)" type="info">面</el-button> |
| | | <el-button @click="clearBuffer" type="info">清除</el-button> |
| | | </el-form-item> |
| | | </el-form> |
| | | </div> |
| | | </el-card> |
| | | </div> |
| | | <div |
| | | class="coordLocalBox" |
| | | v-if="showCoordLocalBoxDialog" |
| | | > |
| | | <div class="coordLocalBox" v-if="showCoordLocalBoxDialog"> |
| | | <el-card class="box-card"> |
| | | <div |
| | | slot="header" |
| | | class="clearfix" |
| | | > |
| | | <div slot="header" class="clearfix"> |
| | | <span>坐标定位</span> |
| | | <div style="float: right; cursor: pointer"> |
| | | <i |
| | | class="el-icon-close" |
| | | @click="closeBufferBox(2)" |
| | | ></i> |
| | | <i class="el-icon-close" @click="closeBufferBox(2)"></i> |
| | | </div> |
| | | </div> |
| | | <div class="box-body"> |
| | | <el-form |
| | | ref="form" |
| | | :model="coordFrom" |
| | | label-width="50px" |
| | | > |
| | | <el-form ref="form" :model="coordFrom" label-width="50px"> |
| | | <el-form-item label="经度:"> |
| | | <el-input v-model="coordFrom.lon"></el-input> |
| | | </el-form-item> |
| | |
| | | <el-input v-model="coordFrom.height"></el-input> |
| | | </el-form-item> |
| | | <el-form-item> |
| | | <el-button |
| | | @click="setCoordLocal" |
| | | type="info" |
| | | >定位</el-button> |
| | | <el-button @click="setCoordLocal" type="info">定位</el-button> |
| | | </el-form-item> |
| | | </el-form> |
| | | </div> |
| | | </el-card> |
| | | </div> |
| | | <div |
| | | class="toponymicLocalBox" |
| | | v-if="showToponymicLocalBoxDialog" |
| | | > |
| | | <div class="toponymicLocalBox" v-if="showToponymicLocalBoxDialog"> |
| | | <el-card class="box-card"> |
| | | <div |
| | | slot="header" |
| | | class="clearfix" |
| | | > |
| | | <div slot="header" class="clearfix"> |
| | | <span>地名定位</span> |
| | | <div style="float: right; cursor: pointer"> |
| | | <i |
| | | class="el-icon-close" |
| | | @click="closeBufferBox(3)" |
| | | ></i> |
| | | <i class="el-icon-close" @click="closeBufferBox(3)"></i> |
| | | </div> |
| | | </div> |
| | | <div class="box-body"> |
| | | <el-form |
| | | :model="comprehensive" |
| | | :inline="true" |
| | | label-width="50px" |
| | | > |
| | | <el-form :model="comprehensive" :inline="true" label-width="50px"> |
| | | <el-form-item label="地名:"> |
| | | <el-input |
| | | style="width: 200px" |
| | |
| | | ></el-input> |
| | | </el-form-item> |
| | | <el-form-item> |
| | | <el-button |
| | | @click="setQueryTable" |
| | | type="info" |
| | | >查询</el-button> |
| | | <el-button @click="setQueryTable" type="info">查询</el-button> |
| | | </el-form-item> |
| | | </el-form> |
| | | <el-table |
| | | :data="tableData" |
| | | height="200px" |
| | | style="width: 100%" |
| | | > |
| | | <el-table :data="tableData" height="200px" style="width: 100%"> |
| | | <el-table-column |
| | | align="center" |
| | | type="index" |
| | | label="序号" |
| | | width="70px" |
| | | /> |
| | | <el-table-column |
| | | prop="name" |
| | | align="center" |
| | | label="定位" |
| | | > |
| | | <el-table-column prop="name" align="center" label="定位"> |
| | | <template slot-scope="scope"> |
| | | <el-button |
| | | @click="handleLocation(scope.$index, scope.row)" |
| | |
| | | ></el-button> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column |
| | | prop="name" |
| | | align="center" |
| | | label="地名" |
| | | > |
| | | <el-table-column prop="name" align="center" label="地名"> |
| | | </el-table-column> |
| | | </el-table> |
| | | <div |
| | | style="margin-top: 10px" |
| | | class="pagination_box" |
| | | > |
| | | <div style="margin-top: 10px" class="pagination_box"> |
| | | <el-pagination |
| | | @size-change="handleSizeChange" |
| | | @current-change="handleCurrentChange" |
| | |
| | | </div> |
| | | </el-card> |
| | | </div> |
| | | <div |
| | | class="pathAnalysisBox" |
| | | v-if="showPathAnalysisBoxDialog" |
| | | > |
| | | <div class="pathAnalysisBox" v-if="showPathAnalysisBoxDialog"> |
| | | <el-card class="box-card"> |
| | | <div |
| | | slot="header" |
| | | class="clearfix" |
| | | > |
| | | <div slot="header" class="clearfix"> |
| | | <span>路径分析</span> |
| | | <div style="float: right; cursor: pointer"> |
| | | <i |
| | | class="el-icon-close" |
| | | @click="closeBufferBox(4)" |
| | | ></i> |
| | | <i class="el-icon-close" @click="closeBufferBox(4)"></i> |
| | | </div> |
| | | </div> |
| | | <div class="box-body"> |
| | | <el-form |
| | | ref="form" |
| | | :model="pathFrom" |
| | | label-width="50px" |
| | | :rules="rules" |
| | | label-width="55px" |
| | | > |
| | | <el-form-item label="起点:"> |
| | | <el-form-item label="起点:" prop="lon"> |
| | | <el-input |
| | | style="width: 250px" |
| | | v-model="pathFrom.lon" |
| | | :disabled="true" |
| | | placeholder="坐标格式:116.799,39.979" |
| | | ></el-input> |
| | | <el-link |
| | | :underline="false" |
| | | @click="showMouseLeftClick(1)" |
| | | style="margin-left: 10px" |
| | | ><i |
| | | style="color: white" |
| | | class="el-icon-plus" |
| | | ></i></el-link> |
| | | ><i style="color: white" class="el-icon-plus"></i |
| | | ></el-link> |
| | | </el-form-item> |
| | | <el-form-item label="终点:"> |
| | | <el-form-item label="终点:" prop="lat"> |
| | | <el-input |
| | | style="width: 250px" |
| | | v-model="pathFrom.lat" |
| | | :disabled="true" |
| | | placeholder="坐标格式:116.824,39.938" |
| | | ></el-input> |
| | | <el-link |
| | | :underline="false" |
| | | @click="showMouseLeftClick(2)" |
| | | style="margin-left: 10px" |
| | | ><i |
| | | style="color: white" |
| | | class="el-icon-plus" |
| | | ></i></el-link> |
| | | ><i style="color: white" class="el-icon-plus"></i |
| | | ></el-link> |
| | | </el-form-item> |
| | | <el-form-item> |
| | | <el-button |
| | | @click="showMouseLeftClick(3)" |
| | | type="info" |
| | | >查询</el-button> |
| | | <el-button @click="showMouseLeftClick(3)" type="info" |
| | | >查询</el-button |
| | | > |
| | | </el-form-item> |
| | | </el-form> |
| | | </div> |
| | |
| | | </template> |
| | | |
| | | <script> |
| | | import $ from 'jquery'; |
| | | import mapMenuTop from './MapView/mapMenuTop.vue'; |
| | | import $ from "jquery" |
| | | import mapMenuTop from "./MapView/mapMenuTop.vue" |
| | | |
| | | import mapSpaceTop from './MapView/mapSpaceTop.vue'; |
| | | import mapSpaceTop from "./MapView/mapSpaceTop.vue" |
| | | |
| | | import { |
| | | select_Comprehensive_ByPageAndCount, |
| | | select_Comprehensive_SelectWktById, |
| | | comprehensive_selectRoute |
| | | } from '../api/api'; |
| | | comprehensive_selectRoute, |
| | | } from "../api/api" |
| | | |
| | | export default { |
| | | name: '', |
| | | name: "", |
| | | components: { |
| | | mapMenuTop, |
| | | |
| | | mapSpaceTop, |
| | | |
| | | }, |
| | | data() { |
| | | var validatePosition = (rule, value, callback) => { |
| | | if (value === "") { |
| | | callback(new Error("请输入密码")) |
| | | } else { |
| | | if (value) { |
| | | let arr = value.split(",") |
| | | if (arr.length !== 2) { |
| | | callback(new Error("坐标点经纬度格式错误!")) |
| | | } else { |
| | | if (arr[0].startsWith("116") && arr[1].startsWith("39")) { |
| | | } else { |
| | | callback(new Error("坐标点纬度格式错误!")) |
| | | } |
| | | } |
| | | } |
| | | callback() |
| | | } |
| | | } |
| | | return { |
| | | centerFlag: false, |
| | | buffer: null, |
| | |
| | | showPathAnalysisBoxDialog: false, |
| | | comprehensive: {}, |
| | | pathFrom: { |
| | | lon: ' ', |
| | | lat: ' ', |
| | | lon: "", |
| | | lat: "", |
| | | }, |
| | | |
| | | rules: { |
| | | lon: [ |
| | | { required: true, message: "请输入起点经纬度坐标", trigger: "blur" }, |
| | | { |
| | | validator: validatePosition, |
| | | trigger: "blur", |
| | | message: "坐标点经纬度格式错误,坐标格式应为[116.xxx, 39.yyy]", |
| | | }, |
| | | ], |
| | | lat: [ |
| | | { required: true, message: "请输入终点经纬度坐标", trigger: "blur" }, |
| | | { |
| | | validator: validatePosition, |
| | | trigger: "blur", |
| | | message: "坐标点经纬度格式错误,坐标格式应为[116.xxx, 39.yyy]", |
| | | }, |
| | | ], |
| | | }, |
| | | bufFrom: { |
| | | val: 50, |
| | |
| | | |
| | | menuList: [], |
| | | defaultProps: { |
| | | children: 'children', |
| | | label: 'label', |
| | | children: "children", |
| | | label: "label", |
| | | }, //树绑定对象 |
| | | }; |
| | | } |
| | | }, |
| | | mounted() { |
| | | this.init3DMap(); |
| | | this.$bus.$on('mapChangeBox', (res) => { |
| | | this.showChangeBox(res); |
| | | }); |
| | | this.init3DMap() |
| | | this.$bus.$on("mapChangeBox", res => { |
| | | this.showChangeBox(res) |
| | | }) |
| | | }, |
| | | methods: { |
| | | init3DMap() { |
| | | var webKey = '94a34772eb88317fcbf8428e10448561'; |
| | | var webKey = "94a34772eb88317fcbf8428e10448561" |
| | | |
| | | //地图初始化 |
| | | window.sgworld = new SmartEarth.SGWorld('mapdiv', { |
| | | window.sgworld = new SmartEarth.SGWorld("mapdiv", { |
| | | licenseServer: window.sceneConfig.licenseServer, |
| | | }); |
| | | }) |
| | | |
| | | window.Viewer = window.sgworld._Viewer; |
| | | Viewer.imageryLayers._layers[0].show = false; |
| | | window.Viewer = window.sgworld._Viewer |
| | | Viewer.imageryLayers._layers[0].show = false |
| | | //定位 |
| | | sgworld.Navigate.jumpTo({ |
| | | //跳转视角 |
| | |
| | | 39.9115, |
| | | 100000 |
| | | ), |
| | | }); |
| | | }) |
| | | Viewer.imageryLayers.addImageryProvider( |
| | | new Cesium.UrlTemplateImageryProvider({ |
| | | url: gaoDeBaseUrl[0].url, |
| | | |
| | | |
| | | }) |
| | | ); |
| | | ) |
| | | |
| | | Viewer.imageryLayers.addImageryProvider( |
| | | new Cesium.UrlTemplateImageryProvider({ |
| | | url: gaoDeBaseUrl[1].url, |
| | | |
| | | }) |
| | | ); |
| | | ) |
| | | Viewer.imageryLayers.addImageryProvider( |
| | | new Cesium.UrlTemplateImageryProvider({ |
| | | url: gaoDeBaseUrl[2].url, |
| | | |
| | | |
| | | }) |
| | | ); |
| | | ) |
| | | |
| | | // for (var i in gaoDeBaseUrl) { |
| | | // sgworld.Creator.createUrlTemplateImageryProvider( |
| | |
| | | // ); |
| | | // } |
| | | |
| | | Viewer._enableInfoOrSelection = false; |
| | | Viewer._enableInfoOrSelection = false |
| | | //显示fps |
| | | Viewer.scene.debugShowFramesPerSecond = false; |
| | | Viewer.scene.debugShowFramesPerSecond = false |
| | | //导航控件 |
| | | window.sgworld.navControl('nav', false); |
| | | window.sgworld.navControl("nav", false) |
| | | //比例尺 |
| | | window.sgworld.navControl('scale', false); |
| | | window.sgworld.navControl("scale", false) |
| | | //开启深度检测 |
| | | sgworld.Analysis.depthTestAgainstTerrain(true); |
| | | sgworld.Analysis.depthTestAgainstTerrain(true) |
| | | //影像对比设置 |
| | | // var base = { |
| | | // url: 'https://a.tile.openstreetmap.org/', |
| | |
| | | // openStreetMap.item.show = false; |
| | | |
| | | Viewer.terrainProvider = new Cesium.CesiumTerrainProvider({ |
| | | url:demLayer |
| | | }); |
| | | url: demLayer, |
| | | }) |
| | | // var option = { |
| | | // url: window.sceneConfig.SGUrl, |
| | | // layerName: window.sceneConfig.mptName, |
| | |
| | | // } |
| | | // sgworld.Creator.sfsterrainprovider("", option, "", true, ""); |
| | | |
| | | window.elevationTool = new SmartEarth.ElevationTool(window.sgworld); |
| | | elevationTool.setContourColor('#F1D487'); |
| | | window.elevationTool = new SmartEarth.ElevationTool(window.sgworld) |
| | | elevationTool.setContourColor("#F1D487") |
| | | |
| | | // var helper = new Cesium.EventHelper(); |
| | | // helper.add(Viewer.scene.globe.tileLoadProgressEvent, function (e) { |
| | |
| | | // helper.removeAll(); |
| | | // helper = undefined; |
| | | // }); |
| | | |
| | | |
| | | |
| | | |
| | | }, |
| | | |
| | | changeMenulayer() { |
| | | this.isActive = !this.isActive; |
| | | this.isMenuLayer = !this.isMenuLayer; |
| | | this.setLayerVisible(); |
| | | this.isActive = !this.isActive |
| | | this.isMenuLayer = !this.isMenuLayer |
| | | this.setLayerVisible() |
| | | }, |
| | | setLayerVisible() { |
| | | if (this.isActive == true) { |
| | | Viewer.imageryLayers._layers[1].show = true; |
| | | Viewer.imageryLayers._layers[2].show = false; |
| | | Viewer.imageryLayers._layers[3].show = false; |
| | | Viewer.imageryLayers._layers[1].show = true |
| | | Viewer.imageryLayers._layers[2].show = false |
| | | Viewer.imageryLayers._layers[3].show = false |
| | | } else { |
| | | Viewer.imageryLayers._layers[1].show = false; |
| | | Viewer.imageryLayers._layers[2].show = true; |
| | | Viewer.imageryLayers._layers[3].show = true; |
| | | Viewer.imageryLayers._layers[1].show = false |
| | | Viewer.imageryLayers._layers[2].show = true |
| | | Viewer.imageryLayers._layers[3].show = true |
| | | } |
| | | }, |
| | | //显示弹窗 |
| | | showChangeBox(res) { |
| | | if (res.name == 'Query') { |
| | | if (res.id == '6') { |
| | | } else if (res.id == '7') { |
| | | if (res.name == "Query") { |
| | | if (res.id == "6") { |
| | | } else if (res.id == "7") { |
| | | } else { |
| | | this.showBufferBoxDialog = true; |
| | | this.showBufferBoxDialog = true |
| | | } |
| | | } else if (res.name == 'Coord') { |
| | | if (res.id == '1') { |
| | | this.showCoordLocalBoxDialog = true; |
| | | } else if (res.id == '2') { |
| | | this.showToponymicLocalBoxDialog = true; |
| | | this.getToponymicData(); |
| | | } else if (res.name == "Coord") { |
| | | if (res.id == "1") { |
| | | this.showCoordLocalBoxDialog = true |
| | | } else if (res.id == "2") { |
| | | this.showToponymicLocalBoxDialog = true |
| | | this.getToponymicData() |
| | | } |
| | | } else if (res.name == 'Analysis') { |
| | | if (res.id == '3') { |
| | | this.showPathAnalysisBoxDialog = true; |
| | | } else if (res.name == "Analysis") { |
| | | if (res.id == "3") { |
| | | this.showPathAnalysisBoxDialog = true |
| | | } |
| | | } |
| | | }, |
| | | handleSizeChange(val) { |
| | | this.listData.pageSize = val; |
| | | this.getToponymicData(); |
| | | this.listData.pageSize = val |
| | | this.getToponymicData() |
| | | }, |
| | | handleCurrentChange(val) { |
| | | this.listData.pageIndex = val; |
| | | this.getToponymicData(); |
| | | this.listData.pageIndex = val |
| | | this.getToponymicData() |
| | | }, |
| | | setQueryTable() { |
| | | this.listData.pageSize = 10; |
| | | this.listData.pageIndex = 1; |
| | | this.getToponymicData(); |
| | | this.listData.pageSize = 10 |
| | | this.listData.pageIndex = 1 |
| | | this.getToponymicData() |
| | | }, |
| | | async getToponymicData() { |
| | | if (this.listData.tab == '') { |
| | | delete this.listData.tab; |
| | | if (this.listData.tab == "") { |
| | | delete this.listData.tab |
| | | } |
| | | this.listData.name = this.comprehensive.name; |
| | | const data = await select_Comprehensive_ByPageAndCount(this.listData); |
| | | this.listData.name = this.comprehensive.name |
| | | const data = await select_Comprehensive_ByPageAndCount(this.listData) |
| | | |
| | | if (data.code != 200) { |
| | | this.$message.error('列表调用失败'); |
| | | this.$message.error("列表调用失败") |
| | | } |
| | | this.tableData = data.result; |
| | | this.count = data.count; |
| | | this.tableData = data.result |
| | | this.count = data.count |
| | | }, |
| | | async handleLocation(index, row) { |
| | | const data = await select_Comprehensive_SelectWktById({ id: row.gid }); |
| | | const data = await select_Comprehensive_SelectWktById({ id: row.gid }) |
| | | if (data.code != 200) { |
| | | this.$message.error('列表调用失败'); |
| | | this.$message.error("列表调用失败") |
| | | } |
| | | var val = data.result.slice(6, data.result.length - 1); |
| | | val = val.split(' '); |
| | | var val = data.result.slice(6, data.result.length - 1) |
| | | val = val.split(" ") |
| | | var position = { |
| | | X: parseFloat(val[0]), |
| | | Y: parseFloat(val[1]), |
| | | Altitude: 2000, |
| | | }; |
| | | } |
| | | if (this.imagePoint != null) { |
| | | sgworld.Creator.DeleteObject(this.imagePoint); |
| | | this.imagePoint = null; |
| | | sgworld.Creator.DeleteObject(this.imagePoint) |
| | | this.imagePoint = null |
| | | } |
| | | this.imagePoint = sgworld.Creator.CreateLabel( |
| | | position, |
| | | '', |
| | | SmartEarthRootUrl + 'Workers/image/mark.png', |
| | | "", |
| | | SmartEarthRootUrl + "Workers/image/mark.png", |
| | | { |
| | | disableDepthTestDistance: Infinity, |
| | | scale: 0.8, |
| | | }, |
| | | 0, |
| | | '巡检点' |
| | | ); |
| | | "巡检点" |
| | | ) |
| | | |
| | | sgworld.Navigate.jumpTo({ |
| | | //跳转视角 |
| | |
| | | parseFloat(val[1]), |
| | | 10000 |
| | | ), |
| | | }); |
| | | }) |
| | | }, |
| | | closeBufferBox(res) { |
| | | switch (res) { |
| | | case 1: |
| | | this.showBufferBoxDialog = false; |
| | | this.clearBuffer(); |
| | | break; |
| | | this.showBufferBoxDialog = false |
| | | this.clearBuffer() |
| | | break |
| | | case 2: |
| | | this.showCoordLocalBoxDialog = false; |
| | | break; |
| | | this.showCoordLocalBoxDialog = false |
| | | break |
| | | case 3: |
| | | this.showToponymicLocalBoxDialog = false; |
| | | this.showToponymicLocalBoxDialog = false |
| | | if (this.imagePoint != null) { |
| | | sgworld.Creator.DeleteObject(this.imagePoint); |
| | | this.imagePoint = null; |
| | | sgworld.Creator.DeleteObject(this.imagePoint) |
| | | this.imagePoint = null |
| | | } |
| | | break; |
| | | break |
| | | case 4: |
| | | this.showPathAnalysisBoxDialog = false; |
| | | this.clearPathAll(3); |
| | | this.showPathAnalysisBoxDialog = false |
| | | this.clearPathAll(3) |
| | | |
| | | break; |
| | | break |
| | | } |
| | | }, |
| | | //定位 |
| | | setCoordLocal() { |
| | | var lon = parseFloat(this.coordFrom.lon); |
| | | var lat = parseFloat(this.coordFrom.lat); |
| | | var height = parseFloat(this.coordFrom.height); |
| | | var lon = parseFloat(this.coordFrom.lon) |
| | | var lat = parseFloat(this.coordFrom.lat) |
| | | var height = parseFloat(this.coordFrom.height) |
| | | sgworld.Navigate.jumpTo({ |
| | | //跳转视角 |
| | | destination: new Cesium.Cartesian3.fromDegrees(lon, lat, height), |
| | | }); |
| | | }) |
| | | }, |
| | | //缓冲区分析 |
| | | clearBuffer() { |
| | | if (this.buffer == null) return; |
| | | this.buffer && this.buffer.clearBuff(); |
| | | this.buffer = null; |
| | | if (this.buffer == null) return |
| | | this.buffer && this.buffer.clearBuff() |
| | | this.buffer = null |
| | | }, |
| | | getBufferTable(type) { |
| | | const points = |
| | | this.buffer.this_buff.buff.polygon.hierarchy.getValue().positions; |
| | | let geometrys = ''; |
| | | let firstPoint; |
| | | let degrees = ''; |
| | | this.buffer.this_buff.buff.polygon.hierarchy.getValue().positions |
| | | let geometrys = "" |
| | | let firstPoint |
| | | let degrees = "" |
| | | points.forEach((p, i) => { |
| | | degrees = window.sgworld.Core.toDegrees(p); |
| | | geometrys += '[' + degrees.lon + ',' + degrees.lat + '],'; |
| | | i === 0 && (firstPoint = '[' + degrees.lon + ',' + degrees.lat + ']'); |
| | | }); |
| | | geometrys += firstPoint; |
| | | if (geometrys.length != 0) geometrys.trimEnd(','); |
| | | geometrys = '{rings:[[' + geometrys + ']]}'; |
| | | degrees = window.sgworld.Core.toDegrees(p) |
| | | geometrys += "[" + degrees.lon + "," + degrees.lat + "]," |
| | | i === 0 && (firstPoint = "[" + degrees.lon + "," + degrees.lat + "]") |
| | | }) |
| | | geometrys += firstPoint |
| | | if (geometrys.length != 0) geometrys.trimEnd(",") |
| | | geometrys = "{rings:[[" + geometrys + "]]}" |
| | | }, |
| | | addBuffer(res) { |
| | | this.clearBuffer(); |
| | | var buffRadius = this.bufFrom.val; |
| | | this.clearBuffer() |
| | | var buffRadius = this.bufFrom.val |
| | | switch (res) { |
| | | case 1: |
| | | this.buffer = sgworld.Analysis.DrawPointBuffer( |
| | | buffRadius, |
| | | (event) => { |
| | | this.getBufferTable('point'); |
| | | } |
| | | ); |
| | | break; |
| | | this.buffer = sgworld.Analysis.DrawPointBuffer(buffRadius, event => { |
| | | this.getBufferTable("point") |
| | | }) |
| | | break |
| | | case 2: |
| | | this.buffer = sgworld.Analysis.DrawPolylineBuffer( |
| | | buffRadius, |
| | | (event) => { |
| | | this.getBufferTable('line'); |
| | | event => { |
| | | this.getBufferTable("line") |
| | | } |
| | | ); |
| | | break; |
| | | ) |
| | | break |
| | | case 3: |
| | | this.buffer = sgworld.Analysis.DrawPolygonBuffer( |
| | | buffRadius, |
| | | (event) => { |
| | | this.getBufferTable('polygon'); |
| | | event => { |
| | | this.getBufferTable("polygon") |
| | | } |
| | | ); |
| | | break; |
| | | ) |
| | | break |
| | | } |
| | | }, |
| | | async showMouseLeftClick(res) { |
| | | if (res == 3) { |
| | | this.$refs.form.validate(valid => { |
| | | if (!valid) { |
| | | return false |
| | | } |
| | | }) |
| | | if (this.linePath != null) { |
| | | this.clearPathAll(3); |
| | | this.clearPathAll(3) |
| | | } |
| | | var start = this.pathFrom.lon.split(",") |
| | | var end = this.pathFrom.lat.split(",") |
| | |
| | | x1: parseFloat(start[0]), |
| | | y1: parseFloat(start[1]), |
| | | x2: parseFloat(end[0]), |
| | | y2: parseFloat(end[1]) |
| | | y2: parseFloat(end[1]), |
| | | } |
| | | |
| | | const data = await comprehensive_selectRoute(startData); |
| | | const data = await comprehensive_selectRoute(startData) |
| | | if (data.code != 200) { |
| | | return this.$message.error('数据请求失败'); |
| | | return this.$message.error("数据请求失败") |
| | | } |
| | | var wkt = this.$wkt.parse(data.result); |
| | | var wkt = this.$wkt.parse(data.result) |
| | | var bufferSource = Cesium.GeoJsonDataSource.load(wkt, { |
| | | stroke: new Cesium.Color(82 / 255, 152 / 255, 255 / 255, 1), |
| | | |
| | | |
| | | strokeWidth: 5, |
| | | clampToGround: true, |
| | | }) |
| | | bufferSource.then((bufferSource) => { |
| | | bufferSource.then(bufferSource => { |
| | | sgworld.Navigate.flyToObj(bufferSource) |
| | | Viewer.dataSources.add(bufferSource); |
| | | |
| | | } |
| | | ) |
| | | Viewer.dataSources.add(bufferSource) |
| | | }) |
| | | // var jsonurl = |
| | | // wnsUrl + |
| | | // '?start=' + |
| | |
| | | // }, |
| | | // }); |
| | | } else { |
| | | var that = this; |
| | | var that = this |
| | | if (this.handler != null) { |
| | | this.clearLeftClick(); |
| | | this.clearLeftClick() |
| | | } |
| | | this.handler = new Cesium.ScreenSpaceEventHandler(Viewer.scene.canvas); |
| | | this.handler = new Cesium.ScreenSpaceEventHandler(Viewer.scene.canvas) |
| | | this.handler.setInputAction(function (event) { |
| | | let cartesian = Viewer.camera.pickEllipsoid(event.position); |
| | | let cartographic = Cesium.Cartographic.fromCartesian(cartesian); |
| | | let cartesian = Viewer.camera.pickEllipsoid(event.position) |
| | | let cartographic = Cesium.Cartographic.fromCartesian(cartesian) |
| | | let lng = parseFloat( |
| | | Cesium.Math.toDegrees(cartographic.longitude) |
| | | ).toFixed(6); // 经度 |
| | | ).toFixed(6) // 经度 |
| | | let lat = parseFloat( |
| | | Cesium.Math.toDegrees(cartographic.latitude) |
| | | ).toFixed(6); // 纬度 |
| | | ).toFixed(6) // 纬度 |
| | | if (that.linePath != null) { |
| | | that.clearPathAll(3); |
| | | that.clearPathAll(3) |
| | | } |
| | | if (lng != null && lat != null) { |
| | | let val = lng + ',' + lat; |
| | | var position = sgworld.Creator.CreatePosition(lng, lat, 0); |
| | | let val = lng + "," + lat |
| | | var position = sgworld.Creator.CreatePosition(lng, lat, 0) |
| | | if (res == 1) { |
| | | if (that.pathStart != null) { |
| | | that.clearPathAll(1); |
| | | that.clearPathAll(1) |
| | | } |
| | | |
| | | that.pathStart = sgworld.Creator.CreateLabel( |
| | | position, |
| | | '', |
| | | SmartEarthRootUrl + 'Workers/image/start.png', |
| | | "", |
| | | SmartEarthRootUrl + "Workers/image/start.png", |
| | | { |
| | | // 文本偏移量 |
| | | pixelOffset: { |
| | |
| | | scale: 0.8, |
| | | }, |
| | | 0, |
| | | '起始点' |
| | | ); |
| | | "起始点" |
| | | ) |
| | | |
| | | that.pathFrom.lon = val; |
| | | that.pathFrom.lon = val |
| | | } else if (res == 2) { |
| | | if (that.pathEnd != null) { |
| | | that.clearPathAll(2); |
| | | that.clearPathAll(2) |
| | | } |
| | | |
| | | that.pathEnd = sgworld.Creator.CreateLabel( |
| | | position, |
| | | '', |
| | | SmartEarthRootUrl + 'Workers/image/end.png', |
| | | "", |
| | | SmartEarthRootUrl + "Workers/image/end.png", |
| | | { |
| | | // 文本偏移量 |
| | | pixelOffset: { |
| | |
| | | scale: 0.8, |
| | | }, |
| | | 0, |
| | | '结束点' |
| | | ); |
| | | that.pathFrom.lat = val; |
| | | "结束点" |
| | | ) |
| | | that.pathFrom.lat = val |
| | | } |
| | | that.clearLeftClick(); |
| | | that.clearLeftClick() |
| | | } |
| | | }, Cesium.ScreenSpaceEventType.LEFT_CLICK); |
| | | }, Cesium.ScreenSpaceEventType.LEFT_CLICK) |
| | | } |
| | | }, |
| | | clearPathAll(res) { |
| | | switch (res) { |
| | | case 1: |
| | | if (this.pathStart != null) { |
| | | sgworld.Creator.DeleteObject(this.pathStart); |
| | | this.pathStart = null; |
| | | sgworld.Creator.DeleteObject(this.pathStart) |
| | | this.pathStart = null |
| | | } |
| | | break; |
| | | break |
| | | case 2: |
| | | if (this.pathEnd != null) { |
| | | sgworld.Creator.DeleteObject(this.pathEnd); |
| | | this.pathEnd = null; |
| | | sgworld.Creator.DeleteObject(this.pathEnd) |
| | | this.pathEnd = null |
| | | } |
| | | break; |
| | | break |
| | | case 3: |
| | | if (this.pathStart != null) { |
| | | sgworld.Creator.DeleteObject(this.pathStart); |
| | | this.pathStart = null; |
| | | sgworld.Creator.DeleteObject(this.pathStart) |
| | | this.pathStart = null |
| | | } |
| | | |
| | | if (this.pathEnd != null) { |
| | | sgworld.Creator.DeleteObject(this.pathEnd); |
| | | this.pathEnd = null; |
| | | sgworld.Creator.DeleteObject(this.pathEnd) |
| | | this.pathEnd = null |
| | | } |
| | | if (this.linePath != null) { |
| | | sgworld.Creator.DeleteObject(this.linePath); |
| | | this.linePath = null; |
| | | sgworld.Creator.DeleteObject(this.linePath) |
| | | this.linePath = null |
| | | } |
| | | |
| | | Viewer.dataSources.removeAll( ) |
| | | break; |
| | | Viewer.dataSources.removeAll() |
| | | break |
| | | case 4: |
| | | if (this.linePath != null) { |
| | | sgworld.Creator.DeleteObject(this.linePath); |
| | | this.linePath = null; |
| | | sgworld.Creator.DeleteObject(this.linePath) |
| | | this.linePath = null |
| | | } |
| | | break; |
| | | break |
| | | } |
| | | }, |
| | | clearLeftClick() { |
| | | this.handler.removeInputAction(Cesium.ScreenSpaceEventType.LEFT_CLICK); //移除事件 |
| | | this.handler = null; |
| | | this.handler.removeInputAction(Cesium.ScreenSpaceEventType.LEFT_CLICK) //移除事件 |
| | | this.handler = null |
| | | }, |
| | | executeFly3D(res) { |
| | | var position = []; |
| | | var position = [] |
| | | if (res) { |
| | | var positionA = res.features; |
| | | var positionA = res.features |
| | | if (positionA.length > 0) { |
| | | for (var i = 0; i < positionA.length; i++) { |
| | | var val = positionA[i]; |
| | | if (val.geometry.type == 'LineString') { |
| | | var val_data = val.geometry.coordinates; |
| | | var val = positionA[i] |
| | | if (val.geometry.type == "LineString") { |
| | | var val_data = val.geometry.coordinates |
| | | for (var j = 0; j < val_data.length; j++) { |
| | | position.push({ x: val_data[j][0], y: val_data[j][1] }); |
| | | position.push({ x: val_data[j][0], y: val_data[j][1] }) |
| | | } |
| | | } |
| | | } |
| | | this.linePath = sgworld.Creator.createPolyline( |
| | | position, |
| | | '#ffff00', |
| | | "#ffff00", |
| | | 1, |
| | | 0, |
| | | '线' |
| | | ); |
| | | sgworld.Navigate.flyToObj(this.linePath); |
| | | "线" |
| | | ) |
| | | sgworld.Navigate.flyToObj(this.linePath) |
| | | } else { |
| | | return; |
| | | return |
| | | } |
| | | } |
| | | }, |
| | | }, |
| | | }; |
| | | } |
| | | </script> |
| | | |
| | | <style scoped lang="less"> |