| | |
| | | /** |
| | | * 固废 |
| | | */ |
| | | |
| | | // 区分不同类型 使用不同img |
| | | const defaultImg = '/assets/images/map/solidwaste/voc.png' |
| | | const setting = '/assets/images/map/solidwaste/gf_green.png' |
| | | const setting = '/assets/images/map/solidwaste/gf_green2.png' |
| | | |
| | | // 请求接口数据 |
| | | const mapApi = require('../../../api/mapApi').default |
| | |
| | | var iconUrl = this.differentTypes(judgeValue) |
| | | |
| | | const marker = L.marker([positionX, positionY], { |
| | | test: getSolidWasteData[i], |
| | | totransferData: getSolidWasteData[i], |
| | | icon: L.icon({ |
| | | iconUrl: iconUrl, |
| | | iconSize: [50, 50], |
| | | iconAnchor: [25, 25] |
| | | iconSize: [30, 30], |
| | | iconAnchor: [15, 15] |
| | | }) |
| | | }) |
| | | layer.addLayer(marker) |
| | |
| | | } |
| | | |
| | | this.bindTooltip = (layer) => { |
| | | return layer.options.test.Name |
| | | return layer.options.totransferData.Name |
| | | } |
| | | |
| | | this.clickListener = async (e) => { |
| | | this.clickListener = (e) => { |
| | | // 点击marker的pulse()光波 |
| | | this.animalService.pulseEffect(e.latlng) |
| | | const dataValue = { |
| | | StoragePlaceId: e.layer.options.test.StoragePlaceId |
| | | } |
| | | const result = await mapApi.getSolidWasteBaseInfo(dataValue) |
| | | // console.log(result) |
| | | const PublicBounced = window.Vue.extend(publicBounced) |
| | | const instance = new PublicBounced() |
| | | instance.setData(result, 'gufei') |
| | | instance.$mount() |
| | | document.body.appendChild(instance.$el) |
| | | /* 点击数据的接口请求 */ |
| | | this.requestSolidWasteData(e).then(e) |
| | | } |
| | | |
| | | // 不同类型图片封装 |
| | |
| | | } |
| | | return effectOfChange |
| | | } |
| | | |
| | | // 根据点击不同数据 进行接口的数据请求 |
| | | this.requestSolidWasteData = async (e) => { |
| | | // 基本信息 和 详细信息 展示数据所需参数 |
| | | const dataValue = { |
| | | StoragePlaceId: e.layer.options.totransferData.StoragePlaceId |
| | | } |
| | | // 基本信息 tabs |
| | | const resultBasic = await mapApi.getSolidWasteBaseInfo(dataValue) |
| | | // 详细信息展示 table |
| | | const resultDetailed = await mapApi.getSolidWasteDetail(dataValue) |
| | | |
| | | // 绑定弹框实例 |
| | | const PublicBounced = window.Vue.extend(publicBounced) |
| | | const instance = new PublicBounced() |
| | | instance.$mount() |
| | | document.body.appendChild(instance.$el) |
| | | // 通过方法 向绑定弹框传递数据 |
| | | instance.setData(resultBasic.Result.DataInfo, resultDetailed.Result.DataInfo, 'gufei') |
| | | /* flyTo()弹出框平移事件 */ |
| | | this.setPanTo(e.latlng, 200) |
| | | } |
| | | |
| | | // flayTo() 弹框的可滑动事件 |
| | | this.setPanTo = (pos, value) => { |
| | | var position = pos |
| | | position = window.map.latLngToLayerPoint(position) |
| | | position.y += value |
| | | position = window.map.layerPointToLatLng(position) |
| | | window.map.flyTo(position) |
| | | } |
| | | } |