| | |
| | | layers: [], |
| | | view: new OlView({ |
| | | // 初始化中心点坐标,经纬度一会自己换一下 |
| | | center: [113, 24], |
| | | center: [112.85857823133, 35.496284586473], |
| | | zoom: 18, |
| | | projection: "EPSG:4326" |
| | | }), |
| | |
| | | feature.dispatchEvent && feature.dispatchEvent({ type: 'click', event: event }) |
| | | } |
| | | ) |
| | | }) |
| | | |
| | | mapView.getView().on('change:resolution', function () { |
| | | console.log('mapView地图缩放事件') |
| | | // that.$emit('getlivePersonLocationList') |
| | | }) |
| | | |
| | | that.baseInitLayer(that.mapType) |
| | |
| | | if (params.url) { |
| | | styleOptions.image = new Icon({ |
| | | scale: params.scale || 1, |
| | | imgSize: params.imgSize || [160, 221], |
| | | imgSize: params.imgSize || [32, 32], |
| | | src: params.url, |
| | | }) |
| | | } |
| | |
| | | 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 |
| | | }) |
| | | } |
| | | |
| | |
| | | // 添加聚合图层的新模式,水库点分布 |
| | | 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() |
| | |
| | | layersObjcect[layerName] = new VectorLayer({ |
| | | // 图标图层 |
| | | zIndex: 24, |
| | | minZoom: 12, |
| | | // minZoom: 12, |
| | | source: new VectorSource(), |
| | | }) |
| | | } |
| | |
| | | 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 // 缩放持续时间,默认不需要设置 |
| | | }) |
| | | }, |
| | | |
| | | // 生成地图弹窗 |
| | |
| | | padding: 15px; |
| | | border-radius: 10px; |
| | | border: 1px solid #cccccc; |
| | | bottom: 130px; |
| | | left: -114px; |
| | | bottom: 34px; |
| | | left: -46px; |
| | | min-width: 300px; |
| | | } |
| | | |