New file |
| | |
| | | import { pulseEffect, reversePolyLine } from '../../utils/utils' |
| | | import Popup from '@views/popup/Popup' |
| | | import { LAYERPROPS, LAYERS } from '../../conf/Constants' |
| | | /** |
| | | * 根据传的 feature对象定位, |
| | | * @param code |
| | | * @param feature |
| | | */ |
| | | export const fitBounds = function (feature) { |
| | | const type = feature.geometry.type |
| | | switch (type) { |
| | | case 'Point': |
| | | var point = feature.geometry.coordinates |
| | | point = [point[1], point[0]] |
| | | window.map.setView(point, 17) |
| | | break |
| | | case 'MultiLineString': |
| | | window.map.fitBounds(window.L.geoJSON(feature).getBounds()) |
| | | break |
| | | case 'LineString': |
| | | window.map.fitBounds(window.L.polyline(reversePolyLine(feature)).getBounds()) |
| | | break |
| | | } |
| | | } |
| | | |
| | | export const highlight = function (feature, config) { |
| | | const L = window.L |
| | | const type = feature.geometry.type |
| | | window.mapManager.clearHighlight() |
| | | const highlightLayer = window.mapManager.hightlightLayer |
| | | if (type === 'MultiLineString') { |
| | | L.geoJSON(feature, { |
| | | style: function () { |
| | | return { |
| | | fillColor: 'red', |
| | | color: 'red' |
| | | } |
| | | } |
| | | }).addTo(highlightLayer) |
| | | } else if (type === 'Point') { |
| | | // 叠加一个大尺寸的图标 |
| | | let point = feature.geometry.coordinates |
| | | point = [point[1], point[0]] |
| | | |
| | | if (config) { |
| | | L.marker(point, { |
| | | icon: L.icon({ |
| | | iconUrl: '/assets/images/map/' + config.icon, |
| | | iconSize: [30, 30], |
| | | iconAnchor: [15, 15] |
| | | }) |
| | | }).addTo(highlightLayer) |
| | | } |
| | | pulseEffect(point) |
| | | const features = window.mapManager.loadWfsDatas(point) |
| | | openPopup(point, features) |
| | | } else if (type === 'LineString') { |
| | | L.polyline(reversePolyLine(feature), { color: 'red' }).addTo(highlightLayer) |
| | | } |
| | | } |
| | | |
| | | export const openPopup = function (xy, features) { |
| | | const lt = window.map.latLngToContainerPoint(xy) |
| | | const datas = popupDatas(features) |
| | | if (datas.length > 0) { |
| | | window.$layer.open({ |
| | | content: { |
| | | comp: Popup, // 组件 |
| | | data: { // 传递的参数 |
| | | datas: datas |
| | | } |
| | | }, |
| | | title: '', // 标题 |
| | | left: lt.x, |
| | | top: lt.y |
| | | }) |
| | | } |
| | | } |
| | | |
| | | const popupDatas = function (features) { |
| | | const datas = [] |
| | | if (features) { |
| | | for (var i = 0; i < features.length; i++) { |
| | | const feature = features[i] |
| | | const id = feature.id |
| | | const properties = feature.properties |
| | | const ids = id.split('.') |
| | | |
| | | const propValues = LAYERPROPS[ids[0]] |
| | | const contents = {} |
| | | for (const k in properties) { |
| | | if (propValues[k]) { |
| | | contents[propValues[k]] = properties[k] |
| | | } |
| | | } |
| | | datas.push({ |
| | | title: LAYERS[ids[0]], |
| | | name: feature.id, |
| | | content: contents |
| | | }) |
| | | console.log(properties) |
| | | } |
| | | } |
| | | return datas |
| | | } |
| | | |
| | | export const getLayer = function (layerId, id) { |
| | | const layer = this.layers[layerId] |
| | | |
| | | if (layer) { |
| | | layer.eachLayer(function (layer) { |
| | | const layers = layer.getLayers() |
| | | for (var i = 0; i < layers.length; i++) { |
| | | const lay = layers[i] |
| | | const feature = lay.feature |
| | | if (feature.id === id) { |
| | | return lay |
| | | } |
| | | } |
| | | }) |
| | | } |
| | | return null |
| | | } |