From f70e132f88dc93fc7b590aad56eb1f409dfd64d5 Mon Sep 17 00:00:00 2001 From: YANGDL <114714267@qq.com> Date: 星期四, 04 三月 2021 09:50:25 +0800 Subject: [PATCH] 修改管网先over样式 --- src/components/helpers/ServiceLayerHelper.js | 67 ++++++++++++++++++++++++--------- 1 files changed, 49 insertions(+), 18 deletions(-) diff --git a/src/components/helpers/ServiceLayerHelper.js b/src/components/helpers/ServiceLayerHelper.js index 96ad647..83e8a86 100644 --- a/src/components/helpers/ServiceLayerHelper.js +++ b/src/components/helpers/ServiceLayerHelper.js @@ -4,6 +4,7 @@ */ import AjaxUtils from '@/utils/AjaxUtils' import store from '@/store' +import styles from '@/conf/Styles' class ServiceLayerHelper { constructor (options) { @@ -17,6 +18,7 @@ this.geojsonArray = {} // 鍒濆鐨刧eojson闆� this.layerConfig = {} this.regex = /\{(.+?)\}/g // 鍖归厤{} + this.popupComp = null } getTileLayer (code) { @@ -26,10 +28,11 @@ /** * 鏍规嵁閰嶇疆鏂囦欢鍒濆鍖栦笟鍔″簳鍥� */ - initServiceLayers (layerConfig) { + initServiceLayers (layerConfig, popupComp) { this.layerConfig = layerConfig + this.popupComp = popupComp this.loadLayers(layerConfig.mapConfig.Layers.LayerSewersLine) - // this.loadLayers(layerConfig.mapConfig.Layers.layerSewersPoint) + this.loadLayers(layerConfig.mapConfig.Layers.layerSewersPoint) } /** @@ -68,6 +71,11 @@ } } + /** + * 璇锋眰wfs鏁版嵁 + * @param url + * @param item + */ loadGeojsonLayer (url, item) { var matches = this.regex.exec(url) var matchValue = item[matches[1]] @@ -84,24 +92,24 @@ } /** - * 鍔犺浇鐐规暟鎹� - * @param res - */ - loadGeojson (res, layer) { + * 鍔犺浇gis server杩斿洖鐨刧eoson鏁版嵁鍒板湴鍥句腑灞曠ず + * @param res + */ + loadGeojson (res, opt) { var that = this - var icon = layer.icon + var icon = opt.icon const featureGroup = that.L.featureGroup().addTo(that.map) - that.L.geoJSON(res.features, { + const geojson = that.L.geoJSON(res.features, { style: function (feature) { return { - fill: true, - weight: 2, - fillColor: '#06cccc', - color: '#06cccc', - fillOpacity: 0.2, - opacity: 0.8, - dashArray: '10,4', - dashSpeed: -10 + fill: styles.defaultLineStyle.fill, + weight: styles.defaultLineStyle.weight, + fillColor: styles.defaultLineStyle.fillColor, + color: styles.defaultLineStyle.color, + fillOpacity: styles.defaultLineStyle.fillOpacity, + opacity: styles.defaultLineStyle.opacity + // dashArray: styles.defaultLineStyle.dashArray, + // dashSpeed: styles.defaultLineStyle.dashSpeed } }, pointToLayer: function (geoJsonPoint, latlng) { @@ -111,12 +119,35 @@ img: { // url: 'assets/images/map/marker-icon.png', url: '/assets/images/map/' + icon, - size: [20, 20] + size: styles.defaultLineStyle.size } }) } }).bindPopup(function (layer) { - }).addTo(featureGroup).bringToFront() + that.popupComp.setDatas(layer) + that.popupComp.setShow() + return that.popupComp.$el + }, { + className: 's-map-popup', + minWidth: 300, + closeButton: false, + autoClose: false + }).bindTooltip(function (layer) { + console.log(layer) + return layer.feature.properties.name + }).on('mouseover', function (e) { + console.log(e) + var layer = e.layer + layer.setStyle({ weight: 8, color: '#00ffff' }) + }).on('mouseout', function (e) { + var layer = e.layer + layer.setStyle({ weight: styles.defaultLineStyle.weight, color: styles.defaultLineStyle.color }) + }).addTo(featureGroup).tooltip() + if (Object.prototype.hasOwnProperty.call(res, 'features') && res.features.length > 0 && (res.features[0].geometry.type === 'LineString' || res.features[0].geometry.type === 'MultiLineString')) { + geojson.bringToBack() + } else { + geojson.bringToFront() + } return featureGroup } -- Gitblit v1.8.0