ghjg-digital-twin/src/utils/map/Layer.js

/**
 * 图层加载工具类
 */
import {onLocationBoat, setBoat} from '@/utils/map/Boat'
import {
    addGraphic,
    addLayer,
    clearMap,
    getMapExtent,
    getMapScale,
    setOpacity,
    setShowDepthPointsState
} from "@/utils/map/ArcgisUtil";
import {setCenter,setSxdxCamera} from '@/utils/map/Common'
import {GetHpjDepthPoints} from '@/apis/hdsj'
import layerConfig from '@/config/layerConfig'

// let layerList = ['cb','mt','jjq','dtq','md','sszh','hb','hd','sxdx','2023.1','2022.1','2022.2','2021.1','2021.2','2020.1','2020.2']
let layerList = []
let depthInterval
let depthParams
// let currentDepthYear
let showDepthPoints = false

let defaultLayerList = [
    {
        // 水上客运
        id: 'waterPassenger',
        title: 'waterPassenger',
        type: 'feature',
        url: layerConfig.waterPassengerLayer,
        visible: false,
        opacity: 1,
        token: '',
        is_goto: false
    },
    {
        // 数字孪生图层
        id: 'digitalTwain',
        title: 'digitalTwain',
        type: 'feature',
        url: layerConfig.digitalTwinLayer,
        visible: false,
        opacity: 1,
        token: '',
        is_goto: false
    },
    {
        // 地图查询图层
        id: 'ghjgCxall',
        title: 'ghjgCxall',
        type: 'shc_map',
        url:layerConfig.ghjgCxAllLayer,
        visible: false,
        opacity: 1,
        token: '',
        is_goto: false
    }
]

export function addDefaultServer(){
    for (let i = 0; i < defaultLayerList.length; i++) {
        let layerObject = defaultLayerList[i];
        addLayer({
            id: layerObject.id,
            title: layerObject.title,
            type: layerObject.type,
            url: layerObject.url,
            visible: layerObject.visible,
            opacity: layerObject.opacity,
            token: layerObject.token,
            is_goto: layerObject.is_goto
        })
    }
}

export function closeAllLayer() {
    for (let i = layerList.length-1; i >=0;i--) {
        addLayerByName(layerList[i],false)
    }
}

