fix:大屏整合页面,添加按钮切换,添加根据图层层级打点画线
This commit is contained in:
@@ -2,7 +2,7 @@
|
||||
* @Author: SunTao 328867980@qq.com
|
||||
* @Date: 2024-10-14 10:46:23
|
||||
* @LastEditors: SunTao 328867980@qq.com
|
||||
* @LastEditTime: 2024-10-17 16:51:32
|
||||
* @LastEditTime: 2024-10-23 15:33:10
|
||||
* @FilePath: \znxjxt-ui\src\views\xj\inspection\task-management\components\fssm-map.vue
|
||||
* @Description: 公共地图
|
||||
-->
|
||||
@@ -70,7 +70,7 @@ export default {
|
||||
// 接受传过来得地图层级
|
||||
zoom: {
|
||||
type: String,
|
||||
default: "9",
|
||||
default: "10",
|
||||
},
|
||||
// 是否显示绘图功能
|
||||
showDraw: {
|
||||
@@ -116,6 +116,8 @@ export default {
|
||||
source: new VectorSource(),
|
||||
// 绘制图形保存的点位
|
||||
drawMarkers: [],
|
||||
// 当前地图层级
|
||||
sendZoom: "",
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
@@ -146,7 +148,7 @@ export default {
|
||||
/* 监听传过来的底图类型 */
|
||||
baseMap: {
|
||||
handler(val) {
|
||||
this.changeImg(val)
|
||||
this.changeImg(val);
|
||||
},
|
||||
immediate: true,
|
||||
deep: true,
|
||||
@@ -165,7 +167,7 @@ export default {
|
||||
title: "矢量底图",
|
||||
id: "vec_c",
|
||||
source: new XYZ({
|
||||
url: "http://t{0-7}.tianditu.com/DataServer?x={x}&y={y}&l={z}&T=vec_c&tk=c691040443c68cda625755c5c3e2acc3",
|
||||
url: "http://t{0-7}.tianditu.com/DataServer?x={x}&y={y}&l={z}&T=vec_c&tk=1eb44fae5b9dc454442b322e9a41d233",
|
||||
projection: "EPSG:4326",
|
||||
}),
|
||||
visible: true,
|
||||
@@ -174,7 +176,7 @@ export default {
|
||||
title: "矢量地图",
|
||||
id: "cva_c",
|
||||
source: new XYZ({
|
||||
url: "http://t{0-7}.tianditu.com/DataServer?x={x}&y={y}&l={z}&T=cva_c&tk=c691040443c68cda625755c5c3e2acc3",
|
||||
url: "http://t{0-7}.tianditu.com/DataServer?x={x}&y={y}&l={z}&T=cva_c&tk=1eb44fae5b9dc454442b322e9a41d233",
|
||||
projection: "EPSG:4326",
|
||||
}),
|
||||
visible: true,
|
||||
@@ -183,7 +185,7 @@ export default {
|
||||
title: "影像地图",
|
||||
id: "img_c",
|
||||
source: new XYZ({
|
||||
url: "http://t{0-7}.tianditu.com/DataServer?x={x}&y={y}&l={z}&T=img_c&tk=c691040443c68cda625755c5c3e2acc3",
|
||||
url: "http://t{0-7}.tianditu.com/DataServer?x={x}&y={y}&l={z}&T=img_c&tk=1eb44fae5b9dc454442b322e9a41d233",
|
||||
projection: "EPSG:4326",
|
||||
}),
|
||||
visible: false,
|
||||
@@ -250,6 +252,41 @@ export default {
|
||||
map.getTargetElement().style.cursor = "auto";
|
||||
}
|
||||
});
|
||||
// 图层选择事件
|
||||
let selectSingClick = new Select({ style: null });
|
||||
map.addInteraction(selectSingClick);
|
||||
selectSingClick.on("select", (e) => {
|
||||
this.$emit("feature-select", e);
|
||||
// let selectedFeatures = e.selected;
|
||||
// if (selectedFeatures.length > 0) {
|
||||
// let feature = selectedFeatures[0];
|
||||
// let features = feature.get("features");
|
||||
// console.log(feature.getProperties(),'fff');
|
||||
// if(feature.getProperties().type!=="line"){
|
||||
|
||||
// }
|
||||
// if (features.length === 1) {
|
||||
// // 单个点位
|
||||
// // 执行之前的业务逻辑
|
||||
// // 获取点击的图层信息
|
||||
// const selectFeature = feature.getProperties().features[0];
|
||||
// } else {
|
||||
// // 聚合点
|
||||
// // 放大地图层级
|
||||
// map.getView().animate({
|
||||
// center: feature.getGeometry().getCoordinates(),
|
||||
// zoom: map.getView().getZoom() + 1,
|
||||
// });
|
||||
// }
|
||||
// }
|
||||
});
|
||||
// 图层缩放事件监听
|
||||
map.getView().on("change:resolution", () => {
|
||||
if (this.sendZoom !== map.getView().getZoom().toFixed()) {
|
||||
this.sendZoom = map.getView().getZoom().toFixed();
|
||||
this.$emit("map-zoom", this.sendZoom);
|
||||
}
|
||||
});
|
||||
this.instance.set("map", map);
|
||||
this.instance.set("overlay-list", []);
|
||||
},
|
||||
@@ -459,6 +496,15 @@ export default {
|
||||
map.removeLayer(layer);
|
||||
},
|
||||
|
||||
/* 根据类型清除地图线段图层 */
|
||||
clearMapLine() {
|
||||
const map = this.instance.get("map");
|
||||
const [layer] = map
|
||||
.getAllLayers()
|
||||
.filter((item) => item.get("type") === "line");
|
||||
map.removeLayer(layer);
|
||||
},
|
||||
|
||||
/**
|
||||
* @description: 调整地图缩放等级
|
||||
* @return
|
||||
|
||||
Reference in New Issue
Block a user