hi-ucs/front/src/supermap/map-showResource.js

/**
 * @Author: tiansiyuan
 * @Date: 2021/2/20 13:12:56
 * @LastEditors: tiansiyuan
 * @LastEditTime: 2021/2/20 17:57:34
 * @Description: 资源上图方法
 */

import { createDefaultFeatureStyle, createDefaultDivIcon } from './map-utils'
import './js/bouncemarker'
import './pulse/L.Icon.Pulse'
import { wgs84LL2bdLL } from '../utils/coordinateSystemTransform'
import mybus from '@/myplugins/mybus'
const L = window.L || {}
const shinningMarker = null
const SuperMap = window.SuperMap || {}
const restoreIconObj = {
    layerId: 0,
    restoreIcon: null,
    currentLayer: null,
}
const progress = document.getElementById('progress')
const progressBar = document.getElementById('progress-bar')

function updateProgressBar(processed, total, elapsed, layersArray) {
    if (elapsed > 1000) {
        // if it takes more than a second to load, display the progress bar:
        progress.style.display = 'block'
        progressBar.style.width = Math.round((processed / total) * 100) + '%'
    }

    if (processed === total) {
        // all markers processed - hide the progress bar:
        progress.style.display = 'none'
    }
}
/**
 * 构造图标聚合图层
 * @param layerClassName 据此判断是否需要自定义聚合图层的样式
 * @returns {*}
 */
function createMarkerClusterLayer(layerClassName, mapObj) {
    let array = [];
    let markerClusterLayer = null
    if (layerClassName) {
        // 如果存在类名，表示需要自定义图标
        markerClusterLayer = L.markerClusterGroup({
            iconCreateFunction(cluster) {
                const markers = cluster.getAllChildMarkers()
                let n = 0
                for (let i = 0; i < markers.length; i++) {
                    n += markers[i].number
                }
                return L.divIcon({ html: markers.length, className: layerClassName })
            },
            // 是否允许指定 PolylineOptions 样式 spider
            // spiderfyOnMaxZoom: true,
            // 是否显示标记的边界
            showCoverageOnHover: true,
            // 是否点击展开
            zoomToBoundsOnClick: true,
            chunkProgress: updateProgressBar,
            chunkedLoading: true,
            maxClusterRadius: 80,
        })
    } else {
        // 使用默认图标
        markerClusterLayer = L.markerClusterGroup({
            spiderfyOnMaxZoom: false,
            // 是否显示标记的边界
            showCoverageOnHover: true,
            // 是否点击展开
            zoomToBoundsOnClick: true,
            maxClusterRadius: 80,
        })
        markerClusterLayer.on('clusterclick', function(a) {
            let clusterList = [];
            if (mapObj.getZoom() == mapObj.getMaxZoom()) {
                for (var i = 0; i < a.layer.getAllChildMarkers().length; i++) {
                    clusterList.push(a.layer.getAllChildMarkers()[i].resourceData);
                }
                    mybus.emit('openOperationPopup', clusterList);
            }
        });
    }
    return markerClusterLayer
}

/**
 * 数据处理方法，每次只处理1000条数据，让其他事件循环有机会执行
 * @param data 要处理的数据
 * @param doChunk 处理数据的函数
 * @param chunkCompleted 数据处理完以后执行的函数
 */
function chunkData(data, doChunk, chunkCompleted) {
    const chunk = data.splice(0, 1000)
    doChunk(chunk)
    if (data.length > 0) {
        setTimeout(() => {
            chunkData(data, doChunk, chunkCompleted)
        }, 0)
    } else {
        chunkCompleted()
    }
}

/**
 * 把单个点位添加到地图上
 * @param feature 添加到地图上的要素（必要），例 feature: {lat: 36.45876415, lon: 120.354862157}
 * @param iconSize 图标尺寸，如果不传参，则使用默认值
 * @param iconUrl 图标路径，如果不传参，则使用默认值
 * @param isCustomIcon 是否自定义div图标
 * @param iconHtml 自定义图标的div内容
 * @param iconClassName 自定义图标的样式类名
 * @param featurePopupInfo 要素的弹窗信息，例：featurePopupInfo: {entityData, layerConfigInfo, allMapObject}
 * @param createPopupFun 创建要素弹窗的方法
 * @param popupClassName 弹窗的样式类名
 * @param isOpenPopup 是否立即打开弹窗
 * @param mapObj
 * @param featureGroup
 * @param layerGroup
 * @return {*|void} layer对象，可以直接用map的removeLayer删除
 */
