飞行标注-全功能完成版

main
滕嵩 2025-07-24 16:57:24 +08:00
parent c92e8c51dc
commit 272241744a
4 changed files with 138 additions and 25 deletions

View File

@ -18,6 +18,7 @@
@setNowShowAnnotationData="setNowShowAnnotationData"
@setAllAnnotationData="setAllAnnotationData"
@deleteAnnotation="deleteAnnotation"
@treeDataShowOrHide="treeDataShowOrHide"
/>
</div>
<!-- 地图 -->
@ -29,6 +30,7 @@
:nowShowAnnotationData="nowShowAnnotationData"
@setNowShowAnnotationData="setNowShowAnnotationData"
@setAllAnnotationData="setAllAnnotationData"
:treeDataShowOrHideList="treeDataShowOrHideList"
/>
</div>
<!-- 地图标注 -->
@ -154,6 +156,12 @@
});
}
//
const treeDataShowOrHideList = ref([]);
function treeDataShowOrHide(value) {
treeDataShowOrHideList.value = value;
}
//
function handlerLocation(position) {
pathMapRef.value.handlerLocation([position.lng, position.lat]);

View File

@ -433,8 +433,8 @@
//
function handlerLocation() {
emits('handlerLocation', {
lng: parseFloat(props.nowShowAnnotationData.coordinates[0]),
lat: parseFloat(props.nowShowAnnotationData.coordinates[1]),
lng: parseFloat(props.nowShowAnnotationData.properties.centerPoint[0]),
lat: parseFloat(props.nowShowAnnotationData.properties.centerPoint[1]),
});
}
//
@ -507,9 +507,6 @@
heightlist.push(item[2]);
});
heightDiff.value = (Math.max(...heightlist) - Math.min(...heightlist)).toFixed(2);
console.log(horizontalArea.value);
console.log(horizontalPerimeter.value);
console.log(heightDiff.value);
}
}
defineExpose({

View File

@ -45,11 +45,19 @@
style="color: #ffffff; font-size: 16px"
/>
</div>
<div
<span
:class="dataRef.mouse ? 'title_mouse' : 'title_nomouse'"
@click="setNowShowAnnotationData(dataRef)"
>
{{ dataRef.title }}
</span>
<div class="buttonSwitch" v-if="dataRef.children">
<a-switch
v-model:checked="dataRef.showOrHide"
checked-children="显示"
un-checked-children="隐藏"
@change="changeWorkSpaceShowOrHide"
/>
</div>
<div class="buttonRight2" v-if="!dataRef.children && dataRef.mouse">
<a-tooltip placement="top">
@ -122,7 +130,9 @@
'setNowShowAnnotationData',
'setAllAnnotationData',
'deleteAnnotation',
'treeDataShowOrHide',
]);
const showMenuInfoName = ref('地图标注');
function updateShowMenuInfoList(type) {
@ -135,10 +145,40 @@
function changeLeftMenuShow() {
emits('changeLeftMenuShow');
}
//
function changeWorkSpaceShowOrHide() {
treeDataShowOrHideList = [];
treeData.value.forEach((tree) => {
treeDataShowOrHideList.push({
id: tree.key,
showOrHide: tree.showOrHide,
});
});
let showIdList: any = [];
treeDataShowOrHideList.map((item) => {
if (item.showOrHide) {
showIdList.push(item.id);
}
});
emits('treeDataShowOrHide', showIdList);
}
//
function getShowOrHide(id) {
if (treeDataShowOrHideList.length > 0) {
const item = treeDataShowOrHideList.find((item) => item.id === id);
return item ? item.showOrHide : true;
} else {
return true;
}
}
// -
const treeData: any = ref([]);
//
let treeDataShowOrHideList: any = [];
//
const expandedKeys: any = ref([]);
//
const searchValue = ref('');
function handleChangeAnnotationSearch() {
treeData.value = [];
@ -150,6 +190,7 @@
treeData.value.push({
key: item.Id,
title: item.WorkspaceName,
showOrHide: getShowOrHide(item.Id),
children: [],
});
});
@ -159,7 +200,6 @@
let allAnnotationDataList = props.allAnnotationDataList.sort((a, b) => {
return dayjs(a.createTime) - dayjs(b.createTime);
});
allAnnotationDataList.forEach((annotation) => {
treeData.value.forEach((tree) => {
if (tree.key == annotation.workSpaceId) {
@ -178,6 +218,7 @@
});
}
}
// -
function deleteAnnotation(show) {
show.deleteClickNum = 0;
@ -219,21 +260,28 @@
//
function handlerLocation(position) {
if (showMenuInfoName.value == '地图标注') {
if (position.geomtype == 'Circle') {
emits('handlerLocation', {
lng: parseFloat(position.coordinates[0]),
lat: parseFloat(position.coordinates[1]),
});
} else {
emits('handlerLocation', {
lng: parseFloat(position.coordinates[0]),
lat: parseFloat(position.coordinates[1]),
});
}
}
emits('handlerLocation', {
lng: parseFloat(position.properties.centerPoint[0]),
lat: parseFloat(position.properties.centerPoint[1]),
});
}
watch(
() => props.nowShowAnnotationData,
() => {
treeData.value.forEach((tree) => {
tree.children?.forEach((t) => {
if (t.id == props.nowShowAnnotationData.id) {
t.title = props.nowShowAnnotationData.name;
}
});
});
},
{
deep: true,
},
);
defineExpose({
updateShowMenuInfoList,
});
@ -288,6 +336,7 @@
.leftMenuContent_tree {
overflow-y: auto;
max-height: 750px;
width: 100%;
}
}
}
@ -305,6 +354,7 @@
gap: 5px;
.eye {
position: relative;
display: flex;
align-items: center;
justify-content: center;
@ -312,20 +362,31 @@
height: 20px;
}
.title_mouse {
position: relative;
width: 135px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.title_nomouse {
position: relative;
width: 170px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.buttonSwitch {
position: absolute;
right: 15px;
display: flex;
align-items: center;
justify-content: center;
width: 60px;
height: 20px;
}
.buttonRight2 {
position: absolute;
right: -15px;
right: 30px;
width: 20px;
height: 20px;
display: flex;
@ -334,7 +395,7 @@
}
.buttonRight1 {
position: absolute;
right: -35px;
right: 5px;
width: 20px;
height: 20px;
display: flex;
@ -363,13 +424,16 @@
::v-deep .ant-tree {
color: #ffffff !important;
}
::v-deep .ant-tree-treenode {
width: 100% !important;
}
::v-deep .ant-tree-node-content-wrapper {
width: 100% !important;
}
::v-deep .ant-tree-switcher {
color: #ffffff !important;
}
::v-deep .ant-tree-node-selected {
background: #25384c !important;
}
//
</style>

View File

@ -174,6 +174,7 @@
'allAnnotationDataList',
'allWorkspaceDataList',
'nowShowAnnotationData',
'treeDataShowOrHideList',
]);
const emits = defineEmits(['setNowShowAnnotationData', 'setAllAnnotationData']);
@ -591,6 +592,41 @@
deep: true,
},
);
watch(
() => props.treeDataShowOrHideList,
() => {
let tempGraphicLayerList = [
//
...annotation_PointGraphicData,
// 线
...annotation_LineStringGraphicData,
//
...annotation_PolygonGraphicData,
//
...annotation_CircleGraphicData,
];
tempGraphicLayerList?.forEach((graphicLayer) => {
if (props.treeDataShowOrHideList.includes(graphicLayer.options.workSpaceId)) {
graphicLayer.setStyle({
show: graphicLayer.options.state == 0 ? true : false,
outline: graphicLayer.options.state == 0 ? true : false,
label: {
show: graphicLayer.options.state == 0 ? true : false,
},
});
} else {
graphicLayer.setStyle({
show: false,
outline: false,
label: {
show: false,
},
});
}
});
},
);
// --
const showAllAnnotationDataList = async () => {
//
@ -693,6 +729,8 @@
},
show: item.state == 0 ? true : false,
hasEdit: true,
state: item.state,
workSpaceId: item.workSpaceId,
});
// mouseover
pointGraphic.on(mars3d.EventType.mouseOver, function () {
@ -773,6 +811,8 @@
show: item.state == 0 ? true : false,
hasEdit: true,
drawShowMeasure: true,
state: item.state,
workSpaceId: item.workSpaceId,
});
// mouseover
lineGraphic.on(mars3d.EventType.mouseOver, function () {
@ -897,6 +937,8 @@
show: item.state == 0 ? true : false,
hasEdit: true,
drawShowMeasure: true,
state: item.state,
workSpaceId: item.workSpaceId,
});
// mouseover
polygonGraphic.on(mars3d.EventType.mouseOver, function () {
@ -1025,6 +1067,8 @@
show: item.state == 0 ? true : false,
hasEdit: true,
drawShowMeasure: true,
state: item.state,
workSpaceId: item.workSpaceId,
});
// mouseover
circleGraphic.on(mars3d.EventType.mouseOver, function () {