From c60ee87e2d59fbf8aed2858e8835b063c34de7b5 Mon Sep 17 00:00:00 2001
From: TreeWish <1131093754@qq.com>
Date: 星期五, 03 三月 2023 11:04:49 +0800
Subject: [PATCH] 优化中线缓冲区查询
---
src/components/MapView/mapMenuTop.vue | 104 ++++++++++++++++++++++++++++++++-------------------
1 files changed, 65 insertions(+), 39 deletions(-)
diff --git a/src/components/MapView/mapMenuTop.vue b/src/components/MapView/mapMenuTop.vue
index 1d15714..ec5a325 100644
--- a/src/components/MapView/mapMenuTop.vue
+++ b/src/components/MapView/mapMenuTop.vue
@@ -93,13 +93,16 @@
<queryinfo ref="queryinfo" />
<!-- <div class="buffer-container" ></div> -->
<el-dialog
+ v-dialogDrag
custom-class="buffer-dialog"
top="40vh"
title="绠￠亾涓績绾挎煡璇�"
:visible.sync="dialogFormVisible"
:modal="false"
+ :lock-scroll="false"
:close-on-click-modal="false"
width="25%"
+ @opened="dialogOpend"
>
<el-form :model="menuTopFrom" label-width="150px">
<el-form-item label="绠￠亾涓績绾�">
@@ -136,12 +139,14 @@
<el-input-number
v-model="menuTopFrom.bufferSize"
placeholder=""
+ @change="handleBufferChange"
+ :step="500"
></el-input-number>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="dialogFormVisible = false">鍙� 娑�</el-button>
- <el-button type="primary" @click="genBuffer">纭� 瀹�</el-button>
+ <el-button type="primary" @click="changeBufferData">纭� 瀹�</el-button>
</div>
</el-dialog>
</div>
@@ -161,7 +166,6 @@
import { getToken } from "@/utils/auth"
import * as turf from "@turf/turf"
import { wktToGeoJSON } from "@terraformer/wkt"
-
export default {
components: { queryinfo },
data() {
@@ -170,7 +174,7 @@
queryType: "",
pipeline: "",
segName: "",
- bufferSize: 10,
+ bufferSize: 5000,
},
treeChange: [],
layerData: [
@@ -232,6 +236,7 @@
featureLayer: [],
analyGid: null,
dialogFormVisible: false,
+ bufferLinePosition: [],
}
},
@@ -239,6 +244,13 @@
this.menuTopFrom.queryType = "rectangle"
this.getAllTable()
this.getPipelineData()
+ },
+ watch: {
+ analyGid(newVal, oldVal) {
+ if (newVal !== oldVal && this.dialogFormVisible) {
+ this.genBuffer()
+ }
+ },
},
methods: {
changeValue(value) {
@@ -249,7 +261,7 @@
if (obj.value == "inputFile") {
this.getMenuTopFile()
} else if (obj.value == "buffer") {
- this.handleBuffer()
+ this.dialogFormVisible = true
}
},
async getAllTable() {
@@ -523,7 +535,6 @@
std.alt = cartographic.height
return std
},
- handleBuffer() {},
async getPipelineData() {
const data = await pipelines_selectSegNames()
if (data.code != 200) {
@@ -556,27 +567,21 @@
if (item && wkt) {
const line = wktToGeoJSON(wkt)
- // const line2 = wktToGeoJSON(wkt2)
- const position = line.coordinates
- // const position2 = line2.coordinates
+ let position = line.coordinates
if (wkt.includes("MULTILINESTRING")) {
- this.createBuffer(position.flat())
- } else {
- this.createBuffer(position)
+ position = line.coordinates.flat()
+ }
+ this.bufferLinePosition = position
+ if (this.dialogFormVisible) {
+ this.createBuffer()
}
}
}
- this.dialogFormVisible = false
- let wkt =
- "LINESTRING(114.82181424692999 33.697046488105,115.06065563205186 32.2808276171009,114.69405780892077 31.527280108790023)"
- let wkt2 =
- "MULTILINESTRING((115.35696516720873 33.51877172773311,117.76217256980829 32.44801812803422,118.69492094774364 32.31899881794112))"
-
- // console.log("line1", position)
- // console.log("line2", position2)
},
- createBuffer(position) {
+ createBuffer() {
+ this.clearBufferEntities()
+ const position = this.bufferLinePosition
const buffRadius = this.menuTopFrom.bufferSize
var polylineF = turf.lineString(position)
var bufferd = turf.buffer(polylineF, buffRadius, { units: "meters" })
@@ -596,6 +601,12 @@
})
this.bufferEntities.push(bufferPolygon)
let res = hierarchy.positions
+ sgworld.Navigate.flyToObj(bufferPolygon)
+ this.flyEntity = res
+ },
+ changeBufferData() {
+ this.dialogFormVisible = false
+ let res = this.flyEntity
let restVal,
std = []
for (let i in res) {
@@ -604,13 +615,12 @@
}
restVal = turf.polygon([std], { name: "polygon" })
- this.flyEntity = res
- sgworld.Navigate.flyToObj(bufferPolygon)
console.log("bufferPolygon", res)
console.log("bufferPolygon", restVal)
this.setJonToWKT(restVal)
},
+
pointsToDegreesArray(points) {
let degreesArray = []
points.forEach(item => {
@@ -623,6 +633,7 @@
this.bufferEntities.forEach(entity => {
sgworld.Viewer.entities.remove(entity)
})
+ this.flyEntity = null
},
changeSelect2(res) {
var value = this.featureLayer
@@ -633,8 +644,9 @@
}
}
this.segNameOption = option
- this.menuTopFrom.segName = option[0].segName || '<绌�>'
+ this.menuTopFrom.segName = option[0].segName || "<绌�>"
this.analyGid = option[0].gid
+ this.genBuffer()
},
selectChangeGid(res) {
this.analyGid = res
@@ -652,6 +664,12 @@
})
return restVal
},
+ handleBufferChange(val, oldVal) {
+ this.createBuffer()
+ },
+ dialogOpend() {
+ this.createBuffer()
+ }
},
}
</script>
@@ -685,25 +703,33 @@
<style lang="less">
.menuBox {
- .buffer-dialog {
- background-color: rgba(244, 248, 255, 0.85) !important;
- border: 1px solid rgba(32, 160, 255, 0.6);
- color: #202020;
- .el-dialog__header {
- padding: 10px 20px;
- border-bottom: 1px solid rgba(32, 160, 255, 0.6);
+ .el-dialog__wrapper {
+ pointer-events: none;
+ .buffer-dialog {
+ top: 355px;
+ background-color: rgba(244, 248, 255, 0.85) !important;
+ border: 1px solid rgba(32, 160, 255, 0.6);
+ color: #202020;
+ .el-dialog__body,
+ .el-dialog__header,
+ .el-dialog__footer {
+ pointer-events: auto;
+ }
+ .el-dialog__header {
+ padding: 10px 20px;
+ border-bottom: 1px solid rgba(32, 160, 255, 0.6);
- .el-dialog__headerbtn {
- top: 10px;
- font-size: 18px;
+ .el-dialog__headerbtn {
+ top: 10px;
+ font-size: 18px;
+ }
+ }
+ .el-form-item {
+ .el-input-number {
+ width: 202px;
+ }
}
}
- .el-form-item {
- .el-input-number {
- width: 202px;
- }
- }
-
}
}
</style>
--
Gitblit v1.9.3