function addPointOnMap({
        feature,
        iconSize = [48, 48],
        iconUrl = 'poi.png',
        isCustomIcon = '',
        iconHtml = '',
        iconClassName = '',
        featurePopupInfo = null,
        createPopupFun = null,
        popupClassName = 'multi-general-popup-style',
        isOpenPopup = '',
        coordinateSystemFlag = false,
    } = {},
    mapObj,
    featureGroup,
    layerGroup
) {
    // 创造点位marker
    let icon = null
        // 区分是否是自定义div图标
    if (isCustomIcon) {
        iconHtml = iconHtml || createDefaultDivIcon()
        icon = createDefaultFeatureStyle({ img: iconUrl, iconSize: iconSize },
            iconHtml,
            iconClassName
        )
    } else {
        icon = createDefaultFeatureStyle({ img: iconUrl, iconSize: iconSize })
    }
    // 当前为百度09墨卡托，上图前进行坐标转换
    console.log('当前坐标', feature)
        // if (!coordinateSystemFlag) {
        //   const bdLonLat = wgs84LL2bdLL(feature.lon, feature.lat);
        //   feature.lon = bdLonLat[0];
        //   feature.lat = bdLonLat[1];
        //   console.log('转换之后的坐标', feature);
        // }
    const marker = L.marker([feature.lat, feature.lon], {
        icon: icon,
        attribution: feature.attributes,
    })
    let elementHtml = null
        // 如果featurePopInfo不为null，则说明需要弹窗，如果为null，则说明不需要弹窗，则不添加点击事件
    if (featurePopupInfo !== null) {
        featurePopupInfo.allMapObject = {
            mapObj: mapObj,
        }
        elementHtml = createPopupFun(featurePopupInfo)
        marker.on('click', (e) => {
            const location = [e.latlng.lat, e.latlng.lng]
            const latLng = L.latLng(location)
            L.popup({ className: popupClassName })
                .setLatLng(latLng)
                .setContent(elementHtml)
                .openOn(mapObj.map)
        })
    }
    const layer = marker.addTo(mapObj.map);
    featureGroup.addLayer(layer)
    layerGroup.set('potcon', layer)
        // marker
        // .addTo(mapObj.map)
        // .bindPopup(elementHtml, { className: popupClassName })
        // .openPopup() :
        // marker.addTo(mapObj.map)
}

/**
 * 构建promise，使用uuid去超图服务查询features，得到结果就把promise状态置为已决议，并返回features
 * @param idArray 资源的唯一标识数组，视频监控是camera_index_code，其他都是uuid
 * @param layerConfigInfo 图层配置信息
 * @param type 资源类型，视频监控需传值，其他资源不传值即可，只有视频监控用的camera_index_code，其他都是uuid
 * @returns {Promise<any>}
 * @private
 */
function createPromiseByQueryService(idArray = [], layerConfigInfo, type = '') {
    const queryUrl = _mapConfig.config.QUERY_URL
        // 构造查询条件authorityFilter
    let authorityFilter = ''
    if (idArray.length === 0) {
        // id数组为空，则默认去超图查询全部点位数据
        authorityFilter = 'SMID > 0'
    } else if (idArray.length <= 1000) {
        const authorityFilter1 = "'" + idArray.join("','") + "'"
        authorityFilter = type ?
            `CAMERA_INDEX_CODE in (${authorityFilter1})` :
            `UUID in (${authorityFilter1})`
    } else {
        // 当UUID的个数大于1000
        const count = Math.floor(idArray.length / 1000) // 向下取整
            // 这里分开处理，如果数据量很大时，可以节省时间
        if (type) {
            for (let i = 0; i <= count; i++) {
                const indexCodeSplice = idArray.slice(i * 1000, (i + 1) * 1000)
                const authorityFilterString = "'" + indexCodeSplice.join("','") + "'"
                const authorityFilterSplice = `CAMERA_INDEX_CODE in (${authorityFilterString})`
                authorityFilter =
                    i === 0 ?
                    authorityFilterSplice :
                    `${authorityFilter} or ${authorityFilterSplice}`
            }
        } else {
            for (let i = 0; i <= count; i++) {
                const indexCodeSplice = idArray.slice(i * 1000, (i + 1) * 1000)
                const authorityFilterString = "'" + indexCodeSplice.join("','") + "'"
                const authorityFilterSplice = `UUID in (${authorityFilterString})`
                authorityFilter =
                    i === 0 ?
                    authorityFilterSplice :
                    `${authorityFilter} or ${authorityFilterSplice}`
            }
        }
    }

    // 构造查询参数，用于去iServer查询
    console.log('查询条件', authorityFilter)
    const getFeatureBySQLParams = new SuperMap.QueryBySQLParameters({
            queryParams: {
                name: layerConfigInfo.layerName,
                attributeFilter: authorityFilter,
            },
        })
        // 将查询结果储存在promise中，返回这个promise
    return new Promise((resolve, reject) => {
        L.supermap
            .queryService(queryUrl)
            .queryBySQL(getFeatureBySQLParams, (serviceResult) => {
                // debugger;
                try {
                    const features = serviceResult.result.recordsets[0].features.features
                    resolve(features)
                } catch (e) {
                    reject(e)
                }
            })
    })
}
/**
 * @description: 新的资源上图
 * @param {*}
 * @return {*}
 */
