From c065531c87e7dc199c7fc4d35e4f6fbedf26167d Mon Sep 17 00:00:00 2001 From: 徐旺旺 <11530253@qq.com> Date: 星期三, 19 五月 2021 15:40:37 +0800 Subject: [PATCH] 定位、弹窗信息、排口查询BUG修复 --- src/components/LayerController/service/WmsLayerService.js | 176 ++++++++++------------------------------------------------ 1 files changed, 32 insertions(+), 144 deletions(-) diff --git a/src/components/LayerController/service/WmsLayerService.js b/src/components/LayerController/service/WmsLayerService.js index 36aba46..df7c090 100644 --- a/src/components/LayerController/service/WmsLayerService.js +++ b/src/components/LayerController/service/WmsLayerService.js @@ -1,7 +1,5 @@ -import AjaxUtils from '../../../utils/AjaxUtils' -import { PIPELINE_WMS } from '../../../conf/Constants' -import Popup from '@views/popup/Popup' -import List from '../../../utils/List' +import { WMS_URL } from '../../../conf/Constants' +import WmsLayerList from '../dataset/WmsLayerList' /** * todo 寰楄�冭檻涓�涓浘灞傞厤缃簡澶氫釜 wmsLayers鐨勬儏鍐� @@ -21,6 +19,7 @@ INFO_FORMAT: 'application/json', TRANSPARENT: true, FEATURE_COUNT: 50, + maxZoom: 21, SRS: 'EPSG:4326', EXCEPTIONS: 'application/vnd.ogc.se_inimage' } @@ -28,164 +27,53 @@ // 瀛樻斁getfeatureinfo鐨勫浘灞傜粍 this.featureGroup = this.L.featureGroup({}).addTo(this.map) - this.layers = new List() - for (var i = 0; i < layersConfig.length; i++) { - const config = layersConfig[i] - const typeName = config.typeName - if (typeName) { - this.layers.add(config.index, typeName) + this.wmsLayerList = new WmsLayerList() + if (layersConfig) { + for (var i = 0; i < layersConfig.length; i++) { + const config = layersConfig[i] + this.wmsLayerList.addConfig(config) } } + this.load() } init () { - if (this.layers) { - this.load(this.layers) - this.clickListener() - } } add (config) { - const typeName = config.typeName - if (typeName) { - if (!this.layers.contains(typeName)) { - this.layers.add(config.index, typeName) - this.wmsLayer.setParams({ layers: this.layers.join(',') }) - } - } + this.wmsLayerList.addConfig(config) + const layers = this.wmsLayerList.getLayers() || '' + const filter = this.wmsLayerList.getFilters() || '' + const params = {} + params.cql_filter = filter + params.layers = layers + this.wmsLayer.setParams(params) } remove (config) { - const typeName = config.typeName - this.layers.remove(typeName) - this.wmsLayer.setParams({ layers: this.layers.join(',') }) + this.wmsLayerList.remove(config.typeName, config.filter) + const layers = this.wmsLayerList.getLayers() || '' + const filter = this.wmsLayerList.getFilters() || '' + const params = { layers: layers } + params.cql_filter = filter + this.wmsLayer.setParams(params) } - load (layers) { - this.wmsLayer = this.L.tileLayer.wms(PIPELINE_WMS, { + load () { + const layers = this.wmsLayerList.getLayers() + const filter = this.wmsLayerList.getFilters() + const params = { format: 'image/png', // 杩斿洖鐨勬暟鎹牸寮� transparent: true, - layers: this.layers.join(',') - }).addTo(this.map) - } - - clickListener () { - window.map.on('click', (e) => { - console.log(e) - this.featureGroup.clearLayers() - var point = this.map.latLngToContainerPoint(e.latlng, this.map.getZoom()) - var size = this.map.getSize() - // const bbox = this.L.latLngBounds(this.L.latLng(e.latlng.lng, e.latlng.lat)).toBBoxString() - - if (this.layers.length() > 0) { - const params = Object.assign({ - LAYERS: this.layers.join(','), - QUERY_LAYERS: this.layers.join(','), - WIDTH: size.x, - HEIGHT: size.y, - X: Math.round(point.x), - Y: Math.round(point.y), - BBOX: this.map.getBounds().toBBoxString() - }, this.params) - AjaxUtils.get4JsonDataByUrl(PIPELINE_WMS, params, (res) => { - const features = res.data.features - /** - * { - * title: 'New Tab', - * name: newTabName, - * content: 'New Tab content' - * } - * @type {*[]} - */ - const popupDatas = [] - if (features) { - for (var i = 0; i < features.length; i++) { - const feature = features[i] - const properties = feature.properties - this.highlight(feature) - // const coordinates = feature.geometry.coordinates - popupDatas.push({ - title: properties.wellname || properties.devicename || properties.name || properties.pipename, - name: feature.id, - content: properties - }) - } - } - if (popupDatas.length > 0) { - var myIcon = this.L.divIcon({ className: 'my-div-icon' }) - this.L.marker(e.latlng, { - icon: myIcon - }).addTo(this.featureGroup)/* - .bindPopup((layer) => { - this.popupComp.setDatas(popupDatas) - this.popupComp.setShow() - return this.popupComp.$el - }, { - className: 's-map-popup', - minWidth: 300, - closeButton: false, - autoClose: false - }) - .openPopup() */ - - if (window.layerFactory.clickSwitch) { - window.$layer.open({ - content: { - content: Popup, // 缁勪欢 - data: { // 浼犻�掔殑鍙傛暟 - datas: popupDatas - } - }, - title: '', // 鏍囬 - left: e.originalEvent.clientX, - top: e.originalEvent.clientY - }) - } - // this.popupComp.setDatas(popupDatas) - // this.popupComp.setShow() - } - }) - } - }) - } - - reverseMultiLine (feature) { - const coordinates = feature.geometry.coordinates - var latlng = [] - for (var j = 0; j < coordinates.length; j++) { - const coordinate = coordinates[j] - var xy = [] - for (var k = 0; k < coordinate.length; k++) { - const coor = coordinate[k] - xy.push(coor.reverse()) - } - latlng.push(xy) + BBOX: this.map.getBounds().toBBoxString() } - return latlng - } - - reversePolyLine (feature) { - const coordinates = feature.geometry.coordinates - var latlng = [] - for (var j = 0; j < coordinates.length; j++) { - const coordinate = coordinates[j] - latlng.push(coordinate.reverse()) + if (layers) { + params.layers = layers } - return latlng - } - - highlight (feature) { - const type = feature.geometry.type - if (type === 'MultiLineString') { - this.L.polyline(this.reverseMultiLine(feature), { color: 'red' }).addTo(this.featureGroup) - } else if (type === 'Point') { - var myIcon = this.L.divIcon({ className: 'my-div-icon' }) - this.L.marker(feature.geometry.coordinates.reverse(), { - icon: myIcon - }).addTo(this.featureGroup) - } else if (type === 'LineString') { - this.L.polyline(this.reversePolyLine(feature), { color: 'red' }).addTo(this.featureGroup) + if (filter.length > 0) { + params.cql_filter = filter } + this.wmsLayer = this.L.tileLayer.wms(WMS_URL, params).addTo(this.map) } } -- Gitblit v1.8.0