Merge branch 'develop' of http://xearth.cn:6600/r/wuyushui/SewerAndRainNetwork into develop
| | |
| | | module.exports = function () { |
| | | this.init = (layer) => { |
| | | this.init = (L) => { |
| | | console.log('sample init !!!') |
| | | } |
| | | |
| | | this.clickListener = (list) => { |
| | | this.clickListener = (e, data) => { |
| | | console.log('sample clickListener !!!') |
| | | } |
| | | } |
New file |
| | |
| | | /** |
| | | * 废气 |
| | | */ |
| | | const AnimalService = require('../service/AnimalService').default |
| | | const AjaxUtils = require('../../../utils/AjaxUtils').default |
| | | |
| | | module.exports = function () { |
| | | /** |
| | | * 返回marker对象数组 |
| | | * @param L leaflet对象 |
| | | */ |
| | | this.init = (layer, L) => { |
| | | this.animalService = new AnimalService({ L: L, layer: layer }) |
| | | AjaxUtils.get4JsonDataByUrl('http://10.246.162.140:8080/EPInterface/DataService/EPMapService.asmx/ObtainningConInfo', { |
| | | companyId: 3900100145, |
| | | id: '', |
| | | monType: 1, |
| | | userCode: 'wenchun.deng', |
| | | monDuration: '', |
| | | epName: '', |
| | | secdDeptId: '', |
| | | contrLevel: '', |
| | | dataStatus: '', |
| | | dataFlag: '', |
| | | runStatus: '', |
| | | emissTypeId: '' |
| | | }, function (res) { |
| | | const data = res.data.Result.DataInfo |
| | | for (let i = 0; i < data.length; i++) { |
| | | // 经纬度 位置 |
| | | const positionX = data[i].Latitude |
| | | const positionY = data[i].Longitude |
| | | layer.addLayer(L.marker([positionX, positionY], {})) |
| | | } |
| | | }) |
| | | } |
| | | |
| | | this.bindTooltip = (layer) => { |
| | | return '测试废气' |
| | | } |
| | | |
| | | this.clickListener = (e) => { |
| | | console.log(e) |
| | | this.animalService.pulseEffect(e.latlng) |
| | | } |
| | | } |
New file |
| | |
| | | /** |
| | | * 动态效果封装 |
| | | */ |
| | | class AnimalService { |
| | | constructor (config) { |
| | | this.intervals = [] // 定时器列表 |
| | | this.L = config.L |
| | | this.layer = config.layer |
| | | this.times = config.times || 5 |
| | | this.colors = ['#98FB98', '#ff0000'] |
| | | } |
| | | |
| | | /** |
| | | * 脉冲效果 |
| | | */ |
| | | pulseEffect (xy) { |
| | | // 插件 效果实现 |
| | | var pulsingIcon = this.L.icon.pulse({ |
| | | iconSize: [20, 20], |
| | | color: this.colors[0], |
| | | fillColor: '' |
| | | }) |
| | | var picGroupMarker = this.L.marker(xy, { icon: pulsingIcon }).addTo(this.layer) |
| | | var times = this.times |
| | | // 定时 |
| | | var timeInterval = setInterval(() => { |
| | | if (times > 0) { |
| | | times-- |
| | | } else { |
| | | clearInterval(timeInterval) |
| | | picGroupMarker.remove() |
| | | } |
| | | }, 1000) |
| | | } |
| | | } |
| | | |
| | | export default AnimalService |
| | |
| | | init (layer) { |
| | | // 引入 关联的js,在constant.js中根据config配置的id得到处理js |
| | | const id = this.config.code |
| | | console.log(logicMapper) |
| | | const file = logicMapper[id] |
| | | if (!file) { |
| | | console.log('找不到逻辑处理js!!!') |
| | | } else { |
| | | console.log('-----' + file) |
| | | var BusiLayer = require('../logic/' + file) |
| | | console.log(BusiLayer) |
| | | var busiLayer = new BusiLayer() |
| | | // 调用init |
| | | busiLayer.init(layer) |
| | | busiLayer.init(layer, this.L) |
| | | if (busiLayer.bindTooltip) { |
| | | layer.bindTooltip(busiLayer.bindTooltip(layer)) |
| | | } |
| | | // 调用click事件 |
| | | if (busiLayer.clickListener) { |
| | | layer.on('click', busiLayer.clickListener) |
| | | } |
| | | layer.addTo(this.map) |
| | | } |
| | | } |
| | | } |
| | |
| | | import WfsLayerService from './WfsLayerService' |
| | | import BusiLayerService from './BusiLayerService' |
| | | import WmsLayerService from './WmsLayerService' |
| | | |
| | | class LayerFactory { |
| | | constructor (options) { |
| | | this.L = options.L |
| | | this.map = window.map |
| | | this.layers = {} |
| | | } |
| | | |
| | | createLayerGroup () { |
| | | return this.L.layerGroup().addTo(this.map) |
| | | } |
| | | |
| | | init () { |
| | |
| | | var wfs = childConfig.wfs |
| | | var wms = childConfig.wms |
| | | var url = childConfig.url |
| | | // 判断是否已经加载过,加载过就 忽略掉 |
| | | const layer = this.layers[code] |
| | | // 判断是否已经加载过,加载过就 直接得到对象调用 显示函数 |
| | | var layer = this.layers[code] |
| | | if (!layer) { |
| | | const newLayer = this.createLayerGroup() |
| | | this.layers[code] = newLayer |
| | | layer = this.L.featureGroup({}).addTo(this.map) |
| | | // 2. 判断类型 |
| | | if (wfs) { |
| | | // 3. 实例化具体service |
| | | // var busiLayerService = new BusiLayerService() |
| | | // busiLayerService.init() |
| | | var wfsLayerService = new WfsLayerService(childConfig) |
| | | wfsLayerService.init(newLayer) |
| | | wfsLayerService.init(layer) |
| | | } |
| | | if (wms) { |
| | | var wmsLayerService = new WmsLayerService(childConfig) |
| | | wmsLayerService.init(newLayer) |
| | | wmsLayerService.init(layer) |
| | | } |
| | | // 请求业务数据接口 |
| | | if (url) { |
| | | var busiLayerService = new BusiLayerService(childConfig) |
| | | busiLayerService.init(newLayer) |
| | | busiLayerService.init(layer) |
| | | } |
| | | layer ? (this.layers[code] = layer) : console.log('LayerFactory:newLayer is null,please check !!!') |
| | | } else { |
| | | this.show(code) |
| | | } |
| | |
| | | } |
| | | |
| | | /** |
| | | * 设置index,线在最下面,点在上面 |
| | | * @param layerGroup 图层组 |
| | | */ |
| | | * 设置index,线在最下面,点在上面 |
| | | * @param layerGroup 图层组 |
| | | */ |
| | | setZIndex (layerGroup) { |
| | | var layers = layerGroup.getLayers() |
| | | if (layers.length > 0) { |
| | |
| | | } |
| | | |
| | | init (layer) { |
| | | this.layer = layer |
| | | const wfsUrl = this.config.wfs |
| | | if (wfsUrl) { |
| | | AjaxUtils.get4JsonDataByUrl(wfsUrl, this.params, (res) => this.draw(layer, res.data.features)) |
| | | this.loadData(wfsUrl) |
| | | } |
| | | } |
| | | |
| | | draw (layer, features) { |
| | | loadData (wfsUrl) { |
| | | AjaxUtils.get4JsonDataByUrl(wfsUrl, this.params, (res) => this.draw(res.data.features)) |
| | | } |
| | | |
| | | draw (features) { |
| | | const icon = this.config.icon |
| | | const geojson = this.L.geoJSON(features, { |
| | | this.L.geoJSON(features, { |
| | | style: function (feature) { |
| | | return { |
| | | fill: styles.defaultLineStyle.fill, |
| | |
| | | .bindTooltip((layer) => this.tooltipListener(layer), { direction: 'bottom', offset: [0, 15], sticky: true }) |
| | | .on('mouseover', (e) => this.mouseOverListener(e, layer)).on('mouseout', (e) => this.mouseOutListener(e, layer)) |
| | | } |
| | | }).addTo(layer) |
| | | return geojson |
| | | }).addTo(this.layer) |
| | | } |
| | | |
| | | mouseOverListener (e, layer) { |
| | |
| | | class WfsLayerService { |
| | | class WmsLayerService { |
| | | constructor (config) { |
| | | this.config = config |
| | | } |
| | | |
| | | init () { |
| | | init (layer) { |
| | | |
| | | } |
| | | } |
| | | |
| | | export default WfsLayerService |
| | | export default WmsLayerService |
| | |
| | | export const logicMapper = { |
| | | fsqy: 'Sample.js', |
| | | fspfk: 'Sample.js', |
| | | fsjcd: 'Sample.js' |
| | | fsjcd: 'Sample.js', |
| | | wasteGasJcd: 'WasteGas.js' |
| | | } |
| | | |
| | | export const props = { |