function addResourceOnMapNew(
    features,
    layerConfig,
    getLayerPopupInfo,
    createPopupFun,
    mapObj,
    featureGroup,
    layerGroup
) {
    // 如果资源要素数量为0，则说明该种资源没有记录
    if (features.length < 1) {
        return Promise.resolve(0)
    }

    // 创建图层
    let layers = null
        // 判断是否是聚合图层
    layers = layerConfig.cluster.flag ?
        createMarkerClusterLayer(layerConfig.cluster.clusterName) : []

    // 该promise用于将资源要素聚合图层添加到地图上，添加完毕之后，把状态置为已决议
    return new Promise((resolve) => {
        const doChunk = (chunk) => {
            // 循环构造要素点位，并给每个要素点位绑定点击事件，添加弹窗
            chunk.forEach((feature, index) => {
                let icon = null
                icon = createDefaultFeatureStyle(layerConfig)
                restoreIconObj.restoreIcon = icon
                if (feature.latLng.lng) {
                    const marker = L.marker(feature.latLng, { icon })
                        // 如果getLayerPopupInfo和createPopupFun不为null，则说明需要弹窗，否则不需要弹窗
                        // if (true) {
                    marker.uuid = feature.uuid
                    marker.layerConfigInfo = layerConfig
                        // 小型水库没有点击事件
                        // if (feature.size !== 0) {
                    marker.on('click', async(e) => {
                            console.log('图标点击e', e)
                            const uuid = e.sourceTarget.uuid
                            const type = layerConfig.resType
                            const layerConfigInfo = e.sourceTarget.layerConfigInfo
                            const latLng = L.latLng([e.latlng.lat, e.latlng.lng])
                            myGetLayerPopupInfo(
                                uuid,
                                layerConfigInfo,
                                type,
                                mapObj,
                                latLng,
                                createPopupFun,
                                getLayerPopupInfo,
                                layerConfigInfo.popupClassName
                            )
                        })
                        // }
                        // }
                        // 将该点位添加到聚合图层中
                    layers.addLayer(marker)
                }
            })
        }

        // 当要素点位数据处理完成后，将聚合图层添加到layerGroup中，并将promise的状态置为已决议
        const chunkCompleted = () => {
            featureGroup.addLayer(layers)
            layerGroup.set(layerConfig.superMapLayerName, layers)
            resolve(1)
        }

        // 分块处理要素点位，当要素数量非常大时，不至于页面卡死
        chunkData(features, doChunk, chunkCompleted)
    })
}
/**
 * 资源上图通用方法
 * @param features 资源要素
 * @param layerName 图层名称
 * @param layerConfigInfo 图层配置信息
 * @param isClusterLayer 是否是聚合图层
 * @param getLayerPopupInfo 获取弹窗信息的函数
 * @param layerClassName 聚合图层样式类名
 * @param popupClassName 弹窗样式类名
 * @param createPopupFun 生成弹窗的方法
 * @param createDivIconFun 创建自定义图标的方法
 * @param clickReplaceIcon 选中marker之后是否需要更换图标
 * @param replaceIconUrl 选中marker之后要更换图标路径
 * @param replaceIconSize 选中marker之后要更换图标尺寸
 * @param mapObj
 * @param featureGroup
 * @param layerGroup
 * @return {*}
 * @private
 */
