feat: 部分功能新增
This commit is contained in:
kun
parent
2ba165a7a3
commit
b4f02c8da4
339
src/views/goverment/largeScreen/components/coordinatePicking.vue
Normal file
339
src/views/goverment/largeScreen/components/coordinatePicking.vue
Normal file
@ -0,0 +1,339 @@
|
|||||||
|
<template>
|
||||||
|
<div class="main-content">
|
||||||
|
<div class="main-content-title">
|
||||||
|
<span>坐标拾取</span>
|
||||||
|
<el-icon size="16" color="#fff" @click="closeDiv"><Close /></el-icon>
|
||||||
|
</div>
|
||||||
|
<div class="item-classify">
|
||||||
|
<div class="item-classify-item">
|
||||||
|
<span>类型：</span>
|
||||||
|
<el-radio-group v-model="allProperty.radioType" @change="changeFanwei">
|
||||||
|
<el-radio label="1">十进制</el-radio>
|
||||||
|
<el-radio label="2">度分秒</el-radio>
|
||||||
|
<el-radio label="3">平面坐标</el-radio>
|
||||||
|
</el-radio-group>
|
||||||
|
</div>
|
||||||
|
<!-- 十进制 -->
|
||||||
|
<div v-if="allProperty.radioType == '1'">
|
||||||
|
<div class="item-classify-item">
|
||||||
|
<span>经度：</span>
|
||||||
|
<el-input v-model="allProperty.jd" @change="changeJWD" />
|
||||||
|
</div>
|
||||||
|
<div class="item-classify-item">
|
||||||
|
<span>纬度：</span>
|
||||||
|
<el-input v-model="allProperty.wd" @change="changeJWD" />
|
||||||
|
</div>
|
||||||
|
<div class="item-classify-item">
|
||||||
|
<span>高程：</span>
|
||||||
|
<el-input v-model="allProperty.alt" @change="changeJWD" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!-- 度分秒 -->
|
||||||
|
<div v-if="allProperty.radioType == '2'">
|
||||||
|
<div class="item-classify-item">
|
||||||
|
<span>经度：</span>
|
||||||
|
<el-input v-model="allProperty.jdDegree" style="width: 25%" @change="changeDMS">
|
||||||
|
<template #append>度</template>
|
||||||
|
</el-input>
|
||||||
|
<el-input v-model="allProperty.jdMinute" style="width: 25%" @change="changeDMS">
|
||||||
|
<template #append>分</template>
|
||||||
|
</el-input>
|
||||||
|
<el-input v-model="allProperty.jdSecond" style="width: 25%" @change="changeDMS">
|
||||||
|
<template #append>秒</template>
|
||||||
|
</el-input>
|
||||||
|
</div>
|
||||||
|
<div class="item-classify-item">
|
||||||
|
<span>纬度：</span>
|
||||||
|
<el-input v-model="allProperty.wdDegree" style="width: 25%" @change="changeDMS">
|
||||||
|
<template #append>度</template>
|
||||||
|
</el-input>
|
||||||
|
<el-input v-model="allProperty.wdMinute" style="width: 25%" @change="changeDMS">
|
||||||
|
<template #append>分</template>
|
||||||
|
</el-input>
|
||||||
|
<el-input v-model="allProperty.wdSecond" style="width: 25%" @change="changeDMS">
|
||||||
|
<template #append>秒</template>
|
||||||
|
</el-input>
|
||||||
|
</div>
|
||||||
|
<div class="item-classify-item">
|
||||||
|
<span>高程：</span>
|
||||||
|
<el-input v-model="allProperty.alt" @change="changeJWD" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!-- 平面坐标 -->
|
||||||
|
<div v-if="allProperty.radioType == '3'">
|
||||||
|
<div class="item-classify-item">
|
||||||
|
<span>分带：</span>
|
||||||
|
<el-radio-group v-model="allProperty.radioFendai" @change="changeFendai">
|
||||||
|
<el-radio label="1">三度带</el-radio>
|
||||||
|
<el-radio label="2">六度带</el-radio>
|
||||||
|
</el-radio-group>
|
||||||
|
</div>
|
||||||
|
<div class="item-classify-item">
|
||||||
|
<span>纵坐标：</span>
|
||||||
|
<el-input v-model="allProperty.gk6X" style="width: 75%" @change="changeGKZone" />
|
||||||
|
</div>
|
||||||
|
<div class="item-classify-item">
|
||||||
|
<span>横坐标：</span>
|
||||||
|
<el-input v-model="allProperty.gk6Y" style="width: 75%" @change="changeGKZone" />
|
||||||
|
</div>
|
||||||
|
<div class="item-classify-item">
|
||||||
|
<span>高度值：</span>
|
||||||
|
<el-input v-model="allProperty.alt" style="width: 75%" @change="changeGKZone" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="operate-btn">
|
||||||
|
<el-button type="primary" @click="bindMourseClick">图上拾取</el-button>
|
||||||
|
<el-button type="primary" @click="submitCenter">坐标定位</el-button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script lang="ts" setup>
|
||||||
|
//引入cesium基础库
|
||||||
|
import "mars3d-cesium/Build/Cesium/Widgets/widgets.css";
|
||||||
|
import * as Cesium from "mars3d-cesium";
|
||||||
|
//导入mars3d主库
|
||||||
|
import "mars3d/dist/mars3d.css";
|
||||||
|
import * as mars3d from "mars3d";
|
||||||
|
import { ref, watch, onMounted, onUnmounted } from "vue";
|
||||||
|
import { ElMessage } from "element-plus";
|
||||||
|
const props = defineProps(["mapInstance"]);
|
||||||
|
const emits = defineEmits(["hiddenConfim"]);
|
||||||
|
const allProperty = ref({
|
||||||
|
radioType: "1",
|
||||||
|
radioFendai: "2",
|
||||||
|
jd: 0,
|
||||||
|
wd: 0,
|
||||||
|
alt: 0,
|
||||||
|
jdDegree: 0,
|
||||||
|
jdMinute: 0,
|
||||||
|
jdSecond: 0,
|
||||||
|
wdDegree: 0,
|
||||||
|
wdMinute: 0,
|
||||||
|
wdSecond: 0,
|
||||||
|
gk6X: 0,
|
||||||
|
gk6Y: 0
|
||||||
|
});
|
||||||
|
let map: any = props.mapInstance;
|
||||||
|
let currJD: number;
|
||||||
|
let currWD: number;
|
||||||
|
let currGD: number;
|
||||||
|
let pointEntity: any;
|
||||||
|
// 坐标定位
|
||||||
|
const submitCenter = () => {
|
||||||
|
if (allProperty.value.jd > 180 || allProperty.value.jd < -180) {
|
||||||
|
ElMessage("请输入有效的经度值！");
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
if (allProperty.value.wd > 90 || allProperty.value.wd < -90) {
|
||||||
|
ElMessage("请输入有效的纬度值！");
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
updateMarker(true, currJD, currWD, currGD);
|
||||||
|
};
|
||||||
|
const updateMarker = (hasCenter: any, jd: any, wd: any, alt: any) => {
|
||||||
|
const position = [jd, wd, alt];
|
||||||
|
|
||||||
|
if (pointEntity == null) {
|
||||||
|
pointEntity = new mars3d.graphic.PointEntity({
|
||||||
|
position: position,
|
||||||
|
style: {
|
||||||
|
color: "#3388ff",
|
||||||
|
pixelSize: 10,
|
||||||
|
outlineColor: "#ffffff",
|
||||||
|
outlineWidth: 2
|
||||||
|
}
|
||||||
|
});
|
||||||
|
map.graphicLayer.addGraphic(pointEntity);
|
||||||
|
} else {
|
||||||
|
pointEntity.position = position;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (hasCenter) {
|
||||||
|
pointEntity.flyTo({ radius: 1000 });
|
||||||
|
}
|
||||||
|
};
|
||||||
|
const marsProj4Trans = (JD: any, WD: any, radio: any) => {
|
||||||
|
if (radio === "2") {
|
||||||
|
return mars3d.PointTrans.proj4Trans([JD, WD], mars3d.CRS.EPSG4326, mars3d.CRS.CGCS2000_GK_Zone_6);
|
||||||
|
} else {
|
||||||
|
return mars3d.PointTrans.proj4Trans([JD, WD], mars3d.CRS.EPSG4326, mars3d.CRS.CGCS2000_GK_Zone_3);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
const changeFendai = () => {
|
||||||
|
// 十进制转2000平面六分度
|
||||||
|
const zoon = marsProj4Trans(currJD, currWD, allProperty.value.radioFendai);
|
||||||
|
allProperty.value.gk6X = marsUtilFormtNum(zoon[0], 1);
|
||||||
|
allProperty.value.gk6Y = marsUtilFormtNum(zoon[1], 1);
|
||||||
|
};
|
||||||
|
const changeFanwei = () => {
|
||||||
|
switch (allProperty.value.radioType) {
|
||||||
|
case "2": // 度分秒
|
||||||
|
allProperty.value.jdDegree = marsPointTrans(currJD).degree;
|
||||||
|
allProperty.value.jdMinute = marsPointTrans(currJD).minute;
|
||||||
|
allProperty.value.jdSecond = marsPointTrans(currJD).second;
|
||||||
|
|
||||||
|
allProperty.value.wdDegree = marsPointTrans(currWD).degree;
|
||||||
|
allProperty.value.wdMinute = marsPointTrans(currWD).minute;
|
||||||
|
allProperty.value.wdSecond = marsPointTrans(currWD).second;
|
||||||
|
|
||||||
|
break;
|
||||||
|
case "3": // CGCS2000
|
||||||
|
changeFendai();
|
||||||
|
break;
|
||||||
|
default:
|
||||||
|
// 十进制
|
||||||
|
allProperty.value.jd = marsUtilFormtNum(currJD, 6);
|
||||||
|
allProperty.value.wd = marsUtilFormtNum(currWD, 6);
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
// 坐标转化的三种方法
|
||||||
|
const marsUtilFormtNum = (item: any, num: any) => {
|
||||||
|
return mars3d.Util.formatNum(item, num);
|
||||||
|
};
|
||||||
|
const marsPointTrans = (item: any) => {
|
||||||
|
return mars3d.PointTrans.degree2dms(item);
|
||||||
|
};
|
||||||
|
// 转换成十进制的方法
|
||||||
|
const marsDms2degree = (du: any, fen: any, miao: any) => {
|
||||||
|
return mars3d.PointTrans.dms2degree(du, fen, miao);
|
||||||
|
};
|
||||||
|
const marsZONEtoCRS = (jd: any, wd: any, radio: any) => {
|
||||||
|
if (radio === "2") {
|
||||||
|
return mars3d.PointTrans.proj4Trans([jd, wd], mars3d.CRS.CGCS2000_GK_Zone_6, mars3d.CRS.EPSG4326);
|
||||||
|
} else {
|
||||||
|
return mars3d.PointTrans.proj4Trans([jd, wd], mars3d.CRS.CGCS2000_GK_Zone_3, mars3d.CRS.EPSG4326);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
// 图上拾取
|
||||||
|
const bindMourseClick = () => {
|
||||||
|
map.setCursor(true);
|
||||||
|
map.once(mars3d.EventType.click, function (event: any) {
|
||||||
|
map.setCursor(false);
|
||||||
|
const cartesian = event.cartesian;
|
||||||
|
const point = mars3d.LngLatPoint.fromCartesian(cartesian);
|
||||||
|
point.format();
|
||||||
|
currJD = point.lng;
|
||||||
|
currWD = point.lat;
|
||||||
|
currGD = point.alt;
|
||||||
|
|
||||||
|
allProperty.value.jd = marsUtilFormtNum(currJD, 6);
|
||||||
|
allProperty.value.wd = marsUtilFormtNum(currWD, 6);
|
||||||
|
allProperty.value.alt = marsUtilFormtNum(currGD, 6);
|
||||||
|
changeFanwei();
|
||||||
|
// 更新面板
|
||||||
|
updateMarker(false, currJD, currWD, currGD);
|
||||||
|
});
|
||||||
|
};
|
||||||
|
const changeGKZone = () => {
|
||||||
|
const zoon = marsZONEtoCRS(Number(allProperty.value.gk6X), Number(allProperty.value.gk6Y), allProperty.value.radioFendai);
|
||||||
|
currJD = zoon[0];
|
||||||
|
currWD = zoon[1];
|
||||||
|
};
|
||||||
|
const changeDMS = () => {
|
||||||
|
currJD = marsDms2degree(allProperty.value.jdDegree, allProperty.value.jdMinute, allProperty.value.jdSecond);
|
||||||
|
currWD = marsDms2degree(allProperty.value.wdDegree, allProperty.value.wdMinute, allProperty.value.wdSecond);
|
||||||
|
};
|
||||||
|
const changeJWD = () => {
|
||||||
|
currJD = Number(allProperty.value.jd);
|
||||||
|
currWD = Number(allProperty.value.wd);
|
||||||
|
currGD = Number(allProperty.value.alt);
|
||||||
|
};
|
||||||
|
const closeDiv = () => {
|
||||||
|
emits("hiddenConfim");
|
||||||
|
};
|
||||||
|
onMounted(() => {
|
||||||
|
console.log(map, "66666");
|
||||||
|
});
|
||||||
|
onUnmounted(() => {
|
||||||
|
map = null;
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
@mixin flex {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
// 菜单弹框出现动画
|
||||||
|
@keyframes fadeIn {
|
||||||
|
0% {
|
||||||
|
opacity: 0;
|
||||||
|
transform: translate3d(100%, 0, 0);
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
opacity: 1;
|
||||||
|
transform: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.main-content {
|
||||||
|
position: absolute;
|
||||||
|
top: 60px;
|
||||||
|
right: 10px;
|
||||||
|
padding-bottom: 10px;
|
||||||
|
background-image: none !important;
|
||||||
|
border: 1px solid #008aff70;
|
||||||
|
border-radius: 2px !important;
|
||||||
|
background-color: rgba(23, 49, 71, 0.8);
|
||||||
|
width: 350px;
|
||||||
|
box-shadow: 0 4px 15px 1px #02213bb3;
|
||||||
|
animation: fadeIn 1s;
|
||||||
|
&-title {
|
||||||
|
@include flex;
|
||||||
|
width: 100%;
|
||||||
|
height: 40px;
|
||||||
|
padding: 0 5px 0 10px;
|
||||||
|
background-color: #173147;
|
||||||
|
span {
|
||||||
|
font-size: 16px;
|
||||||
|
color: #0089fe;
|
||||||
|
margin-right: auto;
|
||||||
|
}
|
||||||
|
:deep() {
|
||||||
|
.el-icon {
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.item-classify {
|
||||||
|
width: 95%;
|
||||||
|
margin: 0 auto;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
&-item {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
color: white;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
* {
|
||||||
|
margin-right: 10px;
|
||||||
|
}
|
||||||
|
:deep() {
|
||||||
|
.el-input {
|
||||||
|
width: 80%;
|
||||||
|
}
|
||||||
|
.el-checkbox__inner,
|
||||||
|
.el-radio__inner {
|
||||||
|
background-color: transparent;
|
||||||
|
}
|
||||||
|
.el-checkbox__label,
|
||||||
|
.el-radio__label {
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.operate-btn {
|
||||||
|
@include flex;
|
||||||
|
justify-content: center;
|
||||||
|
margin-top: 10px;
|
||||||
|
:deep() {
|
||||||
|
.el-button {
|
||||||
|
margin-left: 10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
392
src/views/goverment/largeScreen/components/myTags.vue
Normal file
392
src/views/goverment/largeScreen/components/myTags.vue
Normal file
@ -0,0 +1,392 @@
|
|||||||
|
<template>
|
||||||
|
<div class="main-content">
|
||||||
|
<div class="main-content-title">
|
||||||
|
<span>我的标记</span>
|
||||||
|
<el-icon size="16" color="#fff" @click="closeDiv"><Close /></el-icon>
|
||||||
|
</div>
|
||||||
|
<div class="item-classify">
|
||||||
|
<div class="item-classify-item">
|
||||||
|
<span>数据维护：</span>
|
||||||
|
<el-button type="primary" @click="startDrawGraphic">图上标绘</el-button>
|
||||||
|
<!-- <el-checkbox v-model="checkVal">是否编辑</el-checkbox> -->
|
||||||
|
</div>
|
||||||
|
<div class="item-classify-item">
|
||||||
|
<span>数据导出：</span>
|
||||||
|
<el-upload
|
||||||
|
ref="importRef"
|
||||||
|
:auto-upload="false"
|
||||||
|
:headers="headers"
|
||||||
|
:on-change="uploadFileChange"
|
||||||
|
multiple
|
||||||
|
:limit="1"
|
||||||
|
:show-file-list="false"
|
||||||
|
>
|
||||||
|
<el-button type="primary">打开</el-button>
|
||||||
|
</el-upload>
|
||||||
|
<el-button type="primary" @click="expGeoJSONFile">导出GeoJSON</el-button>
|
||||||
|
<el-button type="primary" @click="expJSONFile">导出构造JSON</el-button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="table-operate">
|
||||||
|
<el-table :data="tableData" rowKey="key">
|
||||||
|
<el-table-column prop="name" align="center" label="名称" />
|
||||||
|
<el-table-column align="center" label="操作">
|
||||||
|
<template #default="{ row, $index }">
|
||||||
|
<el-button link type="primary" @click="toPoint(row)">定位</el-button>
|
||||||
|
<el-button link type="primary" @click="deletePoint(row, $index)">删除</el-button>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
</el-table>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script lang="ts" setup>
|
||||||
|
//引入cesium基础库
|
||||||
|
import "mars3d-cesium/Build/Cesium/Widgets/widgets.css";
|
||||||
|
import * as Cesium from "mars3d-cesium";
|
||||||
|
//导入mars3d主库
|
||||||
|
import "mars3d/dist/mars3d.css";
|
||||||
|
import * as mars3d from "mars3d";
|
||||||
|
import { ref, watch, onMounted, onUnmounted } from "vue";
|
||||||
|
import { ElMessage } from "element-plus";
|
||||||
|
import { Console } from "console";
|
||||||
|
import { GlobalStore } from "@/stores";
|
||||||
|
const importRef = ref();
|
||||||
|
const globalStore = GlobalStore();
|
||||||
|
const headers = ref({ Authorization: "Bearer " + globalStore.token });
|
||||||
|
const baseUrl = import.meta.env.VITE_API_URL;
|
||||||
|
const props = defineProps(["mapInstance"]);
|
||||||
|
const emits = defineEmits(["hiddenConfim"]);
|
||||||
|
const tableData = ref<any>([]);
|
||||||
|
const checkVal = ref(false);
|
||||||
|
let map: any = props.mapInstance;
|
||||||
|
let graphicLayer: any;
|
||||||
|
let dataIndex = 0;
|
||||||
|
onMounted(() => {
|
||||||
|
graphicLayer = new mars3d.layer.GraphicLayer();
|
||||||
|
map.addLayer(graphicLayer);
|
||||||
|
graphicLayer.on(mars3d.EventType.drawCreated, function (event: any) {
|
||||||
|
console.log("矢量对象绘制完成", event);
|
||||||
|
productTableData();
|
||||||
|
});
|
||||||
|
bindLayerPopup(); // 在图层上绑定popup,对所有加到这个图层的矢量数据都生效
|
||||||
|
bindLayerContextMenu(); // 在图层绑定右键菜单,对所有加到这个图层的矢量数据都生效
|
||||||
|
});
|
||||||
|
|
||||||
|
// 打卡JSON文件
|
||||||
|
const uploadFileChange = (response: any) => {
|
||||||
|
console.log(response);
|
||||||
|
|
||||||
|
const item = response.raw;
|
||||||
|
const fileName = item.name;
|
||||||
|
const fileType = fileName?.substring(fileName.lastIndexOf(".") + 1, fileName.length).toLowerCase();
|
||||||
|
try {
|
||||||
|
if (fileType === "json" || fileType === "geojson") {
|
||||||
|
const reader = new FileReader();
|
||||||
|
reader.readAsText(item, "UTF-8");
|
||||||
|
reader.onloadend = function (e) {
|
||||||
|
const geojson = JSON.parse(this.result as string);
|
||||||
|
console.log("打开了json文件", geojson);
|
||||||
|
|
||||||
|
if (geojson.type === "graphic" && geojson.data) {
|
||||||
|
graphicLayer.addGraphic(geojson.data);
|
||||||
|
graphicLayer.flyTo();
|
||||||
|
} else {
|
||||||
|
graphicLayer.loadGeoJSON(geojson, { flyTo: true });
|
||||||
|
// initGraphicableData(graphicLayer)
|
||||||
|
}
|
||||||
|
|
||||||
|
productTableData();
|
||||||
|
};
|
||||||
|
} else if (fileType === "kml") {
|
||||||
|
const reader = new FileReader();
|
||||||
|
reader.readAsText(item, "UTF-8");
|
||||||
|
reader.onloadend = function (e) {
|
||||||
|
const strkml = this.result;
|
||||||
|
|
||||||
|
map.kgUtil.toGeoJSON(strkml).then((geojson: any) => {
|
||||||
|
console.log("kml2geojson转换结果为", geojson);
|
||||||
|
|
||||||
|
graphicLayer.loadGeoJSON(geojson, {
|
||||||
|
flyTo: true
|
||||||
|
});
|
||||||
|
});
|
||||||
|
};
|
||||||
|
} else if (fileType === "kmz") {
|
||||||
|
// 加载input文件控件的二进制流
|
||||||
|
|
||||||
|
map.kgUtil.toGeoJSON(item).then((geojson: any) => {
|
||||||
|
console.log("kmz2geojson", geojson);
|
||||||
|
|
||||||
|
graphicLayer.loadGeoJSON(geojson, {
|
||||||
|
flyTo: true
|
||||||
|
});
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
ElMessage("暂不支持 " + fileType + " 文件类型的数据！");
|
||||||
|
}
|
||||||
|
importRef.value.clearFiles();
|
||||||
|
} catch (error) {
|
||||||
|
ElMessage("有相同数据");
|
||||||
|
}
|
||||||
|
};
|
||||||
|
// 导出构造JSON文件
|
||||||
|
const expJSONFile = () => {
|
||||||
|
if (graphicLayer.length == 0) {
|
||||||
|
ElMessage("当前没有标注任何数据，无需保存！");
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
const geojson = graphicLayer.toJSON();
|
||||||
|
mars3d.Util.downloadFile("矢量数据构造参数.json", JSON.stringify(geojson));
|
||||||
|
};
|
||||||
|
// 导出GeoJSON文件
|
||||||
|
const expGeoJSONFile = () => {
|
||||||
|
if (graphicLayer.length == 0) {
|
||||||
|
ElMessage("当前没有标注任何数据，无需保存！");
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
const geojson = graphicLayer.toGeoJSON();
|
||||||
|
mars3d.Util.downloadFile("矢量数据GeoJSON.json", JSON.stringify(geojson));
|
||||||
|
};
|
||||||
|
// 删除点位
|
||||||
|
const deletePoint = (row: any, index: number) => {
|
||||||
|
const graphic = graphicLayer.getGraphicById(row.key);
|
||||||
|
graphic && graphic.remove(true);
|
||||||
|
tableData.value.splice(index, 1);
|
||||||
|
};
|
||||||
|
// 定位到点位
|
||||||
|
const toPoint = (row: any) => {
|
||||||
|
const graphic = graphicLayer.getGraphicById(row.key);
|
||||||
|
graphic.flyTo();
|
||||||
|
};
|
||||||
|
// 获取点位名称
|
||||||
|
const getGraphicName = (graphic: any) => {
|
||||||
|
if (graphic?.style?.label?.text) {
|
||||||
|
return `${graphic.type} - ${graphic.style.label.text}`;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (graphic.name) {
|
||||||
|
return `${graphic.type} - ${graphic.name}`;
|
||||||
|
}
|
||||||
|
if (graphic.attr.remark) {
|
||||||
|
return `${graphic.type} - ${graphic.attr.remark}`;
|
||||||
|
}
|
||||||
|
|
||||||
|
graphic.name = `未命名${dataIndex}`;
|
||||||
|
return `${graphic.type} - ${graphic.name}`;
|
||||||
|
};
|
||||||
|
// 生成表格数据
|
||||||
|
const productTableData = () => {
|
||||||
|
console.log(graphicLayer.graphics);
|
||||||
|
const list = graphicLayer.graphics;
|
||||||
|
for (let i = list.length - 1; i >= 0; i--) {
|
||||||
|
const graphic = list[i];
|
||||||
|
if (graphic.isPrivate) {
|
||||||
|
continue;
|
||||||
|
}
|
||||||
|
tableData.value.push({
|
||||||
|
key: graphic.id,
|
||||||
|
name: getGraphicName(graphic)
|
||||||
|
});
|
||||||
|
}
|
||||||
|
// let position = [] as any;
|
||||||
|
// const graphic = new mars3d.graphic.PointEntity({
|
||||||
|
// position: position,
|
||||||
|
// style: {
|
||||||
|
// color: "#00ffff",
|
||||||
|
// pixelSize: 6,
|
||||||
|
// outlineColor: "#ffffff",
|
||||||
|
// outlineWidth: 2
|
||||||
|
// },
|
||||||
|
// attr: { index: dataIndex }
|
||||||
|
// });
|
||||||
|
// graphicLayer.addGraphic(graphic);
|
||||||
|
// dataIndex++;
|
||||||
|
};
|
||||||
|
// 绑定右键菜单
|
||||||
|
const bindLayerContextMenu = () => {
|
||||||
|
graphicLayer.bindContextMenu([
|
||||||
|
// {
|
||||||
|
// text: "开始编辑对象",
|
||||||
|
// icon: "fa fa-edit",
|
||||||
|
// show: function (e) {
|
||||||
|
// const graphic = e.graphic
|
||||||
|
// if (!graphic || !graphic.hasEdit) {
|
||||||
|
// return false
|
||||||
|
// }
|
||||||
|
// return !graphic.isEditing
|
||||||
|
// },
|
||||||
|
// callback: (e) => {
|
||||||
|
// const graphic = e.graphic
|
||||||
|
// if (!graphic) {
|
||||||
|
// return false
|
||||||
|
// }
|
||||||
|
// if (graphic) {
|
||||||
|
// graphicLayer.startEditing(graphic)
|
||||||
|
// }
|
||||||
|
// }
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// text: "停止编辑对象",
|
||||||
|
// icon: "fa fa-edit",
|
||||||
|
// show: function (e) {
|
||||||
|
// const graphic = e.graphic
|
||||||
|
// if (!graphic || !graphic.hasEdit) {
|
||||||
|
// return false
|
||||||
|
// }
|
||||||
|
// return graphic.isEditing
|
||||||
|
// },
|
||||||
|
// callback: (e) => {
|
||||||
|
// const graphic = e.graphic
|
||||||
|
// if (!graphic) {
|
||||||
|
// return false
|
||||||
|
// }
|
||||||
|
// if (graphic) {
|
||||||
|
// graphic.stopEditing()
|
||||||
|
// }
|
||||||
|
// }
|
||||||
|
// },
|
||||||
|
{
|
||||||
|
text: "删除对象",
|
||||||
|
icon: "fa fa-trash-o",
|
||||||
|
show: (event: any) => {
|
||||||
|
const graphic = event.graphic;
|
||||||
|
if (!graphic || graphic.isDestroy) {
|
||||||
|
return false;
|
||||||
|
} else {
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
callback: e => {
|
||||||
|
const graphic = e.graphic;
|
||||||
|
if (!graphic) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
const parent = graphic.parent; // 右击是编辑点时
|
||||||
|
graphicLayer.removeGraphic(graphic);
|
||||||
|
if (parent) {
|
||||||
|
graphicLayer.removeGraphic(parent);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
]);
|
||||||
|
};
|
||||||
|
// 绑定图层弹出框
|
||||||
|
const bindLayerPopup = () => {
|
||||||
|
graphicLayer.bindPopup((event: any) => {
|
||||||
|
const attr = event.graphic.attr || {};
|
||||||
|
attr["类型"] = event.graphic.type;
|
||||||
|
attr["来源"] = "我是layer上绑定的Popup";
|
||||||
|
attr["备注"] = "我支持鼠标交互";
|
||||||
|
return mars3d.Util.getTemplateHtml({ title: "矢量图层", template: "all", attr: attr });
|
||||||
|
});
|
||||||
|
};
|
||||||
|
// 图上绘制
|
||||||
|
const startDrawGraphic = () => {
|
||||||
|
graphicLayer.startDraw({
|
||||||
|
type: "point",
|
||||||
|
style: {
|
||||||
|
color: "#00ffff",
|
||||||
|
pixelSize: 6,
|
||||||
|
outlineColor: "#ffffff",
|
||||||
|
outlineWidth: 2
|
||||||
|
// label: {
|
||||||
|
// // 不需要文字时，去掉label配置即可
|
||||||
|
// text: "可以同时支持文字",
|
||||||
|
// font_size: 20,
|
||||||
|
// color: "#ffffff",
|
||||||
|
// outline: true,
|
||||||
|
// outlineColor: "#000000",
|
||||||
|
// pixelOffsetY: -20
|
||||||
|
// }
|
||||||
|
}
|
||||||
|
});
|
||||||
|
};
|
||||||
|
const closeDiv = () => {
|
||||||
|
emits("hiddenConfim");
|
||||||
|
};
|
||||||
|
onUnmounted(() => {
|
||||||
|
map = null;
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
@mixin flex {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
// 菜单弹框出现动画
|
||||||
|
@keyframes fadeIn {
|
||||||
|
0% {
|
||||||
|
opacity: 0;
|
||||||
|
transform: translate3d(100%, 0, 0);
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
opacity: 1;
|
||||||
|
transform: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.main-content {
|
||||||
|
position: absolute;
|
||||||
|
top: 60px;
|
||||||
|
right: 10px;
|
||||||
|
padding-bottom: 10px;
|
||||||
|
background-image: none !important;
|
||||||
|
border: 1px solid #008aff70;
|
||||||
|
border-radius: 2px !important;
|
||||||
|
background-color: rgba(23, 49, 71, 0.8);
|
||||||
|
width: 500px;
|
||||||
|
box-shadow: 0 4px 15px 1px #02213bb3;
|
||||||
|
animation: fadeIn 1s;
|
||||||
|
&-title {
|
||||||
|
@include flex;
|
||||||
|
width: 100%;
|
||||||
|
height: 40px;
|
||||||
|
padding: 0 5px 0 10px;
|
||||||
|
background-color: #173147;
|
||||||
|
span {
|
||||||
|
font-size: 16px;
|
||||||
|
color: #0089fe;
|
||||||
|
margin-right: auto;
|
||||||
|
}
|
||||||
|
:deep() {
|
||||||
|
.el-icon {
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.item-classify {
|
||||||
|
width: 95%;
|
||||||
|
margin: 0 auto;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
&-item {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
color: white;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
* {
|
||||||
|
margin-right: 10px;
|
||||||
|
}
|
||||||
|
:deep() {
|
||||||
|
.el-input {
|
||||||
|
width: 80%;
|
||||||
|
}
|
||||||
|
.el-checkbox__inner,
|
||||||
|
.el-radio__inner {
|
||||||
|
background-color: transparent;
|
||||||
|
}
|
||||||
|
.el-checkbox__label,
|
||||||
|
.el-radio__label {
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.table-operate {
|
||||||
|
width: 95%;
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,232 @@
|
|||||||
|
<template>
|
||||||
|
<div class="main-content">
|
||||||
|
<div class="main-content-title">
|
||||||
|
<span>地区导航</span>
|
||||||
|
<el-icon size="16" color="#fff" @click="closeDiv"><Close /></el-icon>
|
||||||
|
</div>
|
||||||
|
<div class="areabox">
|
||||||
|
<div class="flex-box">
|
||||||
|
<span>省：</span>
|
||||||
|
<el-select v-model="address.province" placeholder="请选择省" @change="handleProvinceSelect">
|
||||||
|
<el-option v-for="item in regionData" :label="item.label" :value="item.value" />
|
||||||
|
</el-select>
|
||||||
|
</div>
|
||||||
|
<div class="flex-box">
|
||||||
|
<span>市：</span>
|
||||||
|
<el-select
|
||||||
|
v-model="address.city"
|
||||||
|
placeholder="请选择市"
|
||||||
|
:disabled="!address.province || cityList.length == 0"
|
||||||
|
@change="handleCitySelect"
|
||||||
|
>
|
||||||
|
<el-option v-for="item in cityList" :label="item.label" :value="item.value" />
|
||||||
|
</el-select>
|
||||||
|
</div>
|
||||||
|
<div class="flex-box">
|
||||||
|
<span>区：</span>
|
||||||
|
<el-select
|
||||||
|
v-model="address.area"
|
||||||
|
placeholder="请选择区"
|
||||||
|
:disabled="!address.province || !address.city || areaList.length == 0"
|
||||||
|
@change="handleAreaSelect"
|
||||||
|
>
|
||||||
|
<el-option v-for="item in areaList" :label="item.label" :value="item.value" />
|
||||||
|
</el-select>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script lang="ts" setup>
|
||||||
|
//引入cesium基础库
|
||||||
|
import "mars3d-cesium/Build/Cesium/Widgets/widgets.css";
|
||||||
|
import * as Cesium from "mars3d-cesium";
|
||||||
|
//导入mars3d主库
|
||||||
|
import "mars3d/dist/mars3d.css";
|
||||||
|
import * as mars3d from "mars3d";
|
||||||
|
import { ref, watch, onMounted, onUnmounted, computed } from "vue";
|
||||||
|
import { ElMessage } from "element-plus";
|
||||||
|
import { regionData, CodeToText } from "element-china-area-data";
|
||||||
|
const props = defineProps(["mapInstance"]);
|
||||||
|
const emits = defineEmits(["hiddenConfim"]);
|
||||||
|
const address = ref({
|
||||||
|
province: "",
|
||||||
|
city: "",
|
||||||
|
area: ""
|
||||||
|
});
|
||||||
|
let map: any = props.mapInstance;
|
||||||
|
let geoJsonLayer: any;
|
||||||
|
//切换省份函数
|
||||||
|
const handleProvinceSelect = () => {
|
||||||
|
address.value.city = "";
|
||||||
|
address.value.area = "";
|
||||||
|
console.log(regionData);
|
||||||
|
console.log(address.value);
|
||||||
|
geoJsonLayer = new mars3d.layer.GeoJsonLayer({
|
||||||
|
url: `//data.mars3d.cn/file/geojson/areas/${address.value.province}.json`,
|
||||||
|
mask: false, // 标识为遮罩层【重点参数】
|
||||||
|
symbol: {
|
||||||
|
styleOptions: {
|
||||||
|
fill: true,
|
||||||
|
color: "rgb(2,26,79)",
|
||||||
|
opacity: 0.9,
|
||||||
|
outline: true,
|
||||||
|
outlineColor: "#39E09B",
|
||||||
|
outlineWidth: 8,
|
||||||
|
outlineOpacity: 0.8,
|
||||||
|
arcType: Cesium.ArcType.GEODESIC,
|
||||||
|
clampToGround: true
|
||||||
|
}
|
||||||
|
},
|
||||||
|
flyTo: true
|
||||||
|
});
|
||||||
|
map.addLayer(geoJsonLayer);
|
||||||
|
};
|
||||||
|
//切换城市函数
|
||||||
|
const handleCitySelect = () => {
|
||||||
|
address.value.area = "";
|
||||||
|
geoJsonLayer = new mars3d.layer.GeoJsonLayer({
|
||||||
|
url: `//data.mars3d.cn/file/geojson/areas/${address.value.city}.json`,
|
||||||
|
mask: false, // 标识为遮罩层【重点参数】
|
||||||
|
symbol: {
|
||||||
|
styleOptions: {
|
||||||
|
fill: true,
|
||||||
|
color: "rgb(2,26,79)",
|
||||||
|
opacity: 0.9,
|
||||||
|
outline: true,
|
||||||
|
outlineColor: "#39E09B",
|
||||||
|
outlineWidth: 8,
|
||||||
|
outlineOpacity: 0.8,
|
||||||
|
arcType: Cesium.ArcType.GEODESIC,
|
||||||
|
clampToGround: true
|
||||||
|
}
|
||||||
|
},
|
||||||
|
flyTo: true
|
||||||
|
});
|
||||||
|
map.addLayer(geoJsonLayer);
|
||||||
|
};
|
||||||
|
//切换地区函数
|
||||||
|
const handleAreaSelect = () => {
|
||||||
|
geoJsonLayer = new mars3d.layer.GeoJsonLayer({
|
||||||
|
url: `//data.mars3d.cn/file/geojson/areas/${address.value.area}.json`,
|
||||||
|
mask: false, // 标识为遮罩层【重点参数】
|
||||||
|
symbol: {
|
||||||
|
styleOptions: {
|
||||||
|
fill: true,
|
||||||
|
color: "rgb(2,26,79)",
|
||||||
|
opacity: 0.9,
|
||||||
|
outline: true,
|
||||||
|
outlineColor: "#39E09B",
|
||||||
|
outlineWidth: 8,
|
||||||
|
outlineOpacity: 0.8,
|
||||||
|
arcType: Cesium.ArcType.GEODESIC,
|
||||||
|
clampToGround: true
|
||||||
|
}
|
||||||
|
},
|
||||||
|
flyTo: true
|
||||||
|
});
|
||||||
|
map.addLayer(geoJsonLayer);
|
||||||
|
};
|
||||||
|
|
||||||
|
//二级城市列表
|
||||||
|
const cityList = computed(() => {
|
||||||
|
if (!address.value.province) {
|
||||||
|
return [];
|
||||||
|
}
|
||||||
|
let temp = regionData.find((item: any) => {
|
||||||
|
return item.value == address.value.province || item.label == address.value.province;
|
||||||
|
});
|
||||||
|
|
||||||
|
if (!temp) return;
|
||||||
|
return temp.children ? temp.children : [];
|
||||||
|
});
|
||||||
|
//三级地区列表
|
||||||
|
const areaList = computed(() => {
|
||||||
|
if (!address.value.province || !address.value.city) {
|
||||||
|
return [];
|
||||||
|
}
|
||||||
|
if (cityList.value.length == 0) {
|
||||||
|
return [];
|
||||||
|
} else {
|
||||||
|
let temp = cityList.value.find((item: any) => {
|
||||||
|
return item.value == address.value.city || item.label == address.value.city;
|
||||||
|
});
|
||||||
|
|
||||||
|
if (temp) {
|
||||||
|
return temp.children ? temp.children : [];
|
||||||
|
} else {
|
||||||
|
return [];
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
const closeDiv = () => {
|
||||||
|
emits("hiddenConfim");
|
||||||
|
};
|
||||||
|
onMounted(() => {
|
||||||
|
console.log(map, "66666");
|
||||||
|
mars3d.Util.fetchJson({ url: "//data.mars3d.cn/file/geojson/areas/config.json" }).then(data => {
|
||||||
|
console.log(data);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
onUnmounted(() => {
|
||||||
|
map = null;
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
@mixin flex {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
// 菜单弹框出现动画
|
||||||
|
@keyframes fadeIn {
|
||||||
|
0% {
|
||||||
|
opacity: 0;
|
||||||
|
transform: translate3d(100%, 0, 0);
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
opacity: 1;
|
||||||
|
transform: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.main-content {
|
||||||
|
position: absolute;
|
||||||
|
top: 60px;
|
||||||
|
right: 10px;
|
||||||
|
padding-bottom: 10px;
|
||||||
|
background-image: none !important;
|
||||||
|
border: 1px solid #008aff70;
|
||||||
|
border-radius: 2px !important;
|
||||||
|
background-color: rgba(23, 49, 71, 0.8);
|
||||||
|
width: 350px;
|
||||||
|
box-shadow: 0 4px 15px 1px #02213bb3;
|
||||||
|
animation: fadeIn 1s;
|
||||||
|
&-title {
|
||||||
|
@include flex;
|
||||||
|
width: 100%;
|
||||||
|
height: 40px;
|
||||||
|
padding: 0 5px 0 10px;
|
||||||
|
background-color: #173147;
|
||||||
|
span {
|
||||||
|
font-size: 16px;
|
||||||
|
color: #0089fe;
|
||||||
|
margin-right: auto;
|
||||||
|
}
|
||||||
|
:deep() {
|
||||||
|
.el-icon {
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.areabox {
|
||||||
|
.flex-box {
|
||||||
|
@include flex;
|
||||||
|
justify-content: center;
|
||||||
|
margin-top: 10px;
|
||||||
|
> span {
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -81,7 +81,13 @@
|
|||||||
<!-- 图上量算弹框 -->
|
<!-- 图上量算弹框 -->
|
||||||
<MapMeasurement :mapInstance="map" v-if="measurementShow" @hiddenConfim="measurementShow = false" />
|
<MapMeasurement :mapInstance="map" v-if="measurementShow" @hiddenConfim="measurementShow = false" />
|
||||||
<!-- 空间分析弹框 -->
|
<!-- 空间分析弹框 -->
|
||||||
<SpaceAnalysis :mapInstance="map" v-if="analysisShow" @hiddenConfim="analysisShow = false"></SpaceAnalysis>
|
<SpaceAnalysis :mapInstance="map" v-if="analysisShow" @hiddenConfim="analysisShow = false" />
|
||||||
|
<!-- 坐标定位弹框 -->
|
||||||
|
<CoordinatePicking :mapInstance="map" v-if="pickingShow" @hiddenConfim="pickingShow = false" />
|
||||||
|
<!-- 地区导航弹框 -->
|
||||||
|
<RegionalNavigation :mapInstance="map" v-if="regionalNavigationShow" @hiddenConfim="regionalNavigationShow = false" />
|
||||||
|
<!-- 我的标记弹框 -->
|
||||||
|
<MyTags :mapInstance="map" v-if="myTagsShow" @hiddenConfim="myTagsShow = false" />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- <div class="option-list">
|
<!-- <div class="option-list">
|
||||||
@ -188,6 +194,12 @@ import { initVue3Popup } from "@/utils/file-util";
|
|||||||
import QueryPopup from "./components/query-popup.vue";
|
import QueryPopup from "./components/query-popup.vue";
|
||||||
import MapMeasurement from "./components/mapMeasurement.vue";
|
import MapMeasurement from "./components/mapMeasurement.vue";
|
||||||
import SpaceAnalysis from "./components/spaceAnalysis.vue";
|
import SpaceAnalysis from "./components/spaceAnalysis.vue";
|
||||||
|
import CoordinatePicking from "./components/coordinatePicking.vue";
|
||||||
|
import RegionalNavigation from "./components/regionalNavigation.vue";
|
||||||
|
import MyTags from "./components/myTags.vue";
|
||||||
|
const myTagsShow = ref(false); // 我的标记弹框
|
||||||
|
const regionalNavigationShow = ref(false); // 地区导航弹框
|
||||||
|
const pickingShow = ref(false); // 坐标定位弹框
|
||||||
const analysisShow = ref(false); // 空间分析弹框
|
const analysisShow = ref(false); // 空间分析弹框
|
||||||
const measurementShow = ref(false); // 图上量算弹框
|
const measurementShow = ref(false); // 图上量算弹框
|
||||||
const layersShow = ref(false); // 图层弹框
|
const layersShow = ref(false); // 图层弹框
|
||||||
@ -302,10 +314,10 @@ const data = [
|
|||||||
icon: "tool",
|
icon: "tool",
|
||||||
children: [
|
children: [
|
||||||
{ name: "图上量算", icon: "ruler", widget: "measure" },
|
{ name: "图上量算", icon: "ruler", widget: "measure" },
|
||||||
{ name: "空间分析", icon: "analysis", widget: "analysis" }
|
{ name: "空间分析", icon: "analysis", widget: "analysis" },
|
||||||
// { name: "坐标定位", icon: "local", widget: "location-point" }
|
{ name: "坐标定位", icon: "local", widget: "location-point" },
|
||||||
// { name: "地区导航", icon: "navigation", widget: "location-region" },
|
{ name: "地区导航", icon: "navigation", widget: "location-region" },
|
||||||
// { name: "我的标记", icon: "mark", widget: "addmarker" },
|
{ name: "我的标记", icon: "mark", widget: "addmarker" }
|
||||||
// { name: "视角书签", icon: "bookmark", widget: "bookmark" },
|
// { name: "视角书签", icon: "bookmark", widget: "bookmark" },
|
||||||
// { name: "地图打印", icon: "printer", widget: "print" },
|
// { name: "地图打印", icon: "printer", widget: "print" },
|
||||||
// { name: "飞行漫游", icon: "take-off", widget: "roamLine-list" },
|
// { name: "飞行漫游", icon: "take-off", widget: "roamLine-list" },
|
||||||
@ -341,8 +353,13 @@ const clickMenu = (name: any) => {
|
|||||||
if (name == "图上量算") {
|
if (name == "图上量算") {
|
||||||
measurementShow.value = true;
|
measurementShow.value = true;
|
||||||
} else if (name == "空间分析") {
|
} else if (name == "空间分析") {
|
||||||
console.log(666);
|
|
||||||
analysisShow.value = true;
|
analysisShow.value = true;
|
||||||
|
} else if (name == "坐标定位") {
|
||||||
|
pickingShow.value = true;
|
||||||
|
} else if (name == "地区导航") {
|
||||||
|
regionalNavigationShow.value = true;
|
||||||
|
} else if (name == "我的标记") {
|
||||||
|
myTagsShow.value = true;
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
// 获取Canvas对象
|
// 获取Canvas对象
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user