fix:修改地图图层重叠错乱,

This commit is contained in:
SunTao 2024-12-31 11:43:18 +08:00
parent edb6ab57e7
commit 58d8233875

View File

@ -2,7 +2,7 @@
* @Author: SunTao 328867980@qq.com
* @Date: 2024-10-17 11:34:00
* @LastEditors: SunTao 328867980@qq.com
* @LastEditTime: 2024-12-27 11:39:58
* @LastEditTime: 2024-12-31 11:35:20
* @FilePath: \znxjxt-ui\src\views\big-screen\index.vue
* @Description: 大屏首页
-->
@ -634,6 +634,8 @@ export default {
isCenterCalculated: false,
// 线
defectMapPiont: {},
//
shouldLoadClusters: false,
//
imgTitle: "查看",
@ -846,7 +848,6 @@ export default {
showMapByCompany(val) {
this.companyId = val.id;
this.showMap = true;
// this.overViewMapPoint = [val.lon * 1, val.lat * 1];
this.getLinePoint();
this.changeOrder(this.workOrderType);
},
@ -885,7 +886,7 @@ export default {
map.getView().setCenter(item.tablePoint);
map.getView().setZoom(16);
});
// this.roadSelect = item.segmentId;
this.shouldLoadClusters = false;
this.getCenterPiont();
},
@ -961,6 +962,9 @@ export default {
}
return [];
});
//
//
// if (!this.shouldLoadClusters) {
//
const pointArray = data.map((item) => {
if (item.geometry) {
@ -968,11 +972,9 @@ export default {
}
return [];
});
// console.log(pointArray);
this.fitMapToPoints(pointArray);
//
//
this.drawPoint();
// }
}
});
},
@ -1088,10 +1090,12 @@ export default {
}
},
});
this.$nextTick(() => {
const map = this.$refs.roadMap.instance.get("map");
map.addLayer(this.clusters);
});
if (!this.shouldLoadClusters) {
this.$nextTick(() => {
const map = this.$refs.roadMap.instance.get("map");
map.addLayer(this.clusters);
});
}
},
/**
@ -1099,14 +1103,14 @@ export default {
* @return {void}
*/
getLinePoint() {
if (this.markLayerLines) {
// 线
this.$nextTick(() => {
const map = this.$refs.roadMap.instance.get("map");
map.removeLayer(this.markLayerLines);
this.markLayerLines = null;
});
}
// if (this.markLayerLines) {
// // 线
// this.$nextTick(() => {
// const map = this.$refs.roadMap.instance.get("map");
// map.removeLayer(this.markLayerLines);
// this.markLayerLines = null;
// });
// }
let data = {};
if (this.elementDiv === "OverviewScreen") {
data = {
@ -1165,6 +1169,7 @@ export default {
* @return {void}
*/
drawLine() {
this.shouldLoadClusters = true;
const features = [];
this.lineString.forEach((element) => {
const lines = JSON.parse(element.line).map((it) => {
@ -1206,17 +1211,20 @@ export default {
const lineSource = new VectorSource({
features,
});
this.markLayerLines = new VectorLayer({
source: lineSource,
properties: {
type: "line",
},
});
this.$nextTick(() => {
const map = this.$refs.roadMap.instance.get("map");
map.addLayer(this.markLayerLines);
});
if (!this.markLayerLines) {
this.markLayerLines = new VectorLayer({
source: lineSource,
properties: {
type: "line",
},
});
this.$nextTick(() => {
const map = this.$refs.roadMap.instance.get("map");
map.addLayer(this.markLayerLines);
});
} else {
this.markLayerLines.setSource(lineSource);
}
},
/**
@ -1496,7 +1504,6 @@ export default {
this.$nextTick(() => {
const map = this.$refs.roadMap.instance.get("map");
map.getView().setZoom(10);
map.getView().setCenter([123.30297096718999, 41.87942945541742]);
});
//
this.getIconType();
@ -1507,6 +1514,7 @@ export default {
map.removeLayer(this.markLayerLines);
this.markLayerLines = null;
});
this.shouldLoadClusters = false;
//
this.getCenterPiont();
} else if (item.component === "DiseaseScreen") {