function addResourceOnMap({
        features,
        layerName,
        layerConfigInfo,
        isClusterLayer = '',
        getLayerPopupInfo = null,
        layerClassName = '',
        popupClassName = '',
        createPopupFun = null,
        createDivIconFun = null,
        clickReplaceIcon = '',
        replaceIconUrl = '/src/supermap/image/poi.png',
        replaceIconSize = [44, 44],
    } = {},
    mapObj,
    featureGroup,
    layerGroup
) {
    //  debugger;
    console.log('上图数据', layerClassName)
        // 如果资源要素数量为0，则说明该种资源没有记录
    if (features.length < 1) {
        return Promise.resolve(0)
    }

    // 创建图层
    let layers = null
        // 判断是否是聚合图层
    layers = isClusterLayer ? createMarkerClusterLayer(layerClassName) : []

    // 该promise用于将资源要素聚合图层添加到地图上，添加完毕之后，把状态置为已决议
    return new Promise((resolve) => {
        const doChunk = (chunk) => {
            // 循环构造要素点位，并给每个要素点位绑定点击事件，添加弹窗
            chunk.forEach((feature, index) => {
                let icon = null
                if (createDivIconFun !== null) {
                    const { iconSize, contentHTML, className } = createDivIconFun(
                        feature,
                        index
                    )
                    icon = L.divIcon({
                        iconSize: iconSize,
                        html: contentHTML,
                        className: className,
                    })
                } else {
                    icon = createDefaultFeatureStyle(layerConfigInfo)
                }
                if (feature.size) {
                    switch (feature.size) {
                        case 0:
                            icon = createDefaultFeatureStyle({
                                img: 'reservoir_small.png',
                            })
                            break
                        case 1:
                            icon = createDefaultFeatureStyle({
                                img: 'reservoir_middle.png',
                            })
                            break
                        case 2:
                            icon = createDefaultFeatureStyle({
                                img: 'reservoir_big.png',
                            })
                            break
                    }
                }
                restoreIconObj.restoreIcon = icon
                    // 当前地图为百度09墨卡托坐标系，在此处进行坐标转换
                    // const bdLonLat = wgs84LL2bdLL(feature.latLng[1], feature.latLng[0]);
                    // feature.latLng[1] = bdLonLat[0];
                    // feature.latLng[0] = bdLonLat[1];
                const marker = L.marker(feature.latLng, { icon })
                    // 如果getLayerPopupInfo和createPopupFun不为null，则说明需要弹窗，否则不需要弹窗
                if (getLayerPopupInfo !== null && createPopupFun !== null) {
                    marker.resId = feature.resId
                    marker.layerConfigInfo = layerConfigInfo
                    marker.on('click', async(e) => {
                        console.log('图标点击e', e)
                            // 判断是否需要选中之后更换marker的图标
                        if (clickReplaceIcon) {
                            // 先把之前选中的图标切换回来
                            // const previousLayer = layerGroup.get(layerName).getLayer(restoreIconObj.layerId);
                            // if (previousLayer) {
                            //   previousLayer.setIcon(icon);
                            // }
                            const layers = layerGroup.get(layerName).getLayers()
                            layers.forEach((layer) => {
                                layer.setIcon(icon)
                            })
                            restoreIconObj.layerId = e.sourceTarget._leaflet_id
                            const currentLayer = layerGroup
                                .get(layerName)
                                .getLayer(restoreIconObj.layerId)
                            restoreIconObj.currentLayer = currentLayer
                            if (currentLayer) {
                                currentLayer.setIcon(
                                    L.icon({ iconUrl: replaceIconUrl, iconSize: replaceIconSize })
                                )
                            }
                        }
                        // 使用uuid获取弹窗详情并构造弹窗
                        const resId = e.sourceTarget.resId
                        let type = null
                            // 根据layerName1 传递不同的 resourceType
                        switch (e.sourceTarget.layerConfigInfo.layerName1) {
                            // 直升机起降点
                            case 'f_helicopter':
                                type = 'resourceHelicopter'
                                break
                                // 物资储备库
                            case 'f_repository':
                                type = 'resourceStorage'
                                break
                                // 应急队伍
                            case 'YJPT_SM_ARMY':
                                type = 'resourceTeam'
                                break
                            case 'f_team':
                                type = 'resourceTeam'
                                break
                                // 危险源
                            case 'YJPT_SM_HAZARD':
                                type = 'resourceDanger'
                                break
                                // 水源地
                            case 'f_water_source':
                                type = 'resourceProtection'
                                break
                                // 检查站
                            case 'f_check_station':
                                type = 'resourceProtection'
                                break
                                // 墓地
                            case 'f_cemetery':
                                type = 'resourceProtection'
                                break
                                // 瞭望塔
                            case 'f_watch_tower':
                                type = 'resourceProtection'
                                break
                            case 'YJPT_SM_SHELTER':
                                type = 'resourceShelter'
                                break
                            case 'YJPT_SM_STORAGE':
                                type = 'resourceStorage'
                                break
                            default:
                                break
                        }
                        const layerConfigInfo = e.sourceTarget.layerConfigInfo
                        const latLng = L.latLng([e.latlng.lat, e.latlng.lng])
                            // debugger;
                        myGetLayerPopupInfo(
                            resId,
                            layerConfigInfo,
                            type,
                            mapObj,
                            latLng,
                            createPopupFun,
                            getLayerPopupInfo,
                            popupClassName
                        )
                    })
                }
                // 将该点位添加到聚合图层中
                layers.addLayer(marker)
            })
        }

        // 当要素点位数据处理完成后，将聚合图层添加到layerGroup中，并将promise的状态置为已决议
        const chunkCompleted = () => {
            console.log(featureGroup)
            featureGroup.addLayer(layers)
            layerGroup.set(layerName, layers)
            resolve(1)
        }

        // 分块处理要素点位，当要素数量非常大时，不至于页面卡死
        chunkData(features, doChunk, chunkCompleted)
    })
}
// 根据类型返回具体用聚合图层的样式。
function typeToStyle(layerName) {
    let returnStyle = null
    const typeToImg = {
        fireForest: 'multi-marker-cluster-resource-protection',
        fireRoad: 'multi-marker-cluster-resource-protection',
        fireBreak2: 'multi-marker-cluster-resource-protection',
        fireBreak1: 'multi-marker-cluster-resource-protection',

        fireWater4: 'multi-marker-cluster-resource-protection',
        fireWater3: 'multi-marker-cluster-resource-protection',
        fireWater5: 'multi-marker-cluster-resource-protection',
        fireWater6: 'multi-marker-cluster-resource-protection',

        airLine1: 'topic-marker-cluster-video',
        airLine2: 'topic-marker-cluster-video',
        airLine3: 'topic-marker-cluster-video',

        fireMonitor7: 'topic-marker-cluster-video',
        fireMonitor8: 'topic-marker-cluster-video',
        fireMonitor9: 'topic-marker-cluster-video',
        fireMonitor10: 'topic-marker-cluster-video',

        fireRisk2: 'topic-marker-cluster-risk-area',
        fireRisk3: 'topic-marker-cluster-risk-area',
        fireRisk4: 'topic-marker-cluster-risk-area',
        fireRisk1: 'topic-marker-cluster-risk-area',

        fireTeam: 'topic-marker-cluster-team',
        fireStorage: 'topic-marker-cluster-mine',
    }
    returnStyle = typeToImg[layerName]
    if (typeof returnStyle === 'undefined') {
        returnStyle = 'multi-marker-cluster-resource-protection'
    }
    return returnStyle
}
// 无聚合上图 =》阳性人员路径
function addResourceOnMapWithoutSuperMap(
    features,
    url,
    lastOne,
    createPopupFun,
    DS,
    featureGroup,
    layerGroup,
    map
) {
    // 如果资源要素数量为0，则说明该种资源没有记录
    // if (features.length < 1) {
    //   return Promise.resolve(0);
    // }
    // 根据类型返回具体用聚合图层的样式。
    // const defaultStyle = typeToStyle(layerName)
    // 创建图层
    const layers = []
    const numArr = [
            '①',
            '②',
            '③',
            '④',
            '⑤',
            '⑥',
            '⑦',
            '⑧',
            '⑨',
            '⑩',
            '⑪',
            '⑫',
            '⑬',
            '⑭',
            '⑮',
            '⑯',
            '⑰',
            '⑱',
            '⑲',
            '⑳',
            '㉑',
            '㉒',
            '㉓',
            '㉔',
            '㉕',
            '㉖',
            '㉗',
            '㉘',
            '㉙',
            '㉚',
            '㉛',
            '㉜',
            '㉝',
            '㉞',
            '㉟',
            '㊱',
            '㊲',
            '㊳',
            '㊴',
            '㊵',
            '㊶',
            '㊷',
            '㊸',
            '㊹',
            '㊺',
            '㊻',
            '㊼',
            '㊽',
            '㊾',
            '㊿',
        ]
        // 判断是否是聚合图层
        // layers = createMarkerClusterLayer(defaultStyle)
    const icon = createDefaultFeatureStyle({
        img: url || 'the-head.png',
        iconSize: [36, 36],
    })
    const arr = []
    features.map((feature, index) => {
            // console.log("看看有没有坐标",feature.latLng);
            if (feature.hasOwnProperty('latLng')) {
                const marker = L.marker(feature.latLng, { icon })
                    // marker.zjmc = feature.zjmc
                marker.bindTooltip(
                    '<p style="display:flex;align-items:center"><span style="color: red; font-size: 28px;font-weight: 700 margin-bottom: 2px">' +
                    numArr[index] +
                    '</span><span>' +
                    feature.traveladdress +
                    '(' +
                    feature.count +
                    '次)</span></p>', {
                        permanent: true,
                    }
                )
                L.tooltipLayout.resetMarker(marker)
                if (createPopupFun !== null) {
                    marker.on('click', async(e) => {
                        const elementHtml = createPopupFun(feature)
                        if (elementHtml) {
                            L.popup({
                                    className: 'epidemic-address',
                                    keepInView: true,
                                    maxHeight: 300,
                                })
                                .setLatLng(feature.latLng)
                                .setContent(elementHtml)
                                .openOn(map)
                        }
                    })
                }
                layers.push(marker)
                    // 处理bounds数据
                arr.push([feature.latLng.lat, feature.latLng.lng])
            }
        })
        // 适配地图
    var polyline = L.polyline(arr)
    if (lastOne) {
        // map.fitBounds(polyline.getBounds())
    } else {
        map.flyTo(features[features.length - 1].latLng, 8)
    }
    var myGroup = L.layerGroup(layers)
    featureGroup.addLayer(myGroup)
        // featureGroup.addLayer(layers)
        // console.log('上图的layerName', layerName,layerGroup);
        // L.layerGroup.addLayer(layers)
}
// 道路污染治理专题-点位上图
function addPointsToMap(
    features,
    url,
    lastOne,
    createPopupFun,
    DS,
    featureGroup,
    layerGroup,
    map
) {
    // 如果资源要素数量为0，则说明该种资源没有记录
    // if (features.length < 1) {
    //   return Promise.resolve(0);
    // }
    // 根据类型返回具体用聚合图层的样式。
    // const defaultStyle = typeToStyle(layerName)
    // 创建图层
    const layers = []
        // 判断是否是聚合图层
        // layers = createMarkerClusterLayer(defaultStyle)
    const icon = createDefaultFeatureStyle({
        img: url || 'the-head.png',
        iconSize: [36, 36],
    })
    const arr = []
    features.map((feature, index) => {
            // console.log("看看有没有坐标",feature.latLng);
            if (feature.hasOwnProperty('latLng')) {
                const marker = L.marker(feature.latLng, { icon })
                    // marker.zjmc = feature.zjmc
                    // marker.bindTooltip('<p style="display:flex;align-items:center"><span style="color: red; font-size: 28px;font-weight: 700 margin-bottom: 2px">' + index + '</span><span>' +
                    // feature.traveladdress + '(' + feature.count + '次)</span></p>'
                    // , {
                    //   permanent: true
                    // })
                    // L.tooltipLayout.resetMarker(marker)
                if (createPopupFun !== null) {
                    marker.on('click', async(e) => {
                        const elementHtml = createPopupFun(feature)
                        if (elementHtml) {
                            if (feature.type == 'road') {
                                L.popup({ className: 'roadGovernance-popup', keepInView: true })
                                    .setLatLng(feature.latLng)
                                    .setContent(elementHtml)
                                    .openOn(map)
                            } else {
                                L.popup({
                                        className: 'epidemic-address',
                                        keepInView: true,
                                        maxHeight: 300,
                                    })
                                    .setLatLng(feature.latLng)
                                    .setContent(elementHtml)
                                    .openOn(map)
                            }
                        }
                    })
                }
                layers.push(marker)
                    // 处理bounds数据
                arr.push([feature.latLng.lat, feature.latLng.lng])
            }
        })
        // 适配地图
    var polyline = L.polyline(arr)
    if (lastOne) {
        // map.fitBounds(polyline.getBounds())
    } else {
        map.flyTo(features[features.length - 1].latLng, 8)
    }
    var myGroup = L.layerGroup(layers)
    featureGroup.addLayer(myGroup)
    layerGroup.set(lastOne, myGroup)
        // featureGroup.addLayer(layers)
        // console.log('上图的layerName', layerName,layerGroup);
        // L.layerGroup.addLayer(layers)
}
/**
 * 资源上图通用方法 -> 不走超图服务
 * @param features 资源要素
 * @param layerName 图层名称
 * @param layerConfigInfo 图层配置信息
 * @param isClusterLayer 是否是聚合图层
 * @param getLayerPopupInfo 获取弹窗信息的函数
 * @param layerClassName 聚合图层样式类名
 * @param popupClassName 弹窗样式类名
 * @param createPopupFun 生成弹窗的方法
 * @param createDivIconFun 创建自定义图标的方法
 * @param clickReplaceIcon 选中marker之后是否需要更换图标
 * @param replaceIconUrl 选中marker之后要更换图标路径
 * @param replaceIconSize 选中marker之后要更换图标尺寸
 * @param mapObj
 * @param featureGroup
 * @param layerGroup
 * @return {*}
 * @private
 */