export function addLayerByName(name,isShow,opacity){
    // 存储到打开图层列表
    if(isShow){
        let isExist = false
        for(let i = layerList.length-1; i >=0;i--){
            if(layerList[i] == name){
                isExist = true
            }
        }
        if(!isExist){
            layerList.push(name)
        }
    }else{
        for(let i = layerList.length-1; i >=0;i--){
            if(layerList[i] == name){
                layerList.splice(i,1)
            }
        }
    }
    console.log(layerList)

    switch (name) {
        // 船舶
        case 'cb':
            setBoat(isShow)
            break
        // 码头泊位
        case 'mt':
            addLayer({
                id: 'portLayer',
                title: 'portLayer',
                type: 'feature',
                url: layerConfig.digitalTwinLayer+'/0',
                visible: isShow,
                opacity: opacity?opacity:1,
                token: '',
                is_goto: true
            })
            break
        // 警戒区
        case 'jjq':
            addLayer({
                id: 'jjqIconLayer',
                title: 'jjqIconLayer',
                type: 'scene',
                url: layerConfig.jjqIconLayer,
                visible: isShow,
                opacity: opacity?opacity:1,
                token: '',
                is_goto: true
            })
            addLayer({
                id: 'jjqAreaLayer',
                title: 'jjqAreaLayer',
                type: 'feature',
                url: layerConfig.jjqLayer,
                visible: isShow,
                opacity: opacity?opacity:0.5,
                token: '',
                is_goto: true
            })

            break
        // 掉头区
        case 'dtq':
            addLayer({
                id: 'dtqIconLayer',
                title: 'dtqIconLayer',
                type: 'scene',
                url: layerConfig.dtqIconLayer,
                visible: isShow,
                opacity: opacity?opacity:1,
                token: '',
                is_goto: true
            })
            addLayer({
                id: 'dtqAreaLayer',
                title: 'dtqAreaLayer',
                type: 'feature',
                url: layerConfig.dtqLayer,
                visible: isShow,
                opacity: opacity?opacity:0.5,
                token: '',
                is_goto: true
            })
            break
        // 锚地
        case 'md':
            addLayer({
                id: 'mdIconLayer',
                title: 'mdIconLayer',
                type: 'scene',
                url: layerConfig.mdIconLayer,
                visible: isShow,
                opacity: opacity?opacity:1,
                token: '',
                is_goto: true
            })
            addLayer({
                id: 'mdAreaLayer',
                title: 'mdAreaLayer',
                type: 'feature',
                url: layerConfig.mdLayer,
                visible: isShow,
                opacity: opacity?opacity:0.5,
                token: '',
                is_goto: true
            })
            break
        // 水上综合绿色服务器
        case 'sszh':
            addLayer({
                id: 'ssfwqIconLayer',
                title: 'ssfwqIconLayer',
                type: 'scene',
                url: layerConfig.sszhIconLayer,
                visible: isShow,
                opacity: opacity?opacity:1,
                token: '',
                is_goto: true
            })
            addLayer({
                id: 'ssfwqAreaLayer',
                title: 'ssfwqAreaLayer',
                type: 'feature',
                url: layerConfig.sszhLayer,
                visible: isShow,
                opacity: opacity?opacity:0.5,
                token: '',
                is_goto: true
            })
            break
        // 航标
        case 'hb':
            addLayer({
                id: 'hbSceneLayer',
                title: 'hbSceneLayer',
                type: 'scene',
                url: layerConfig.hbLayer,
                visible: isShow,
                opacity: opacity?opacity:1,
                token: '',
                is_goto: true
            })
            break
        // 航道
        case 'hd':
            addLayer({
                id: 'channelLayer',
                title: 'channelLayer',
                type: 'feature',
                url: layerConfig.digitalTwinLayer+'/2',
                visible: isShow,
                opacity: opacity?opacity:1,
                token: '',
                is_goto: true
            })
            break
        // 水下地形
        case 'sxdx':
            addLayer({
                id: 'dbsLayer',
                title: 'dbsLayer',
                type: 'scene',
                url: layerConfig.sxdxLayer202301,
                visible: isShow,
                opacity: opacity?opacity:1,
                token: '',
                is_goto: true
            })
            // if(isShow){
            //     setOpacity(0.4)
            //     setSxdxCamera()
            // }else{
            //     setOpacity(1)
            //     setCenter()
            // }
            break
        case '2023.1':
            addLayer({
                id: 'deepthLayer202301',
                title: 'deepthLayer202301',
                type: 'scene',
                url: layerConfig.sxdxLayer202301,
                visible: isShow,
                opacity: opacity?opacity:1,
                token: '',
                is_goto: true
            })
            break
        case '2023.2':
            addLayer({
                id: 'deepthLayer202302',
                title: 'deepthLayer202302',
                type: 'scene',
                url: layerConfig.sxdxLayer202302,
                visible: isShow,
                opacity: opacity?opacity:1,
                token: '',
                is_goto: true
            })
            break
        case '2022.1':
            addLayer({
                id: 'deepthLayer202201',
                title: 'deepthLayer202201',
                type: 'scene',
                url: layerConfig.sxdxLayer202201,
                visible: isShow,
                opacity: opacity?opacity:1,
                token: '',
                is_goto: false
            })
            break
        case '2022.2':
            addLayer({
                id: 'deepthLayer202202',
                title: 'deepthLayer202202',
                type: 'scene',
                url: layerConfig.sxdxLayer202202,
                visible: isShow,
                opacity: 1,
                token: '',
                is_goto: false
            })
            break
        case '2021.1':
            addLayer({
                id: 'deepthLayer202101',
                title: 'deepthLayer202101',
                type: 'scene',
                url: layerConfig.sxdxLayer202101,
                visible: isShow,
                opacity: 1,
                token: '',
                is_goto: false
            })
            break
        case '2021.2':
            addLayer({
                id: 'deepthLayer202102',
                title: 'deepthLayer202102',
                type: 'scene',
                url: layerConfig.sxdxLayer202202,
                visible: isShow,
                opacity: 1,
                token: '',
                is_goto: false
            })
            break
        case '2020.1':
            addLayer({
                id: 'deepthLayer202001',
                title: 'deepthLayer202001',
                type: 'scene',
                url: layerConfig.sxdxLayer202001,
                visible: isShow,
                opacity: 1,
                token: '',
                is_goto: false
            })
            break
        case '2020.2':
            addLayer({
                id: 'deepthLayer202002',
                title: 'deepthLayer202002',
                type: 'scene',
                url: layerConfig.sxdxLayer202002,
                visible: isShow,
                opacity: 1,
                token: '',
                is_goto: false
            })
            break
        // 两岸白膜
        case 'bm':
            addLayer({
                id: 'hpj500mBuildingLayer',
                title: 'hpj500mBuildingLayer',
                type: 'scene',
                url: layerConfig.labmhPJ500Layer,
                visible: isShow,
                opacity: 1,
                token: '',
                is_goto: false
            })
            addLayer({
                id: 'pxBuildingLayer',
                title: 'pxBuildingLayer',
                type: 'scene',
                url: layerConfig.labmPxLayer,
                visible: isShow,
                opacity: 1,
                token: '',
                is_goto: false
            })
            break
        // 两岸精膜
        case 'jm':
            addLayer({
                id: 'jmBuildingLayer',
                title: 'jmBuildingLayer',
                type: 'scene',
                url: layerConfig.lajmLayer,
                visible: isShow,
                opacity: 1,
                token: '',
                is_goto: false
            })
            break
        // 客运码头
        case 'kymt':
            addLayer({
                id: 'kymtLayer',
                title: 'kymtLayer',
                type: 'scene',
                url: layerConfig.kymtLayer,
                visible: isShow,
                opacity: 1,
                token: '',
                is_goto: false
            })
            break
        // 淤积预警
        case 'yjyj':
            addLayer({
                id: 'yjyjLayer',
                title: 'yjyjLayer',
                type: 'scene',
                url: layerConfig.yjyjLayer202301,
                visible: isShow,
                opacity: opacity?opacity:1,
                token: '',
                is_goto: true
            })
            if(isShow){
                addLayer({
                    id: 'dbsLayer',
                    title: 'dbsLayer',
                    type: 'scene',
                    url: layerConfig.sxdxLayer202301,
                    visible: false,
                    opacity: 1,
                    token: '',
                    is_goto: true
                })
                addLayer({
                    id: 'dbsLayer',
                    title: 'dbsLayer',
                    type: 'scene',
                    url: layerConfig.sxdxLayer202301,
                    visible: true,
                    opacity: 0.4,
                    token: '',
                    is_goto: false
                })
            }else{
                addLayer({
                    id: 'dbsLayer',
                    title: 'dbsLayer',
                    type: 'scene',
                    url: layerConfig.sxdxLayer202301,
                    visible: false,
                    opacity: 1,
                    token: '',
                    is_goto: true
                })
                addLayer({
                    id: 'dbsLayer',
                    title: 'dbsLayer',
                    type: 'scene',
                    url: layerConfig.sxdxLayer202301,
                    visible: true,
                    opacity: 1,
                    token: '',
                    is_goto: false
                })
            }
            break
        // 疏浚前_22年陆家嘴弯道
        case '2022LjzBefore':
            addLayer({
                id: '2022LjzBefore',
                title: '2022LjzBefore',
                type: 'scene',
                url: layerConfig.LjzSjBefore2022,
                visible: isShow,
                opacity: 1,
                token: '',
                is_goto: false
            })
            break
        // 疏浚后_22年陆家嘴弯道
        case '2022LjzAfter':
            addLayer({
                id: '2022LjzAfterLayer',
                title: '2022LjzAfterLayer',
                type: 'scene',
                url: layerConfig.LjzSjAfter2022,
                visible: isShow,
                opacity: 1,
                token: '',
                is_goto: false
            })
            break
        // 危险品码头
        case 'wxpmt':
            addLayer({
                id: 'dangerPortLayer',
                title: 'dangerPortLayer',
                type: 'scene',
                url: layerConfig.wxpmtLayer,
                visible: isShow,
                opacity: opacity?opacity:1,
                token: '',
                elevationInfo: {
                    "mode": "absolute-height",
                    "offset": 0.1
                }
            })
            break
        // 水深剖面
        case 'pm_2020.1':
            addLayer({
                id: 'warterDepthLine2020H1Layer',
                title: 'warterDepthLine2020H1Layer',
                type: 'scene',
                url: layerConfig.dm2020H1Layer,
                visible: isShow,
                opacity: opacity?opacity:1,
                token: ''
            })

            var data = {'distance': 100, 'year': 2020.1}
            if(isShow){
                if(getMapScale() <= 5000) {
                    getDeepthPoints(data)
                }
            }else{
                clearMap({is_draw: true, is_search:true, layers: []})
            }
            setDepthState(data,isShow)
            break
        case 'pm_2020.2':
            addLayer({
                id: 'warterDepthLine2020H2Layer',
                title: 'warterDepthLine2020H2Layer',
                type: 'scene',
                url: layerConfig.dm2020H2Layer,
                visible: isShow,
                opacity: opacity?opacity:1,
                token: ''
            })

            var data = {'distance': 100, 'year': 2020.2}
            if(isShow){
                if(getMapScale() <= 5000) {
                    getDeepthPoints(data)
                }
            }else{
                clearMap({is_draw: true, is_search:true, layers: []})
            }
            setDepthState(data,isShow)
            break
        // 水深剖面
        case 'pm_2021.1':
            addLayer({
                id: 'warterDepthLine2021H1Layer',
                title: 'warterDepthLine2021H1Layer',
                type: 'scene',
                url: layerConfig.dm2021H1Layer,
                visible: isShow,
                opacity: opacity?opacity:1,
                token: ''
            })

            var data = {'distance': 100, 'year': 2021.1}
            if(isShow){
                if(getMapScale() <= 5000) {
                    getDeepthPoints(data)
                }
            }else{
                clearMap({is_draw: true, is_search:true, layers: []})
            }
            setDepthState(data,isShow)
            break
        case 'pm_2021.2':
            addLayer({
                id: 'warterDepthLine2021H2Layer',
                title: 'warterDepthLine2021H2Layer',
                type: 'scene',
                url: layerConfig.dm2021H2Layer,
                visible: isShow,
                opacity: opacity?opacity:1,
                token: ''
            })

            var data = {'distance': 100, 'year': 2021.2}
            if(isShow){
                if(getMapScale() <= 5000) {
                    getDeepthPoints(data)
                }
            }else{
                clearMap({is_draw: true, is_search:true, layers: []})
            }
            setDepthState(data,isShow)
            break
        case 'pm_2022.1':
            addLayer({
                id: 'warterDepthLine2022H1Layer',
                title: 'warterDepthLine2022H1Layer',
                type: 'scene',
                url: layerConfig.dm2022H1Layer,
                visible: isShow,
                opacity: opacity?opacity:1,
                token: ''
            })

            var data = {'distance': 100, 'year': 2022.1}
            if(isShow){
                if(getMapScale() <= 5000) {
                    getDeepthPoints(data)
                }
            }else{
                clearMap({is_draw: true, is_search:true, layers: []})
            }
            setDepthState(data,isShow)
            break
        case 'pm_2022.2':
            addLayer({
                id: 'warterDepthLine2022H2Layer',
                title: 'warterDepthLine2022H2Layer',
                type: 'scene',
                url: layerConfig.dm2022H2Layer,
                visible: isShow,
                opacity: opacity?opacity:1,
                token: ''
            })

            var data = {'distance': 100, 'year': 2022.2}
            if(isShow){
                if(getMapScale() <= 5000) {
                    getDeepthPoints(data)
                }
            }else{
                clearMap({is_draw: true, is_search:true, layers: []})
            }
            setDepthState(data,isShow)
            break
/*        case 'pm_2023.1':
            addLayer({
                id: 'warterDepthLine2023H1Layer',
                title: 'warterDepthLine2023H1Layer',
                type: 'scene',
                url: layerConfig.dm2023H1Layer,
                visible: isShow,
                opacity: opacity?opacity:1,
                token: ''
            })

            var data = {'distance': 100, 'year': 2023.1}
            if(isShow){
                if(getMapScale() <= 5000) {
                    getDeepthPoints(data)
                }
            }else{
                clearMap({is_draw: true, is_search:true, layers: []})
            }
            setDepthState(data,isShow)
            break*/
        case 'pm_2023.2':
            addLayer({
                id: 'warterDepthLine2023H2Layer',
                title: 'warterDepthLine2023H2Layer',
                type: 'scene',
                url: layerConfig.dm2023H2Layer,
                visible: isShow,
                opacity: opacity?opacity:1,
                token: ''
            })

            var data = {'distance': 100, 'year': 2023.2}
            if(isShow){
                if(getMapScale() <= 5000) {
                    getDeepthPoints(data)
                }
            }else{
                clearMap({is_draw: true, is_search:true, layers: []})
            }
            setDepthState(data,isShow)
            break
    }
}

