保安服务企业管理项目备份
zhongrj
2024-05-24 f2a74b0b28b74dc29be85ec8e6328bdd262f84b9
src/views/check/components/OlMapBox.vue
@@ -134,7 +134,7 @@
                layers: [],
                view: new OlView({
                    // 初始化中心点坐标,经纬度一会自己换一下
                    center: [113, 24],
                   center: [112.85857823133, 35.496284586473],
                    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;
}