function addResourceOnMapWithoutSuper({
        features,
        layerName,
        layerConfigInfo,
        isClusterLayer = '',
        getLayerPopupInfo = null,
        layerClassName = '',
        popupClassName = '',
        createPopupFun = null,
        createDivIconFun = null,
        clickReplaceIcon = '',
        replaceIconUrl = '/src/supermap/image/poi.png',
        replaceIconSize = [44, 44],
    } = {},
    mapObj,
    featureGroup,
    layerGroup
) {
    console.log('features', features)
        // 如果资源要素数量为0，则说明该种资源没有记录
    if (features.length < 1) {
        return Promise.resolve(0)
    }

    // 创建图层
    let layers = null
        // 判断是否是聚合图层
    layers = isClusterLayer ? createMarkerClusterLayer(layerClassName) : []

    // 该promise用于将资源要素聚合图层添加到地图上，添加完毕之后，把状态置为已决议
    return new Promise((resolve) => {
        const doChunk = (chunk) => {
            // 循环构造要素点位，并给每个要素点位绑定点击事件，添加弹窗
            chunk.forEach((feature, index) => {
                let icon = null
                    // 水库大中小图标
                if (feature.size) {
                    switch (feature.size) {
                        case 0:
                            layerConfigInfo.img = 'reservoir_small.png'
                            break
                        case 1:
                            layerConfigInfo.img = 'reservoir_middle.png'
                            break
                        case 2:
                            layerConfigInfo.img = 'reservoir_big.png'
                            break
                    }
                }
                if (createDivIconFun !== null) {
                    const { iconSize, contentHTML, className } = createDivIconFun(
                        feature,
                        index
                    )
                    icon = L.divIcon({
                        iconSize: iconSize,
                        html: contentHTML,
                        className: className,
                    })
                } else {
                    icon = createDefaultFeatureStyle(layerConfigInfo)
                }
                restoreIconObj.restoreIcon = icon
                    // 当前地图为百度09墨卡托坐标系，在此处进行坐标转换
                const bdLonLat = wgs84LL2bdLL(
                    feature.latLng[1] || feature.latLng.lng,
                    feature.latLng[0] || feature.latLng.lat
                )
                feature.latLng = []
                feature.latLng[1] = bdLonLat[0]
                feature.latLng[0] = bdLonLat[1]
                    // debugger;
                const marker = L.marker(feature.latLng, { icon })
                    // 如果getLayerPopupInfo和createPopupFun不为null，则说明需要弹窗，否则不需要弹窗
                if (getLayerPopupInfo !== null && createPopupFun !== null) {
                    marker.uuid = feature.uuid || ''
                    marker.resId = feature.resId || ''
                    marker.layerConfigInfo = layerConfigInfo
                    marker.on('click', async(e) => {
                        // 判断是否需要选中之后更换marker的图标
                        if (clickReplaceIcon) {
                            const layers = layerGroup.get(layerName).getLayers()
                            layers.forEach((layer) => {
                                layer.setIcon(icon)
                            })
                            restoreIconObj.layerId = e.sourceTarget._leaflet_id
                            const currentLayer = layerGroup
                                .get(layerName)
                                .getLayer(restoreIconObj.layerId)
                            restoreIconObj.currentLayer = currentLayer
                            if (currentLayer) {
                                currentLayer.setIcon(
                                    L.icon({ iconUrl: replaceIconUrl, iconSize: replaceIconSize })
                                )
                            }
                        }
                        // 使用uuid获取弹窗详情并构造弹窗
                        const uuid = e.sourceTarget.uuid
                        const resId = e.sourceTarget.resId
                        let resourceType = null
                            // 根据layerName1 传递不同的 resourceType
                        switch (e.sourceTarget.layerConfigInfo.layerName1) {
                            // 避难场所
                            case 'wf_shelter':
                                resourceType = 'resourceShelter'
                                break
                                // 应急物资
                            case 'wf_storage':
                                resourceType = 'resourceStorage'
                                break
                                // 应急队伍
                            case 'wf_team':
                                resourceType = 'resourceTeam'
                                break
                                // 危险源
                            case 'wf_danger':
                                resourceType = 'resourceDanger'
                                break
                            case 'wf_protection':
                                resourceType = 'resourceProtection'
                                break
                            default:
                                resourceType =
                                    e.sourceTarget.layerConfigInfo.resourceType ||
                                    'resourceProtection'
                                break
                        }

                        const latLng = L.latLng([e.latlng.lat, e.latlng.lng])
                        const response = await getLayerPopupInfo(
                            uuid,
                            layerConfigInfo,
                            resourceType,
                            resId
                        )
                        response.allMapObject = {
                            mapObj: mapObj,
                        }
                        response.layerConfigInfo = layerConfigInfo
                        console.log(response)
                        const elementHtml = createPopupFun(response)
                        if (elementHtml) {
                            L.popup({ className: popupClassName })
                                .setLatLng(latLng)
                                .setContent(elementHtml)
                                .openOn(mapObj.map)
                        }
                    })
                }
                // 将该点位添加到聚合图层中
                layers.addLayer(marker)
                    // marker.addTo(mapObj.map);
            })
        }

        // 当要素点位数据处理完成后，将聚合图层添加到layerGroup中，并将promise的状态置为已决议
        const chunkCompleted = () => {
            // debugger;
            featureGroup.addLayer(layers)
            layerGroup.set(layerName, layers)
            resolve(1)
        }

        // 分块处理要素点位，当要素数量非常大时，不至于页面卡死
        chunkData(features, doChunk, chunkCompleted)
    })
}
async function myGetLayerPopupInfo(
    resId,
    layerConfigInfo,
    type,
    mapObj,
    latLng,
    createPopupFun,
    getLayerPopupInfo,
    popupClassName
) {
    const response = await getLayerPopupInfo(resId, layerConfigInfo, type)
        // debugger;
    console.log(response)
    if (!response) return
    response.allMapObject = {
        mapObj: mapObj,
    }
    const elementHtml = createPopupFun(response)
    L.popup({ className: popupClassName })
        .setLatLng(latLng)
        .setContent(elementHtml)
        .openOn(mapObj.map)
}
export {
    // 复原的图标
    restoreIconObj,
    // 添加单个点位到地图上
    addPointOnMap,
    // 使用uuid集合去超图服务查询资源要素，得到结果就把promise状态置为已决议，并返回features
    createPromiseByQueryService,
    // 资源上图通用方法
    addResourceOnMap,
    // 创建聚合图层
    createMarkerClusterLayer,
    // 创建资源弹窗
    myGetLayerPopupInfo,
    // 头顶库临时
    addResourceOnMapWithoutSuperMap,
    addResourceOnMapWithoutSuper,
    addResourceOnMapNew,
    addPointsToMap,
}