From 3520f4b5ea6fefd3b84b7d0e76ef92efe4a56ea8 Mon Sep 17 00:00:00 2001
From: guoshilong <123456>
Date: Mon, 15 Jan 2024 10:28:43 +0800
Subject: [PATCH] 派遣服务页面调整
---
src/views/check/components/OlMapBox.vue | 35 +++++++++++++++++++++--------------
1 files changed, 21 insertions(+), 14 deletions(-)
diff --git a/src/views/check/components/OlMapBox.vue b/src/views/check/components/OlMapBox.vue
index add9d6b..1f2e38a 100644
--- a/src/views/check/components/OlMapBox.vue
+++ b/src/views/check/components/OlMapBox.vue
@@ -134,7 +134,7 @@
layers: [],
view: new OlView({
// 初始化中心点坐标,经纬度一会自己换一下
- center: [113, 24],
+ center: [114.89844546788195, 25.861142035590277],
zoom: 18,
projection: "EPSG:4326"
}),
@@ -147,6 +147,11 @@
feature.dispatchEvent && feature.dispatchEvent({ type: 'click', event: event })
}
)
+ })
+
+ mapView.getView().on('change:resolution', function () {
+ console.log('mapView地图缩放事件')
+ // that.$emit('getlivePersonLocationList')
})
that.baseInitLayer(that.mapType)
@@ -252,7 +257,7 @@
if (params.url) {
styleOptions.image = new Icon({
scale: params.scale || 1,
- imgSize: params.imgSize || [160, 221],
+ imgSize: params.imgSize || [32, 32],
src: params.url,
})
}
@@ -278,7 +283,9 @@
color: color
}),
padding: [2, 5, 2, 5],
- stroke: new Stroke({ color: '#00000000', width: 1 })
+ stroke: new Stroke({ color: '#00000000', width: 1 }),
+ // offsetX: -60,
+ offsetY: 30
})
}
@@ -318,7 +325,7 @@
// 添加聚合图层的新模式,水库点分布
mapAddClusterLayer (layerName, imgUrl, positionData, incident = (e) => { }, type = '') {
const that = this
-
+ console.log(layersObjcect, layerName, positionData, "+++++++++++++")
if (!layersObjcect[layerName]) {
if (type == 'cluster') {
let source = new VectorSource()
@@ -384,7 +391,7 @@
layersObjcect[layerName] = new VectorLayer({
// 图标图层
zIndex: 24,
- minZoom: 12,
+ // minZoom: 12,
source: new VectorSource(),
})
}
@@ -397,17 +404,17 @@
item,
lng: item.lng,
lat: item.lat,
+ text: item.realName,
url: imgUrl,
event: incident
}))
- mapView.getView().animate({ // 只设置需要的属性即可
- center: [item.lng, item.lat], // 中心点
- zoom: 18, // 缩放级别
- rotation: undefined, // 缩放完成view视图旋转弧度
- duration: 1000 // 缩放持续时间,默认不需要设置
- })
})
-
+ mapView.getView().animate({ // 只设置需要的属性即可
+ center: [positionData[0].lng, positionData[0].lat], // 中心点
+ // zoom: 18, // 缩放级别
+ rotation: undefined, // 缩放完成view视图旋转弧度
+ // duration: 1000 // 缩放持续时间,默认不需要设置
+ })
},
// 生成地图弹窗
@@ -459,8 +466,8 @@
padding: 15px;
border-radius: 10px;
border: 1px solid #cccccc;
- bottom: 130px;
- left: -114px;
+ bottom: 34px;
+ left: -46px;
min-width: 300px;
}
--
Gitblit v1.9.3