From 30e393df7b1d89c4172a7f4bec6e80e2dc00c373 Mon Sep 17 00:00:00 2001 From: suerprisePlus <15810472099@163.com> Date: 星期一, 05 八月 2024 10:14:49 +0800 Subject: [PATCH] 语义功能添加 --- src/views/visual/mapView/lineRoaming.vue | 205 +++++++++++++++++++++++++++++++++++++++++++++----- 1 files changed, 182 insertions(+), 23 deletions(-) diff --git a/src/views/visual/mapView/lineRoaming.vue b/src/views/visual/mapView/lineRoaming.vue index 8ba57cd..0d1b304 100644 --- a/src/views/visual/mapView/lineRoaming.vue +++ b/src/views/visual/mapView/lineRoaming.vue @@ -1,41 +1,65 @@ <template> - <Popup ref="pop" top="20px" left="calc(100% - 600px)" :title="title" @close="close(true)" width="300px" :maxHeight="'700px'" @cancel="close(false)"> - <div class="menuBox"> - <el-form ref="form" label-width="80px"> - <el-form-item label="绾胯矾:"> - - </el-form-item> - <el-form-item label="绾胯矾:"> - - </el-form-item> - <el-form-item> - <el-button size="mini" >寮�濮嬫极娓�</el-button> - <el-button size="mini" >缁撴潫婕父</el-button> - </el-form-item> + <Popup ref="pop" top="20px" left="calc(100% - 600px)" :title="title" @close="close(true)" width="400px" + :maxHeight="'500px'" @cancel="close(false)"> + <div class="menuBox1" style="height: 480px"> + <el-form ref="form" label-width="80px"> + <el-form-item label="绾胯矾:"> + <el-select v-model="value" @chagne="setLineOptionChagne" placeholder="璇烽�夋嫨"> + <el-option v-for="item in lineOption" :key="item.value" :label="item.name" :value="item.value"> + </el-option> + </el-select> + </el-form-item> + <el-form-item label="绾胯矾:"> + <el-select v-model="value1" placeholder="璇烽�夋嫨"> + <el-option v-for="item in lineOption1" :key="item.value" :label="item.name" :value="item.value"> + </el-option> + </el-select> + </el-form-item> + <el-form-item> + <el-button size="mini" @click="setRoamStart">寮�濮嬫极娓�</el-button> + <el-button size="mini" @click="setRoamStop">缁撴潫婕父</el-button> + </el-form-item> </el-form> - </div> + <div class="romContent" v-show="flyRoamOption.length != 0"> + <table> + <tr v-for="(item, index) in flyRoamOption" :key="index"> + <td> {{ item.line }}</td> + <td> {{ item.name }}</td> + <td> {{ item.type }}</td> + </tr> + </table> + </div> + </div> </Popup> </template> <script> import Popup from '@/components/Tool/Popup.vue'; import { - zhangzitou_selectAllLine + zhangzitou_selectAllLine, + zhangzitou_selectAll } from '@/api/mapView/map.js' +import WKT from 'terraformer-wkt-parser'; export default { name: 'location', components: { Popup }, data() { return { title: '绾胯矾婕父', + lineOption: [], + lineOption1: [], + lineObj: null, + value: '', + value1: '', + roamLine: null, + flyRoamOption: [], }; }, - - + + methods: { // 鍏抽棴寮圭獥 close(isCloseBtn, removeLayer = true) { - // removeLayer && this.removeImageLayer(); // 閲嶇疆data鍊� Object.assign(this.$data, this.$options.data()); !isCloseBtn && this.$refs.pop.close(); @@ -46,16 +70,151 @@ this.$refs.pop.open(); this.romaLineStart(); }, - romaLineStart(){ - zhangzitou_selectAllLine({ + romaLineStart() { + zhangzitou_selectAllLine({ limit: 100000, page: 1 - }).then((response)=>{ - console.log(response); + }).then((response) => { + if (response.data.code != 200) return + this.lineOption = []; + this.lineObj = response.data.result.pois; + this.lineObj.map(item => { + if (this.lineOption.length == 0) { + this.lineOption.push({ + name: item.line, + value: item.line + }) + } else { + const n = this.lineOption.filter(r => { + if (r.name == item.line) { + return r + } + + }) + if (n.length == 0) { + this.lineOption.push({ + name: item.line, + value: item.line + }) + } + } + }) + this.value = this.lineOption[0].value + + this.setLineOptionChagne(); }) }, + setRoamPoint() { + zhangzitou_selectAll({ + limit: 100000, + page: 1, + line: this.value + }).then(response => { + if (response.data.code != 200) return + this.flyRoamOption = response.data.result.pois; + }) + }, + setLineOptionChagne() { + this.setRoamPoint(); + const a = this.value + this.lineOption1 = []; + this.lineObj.map(item => { + if (item.line == a) { + this.lineOption1.push({ + name: item.name, + value: item.geom, + }) + } + }) + this.value1 = this.lineOption1[0].value; + this.setLineOption1Chagne(); + + }, + setLineOption1Chagne() { + this.roamLine = this.value1; + console.log(this.lineOption1); + }, + setRoamStart() { + if (!this.roamLine) return; + const obj = WKT.parse(this.roamLine).coordinates[0] + var degreesArr = obj.reduce((combined, current) => combined.concat(current), []); + + const sgworld = earthCtrl; + var url = SmartEarthRootUrl + "Workers/Model/xiaoche.glb"; + const routeData = { + "geometry": { + "type": "LineString", + "coordinates": degreesArr + } + } + const fly = sgworld.factory.createDynamicObject(routeData, url, shuj); + earthCtrl.factory.getFlyData(degreesArr, data => { + data.showPoint = false; + data.showLine = true; + data.mode = 1; + // 寮圭獥鏁版嵁 + window.PathAnimationData = { + flyData: data, + positionEndCallback: (res) => { + + } + }; + + window.PathAnimationData.winIndex = layer.open({ + type: 2, + title: '璺緞鍔ㄧ敾', + shade: false, + area: ['0px', '0px'], + offset: 'r', + skin: 'other-class', + content: SmartEarthRootUrl + 'Workers/path/Path.html', + end: function () { + PathAnimationData.fly && PathAnimationData.fly.exit(); + } + }); + layer.style(window.PathAnimationData.winIndex + , { + display: 'none' + } + ) + }) + }, + setRoamStop() { + + }, + + + + + + }, }; </script> -<style></style> +<style lang="scss" scoped> +.menuBox1 { + height: 500px; + width: 100%; + display: flex; + + flex-direction: column; + + .romContent { + flex: 1; + + overflow: auto; + + table { + width: 100%; + } + + td { + font-family: microsoft yahei; + font-size: 16px; + text-align: center; + padding: 10px 20px; + } + } +} +</style> -- Gitblit v1.9.3