export function refreshDepthPoints(){
    if(getMapScale() <= 5000 && showDepthPoints) {
        getDeepthPoints(depthParams)
    }else{
        clearMap({is_draw: false, is_search:true, layers: []})
    }
}
function getDeepthPoints(data){
    // if(data != null && data.year === currentDepthYear){
    //     return
    // }
    // currentDepthYear = data.year
    let extent = getMapExtent()
    data.maxX = extent.xmax + 200
    data.minX = extent.xmin - 200
    data.maxY = extent.ymax + 200
    data.minY = extent.ymin - 200
    GetHpjDepthPoints(data).then(res=>{
        if(res.code == '200'){
            if(res.data.Rows != null && res.data.Rows.length > 0){
                let rows = res.data.Rows
                let dataList = []
                for(let i=0;i<rows.length;i++){
                    let linePoints = rows[i]
                    if(linePoints.length > 0){
                        for(let j=0;j<linePoints.length;j++){
                            if(linePoints[j].depth == null){
                                continue
                            }
                            let point = {
                                x: linePoints[j].pointX,
                                y: linePoints[j].pointY,
                                z: linePoints[j].pointZ * 10,
                                text: linePoints[j].depth
                            }
                            dataList.push(point)
                        }
                    }
                }
                addGraphic({
                    "type": 'points',
                    "is_edit": false,
                    "is_clear": true,
                    "is_temp": false,
                    "is_goto": false,
                    "data": dataList,
                    "attributes": null,
                    "symbol": {
                        type: "simple-marker",
                        style: "circle",
                        color: [255, 255, 255],
                        size: 5
                    },
                    "title": null
                })
            }else{
                this.$message({
                    type: 'error',
                    message: '未查询到水深点数据！'
                })
            }
        }else{
            this.$message({
                type: 'error',
                message: '查询水深点数据失败！'
            })
            console.log(res.msg)
        }
    })
}

function setDepthState(data,state){
    setShowDepthPointsState(state)
    showDepthPoints = state
    if(state){
        depthParams = data
    }
    else{
        depthParams = null
    }
}