class EventEmitter {
    constructor(events) {
        this.events = {
        }
        this.initEvents = {

            drawUpdate: function () {

            },
            ...events
        }
        this.initEventsFn()
    }
    initEventsFn() {
        const obj = Object.keys(this.initEvents)
        obj.map(res => {
            this.on(res, this.initEvents[res])
        })
    }
    // 订阅事件
    /**
      * 地图初始化
      * @method on
      * @function on
      * @param {String} event 事件名称
      * @param {Function} listener 监听器
      */
    on(event, listener) {
        if (!this.events[event]) {
            this.events[event] = []
        }
        this.events[event].push(listener)
    }

    // 发射事件
    /**
      * 地图初始化
      * @method emit
      * @function emit
      * @param {String} event 事件名称
      * @param {Object} data 事件数据
      */
    emit(event, data) {
        if (this.events[event]) {
            // 调用所有订阅了该事件的监听器
            this.events[event].forEach(listener => {
                listener(data)
            })
        }
    }

    // 一次性订阅事件
    once(event, listener) {
        const onceListener = (...args) => {
            listener(...args)
            this.off(event, onceListener)
        }
        this.on(event, onceListener)
    }

    // 取消订阅事件
    off(event, listener) {
        if (event in this.events) {
            const listeners = this.events[event]
            const index = listeners.indexOf(listener)
            if (index !== -1) {
                listeners.splice(index, 1)
            }
        }
    }

    // 发射一次事件
    emitOnce(event, data) {
        const onceListener = (...args) => {
            this.emit(event, ...args)
            this.off(event, onceListener)
        }
        this.once(event, onceListener)
        this.emit(event, data)
    }
}

window.MapEvent = new EventEmitter()
// import EventEmitter from './EventEmitter.js'
// import { _drawCircle, _drawRect, _drawCircle1, _drawClustering, addClusterToArr, showClusterLayer, addClusterLayer } from './canvasDraw.js'
// const SuperGif = require('./libgif.js')
class HttpClient {
    get(url) {
        return fetch(url, {
            method: 'GET'
        })
    }

    post(url, data) {
        return fetch(url, {
            method: 'POST',
            body: JSON.stringify(data),
            headers: {
                'Content-Type': 'application/json'
            }
        })
    }

    getJSON(url, callback) {
        fetch(url, {
            method: 'GET'
        }).then(response => response.json()).then(response => {
            typeof callback === 'function' && callback(response)
        })
    }
}
const http = new HttpClient()
class GisClass extends EventEmitter {
    constructor(mapIframe, event) {
        super(event)
        this.mapIframe = mapIframe
        this.PointArr = null
        this.bufferDistance = 1 // 缓存距离
        this.dataName = [{
            name: '点',
            value: '0'
        },
        {
            name: '线面',
            value: '1'
        },
        {
            name: '绘图',
            value: '2'
        },
        {
            name: '测量',
            value: '3'
        },
        {
            name: '框选',
            value: '4'
        },
        {
            name: '缓冲分析',
            value: '5'
        },
        {
            name: '图层操作',
            value: '6'
        },
        {
            name: '轨迹',
            value: '7'
        }
        ]
        // 发射事件
        setTimeout(() => {
            this.emit('mapLoaded', 2222)
        }, 1000)
    }
    // 基础类的核心功能

    static plugins = [];

    // 插件注册方法
    static use(plugin, ...options) {
        if (typeof plugin.install === 'function') {
            plugin.install(this, ...options)
            this.plugins.push(plugin)
        } else {
            throw new Error('Plugin must implement an install method.')
        }
    }
    // 可以在这里调用已注册插件的生命周期钩子或其他方法
    callPluginsHook(hookName, ...args) {
        this.plugins.forEach((plugin) => {
            if (typeof plugin[hookName] === 'function') {
                plugin[hookName](this, ...args)
            }
        })
    }

    tracingBillboard() {
        const style = {
            imgUrl: '/img/markerbig_select.png',
            isLayerClear: true,
            removeClick: false,
            pixelOffset: {
                'x': 0,
                'y': -20
            }
        }
        this.mapIframe.Plug.tracingBillboard(style, (ex) => {
            this.emit('tracingBillboard_ex', ex)
        }, (e) => {
            this.mapIframe.Plug.popUpStyleBillboard(e.lng, e.lat, '测试弹窗', '<div>描点点击</div>', 200)

            this.emit('tracingBillboard_e', e)
        })
    }

    showPoints() {
        const style = {
            pixelOffset: {
                'x': 0,
                'y': -20
            }
        }
        this.PointArr = this.generatePosition(200, 2)
        this.mapIframe.Plug.showPoints(this.PointArr, style, (e) => {
            this.mapIframe.Plug.popUpStyleBillboard(e.lng, e.lat, 'Point弹窗', '<div>点击了图标</div>', 0)

            this.emit('showPoints_e', e)
        })
    }

    showBillboards(PointArr = [], style = {}, callBack) {
        this.PointArr = PointArr || this.generatePosition(200, 2)
        this.mapIframe.Plug.showBillboards(this.PointArr, {
            ...style
        }, callBack)
    }

    showBillboards3() {
        this.PointArr = this.generatePosition(200, 2)
        this.mapIframe.Plug.showBillboards(this.PointArr, {}, (e) => {
            this.mapIframe.Plug.popUpStyleBillboard(e.lng, e.lat, 'Billboard弹窗', '<div>点击了Billboard图标</div>', 0)
        })
        this.PointArr.forEach((ite, index) => {
            ite.label = '111'
        })
        this.mapIframe.Plug.showCircles(this.PointArr, {
            radius: 200,
            material: this.mapIframe.Plug.getMaterial('CircleWaveMaterialProperty', {
                color: this.mapIframe.Cesium.Color.fromCssColorString('#ff0000'),
                count: 2,
                gradient: 1,
                speed: 6.0 // 扩散速度
            })
        },
            (e) => {
                this.mapIframe.Plug.popUpStyleBillboard(e.lng, e.lat, 'Circle弹窗', '<div>点击了扩散圆</div>', 0)
            })
    }

    showfzBillboards() {
        const style = {
            imgUrl: './img/fault.gif',
            imgWidth: 35,
            imgHeight: 35
        }
        this.PointArr = this.generatePosition(50, 2)

        this.superGifBillboards(this.PointArr, style, (e) => {
            this.mapIframe.Plug.popUpStyleBillboard(e.lng, e.lat, 'Gif弹窗', '<div>点击了图标</div>', 0)
        })
    }

    superGifBillboards(PointArr, style, callback) {
        var div = document.createElement('div')
        var img = document.createElement('img')
        div.appendChild(img)
        img.setAttribute('src', '')
        const self = this
        img.onload = function () {
            var superGif = new SuperGif({
                gif: img
            })
            superGif.load(function () {
                self.mapIframe.Plug.showBillboards(self.PointArr, {
                    ...style,
                    ...{
                        imgUrl: new self.mapIframe.Cesium.CallbackProperty((time, e) => {
                            return superGif.get_canvas().toDataURL('image/png')
                        }, false)
                    }
                }, callback)
            })
        }
        img.setAttribute('src', style.imgUrl)
    }

    showfzBillboards1() {
        const style = {
            imgUrl: './img/fault.gif',
            imgWidth: 35,
            imgHeight: 35
        }
        this.PointArr = this.generatePosition(200, 2)
        this.mapIframe.Plug.showClusterBillboards(this.PointArr, style, (e) => {
            this.mapIframe.Plug.popUpStyleBillboard(e.lng, e.lat, 'ClusterBillboard弹窗',
                '<div>点击了ClusterBillboard图标</div>', 0)
        })
    }

    showBillboards2() {
        this.PointArr = this.generatePosition(5, 4)
        this.PointArr.forEach((ite, index) => {
            ite.label = '文本'
        })
        this.mapIframe.Plug.showBillboards(this.PointArr, {
            showLabel: true,
            labelStyle: {
                'height': 0,
                'font': '18px sans-serif', // CSS 字体设置
                'showBackground': true, // 是否显示背景
                'backgroundColor': this.mapIframe.Cesium.Color.fromCssColorString('#09e5ff').withAlpha(0.4), // 背景颜色
                'fillColor': this.mapIframe.Cesium.Color.fromCssColorString('#ffffff'), // 文字颜色
                'outlineColor': this.mapIframe.Cesium.Color.fromCssColorString('#ff0000'), // 边框颜色
                'outlineWidth': 5, // 边框大小
                'pixelOffset': {
                    'x': 0,
                    'y': -35
                } // 偏移像素
            }
        }, (e) => {
            this.mapIframe.Plug.popUpStyleBillboard(e.lng, e.lat, 'Billboard弹窗', '<div>点击了Billboard图标</div>', 0)
        })
    }

    showBillboards1() {
        this.PointArr = this.generatePosition(200, 2)
        showhtml(this.PointArr)
        this.mapIframe.Plug.showBillboards(this.PointArr, {}, (e) => {
            this.mapIframe.Plug.updataOverlay(e.id, {
                imgUrl: './img/start.png'
            })
            this.mapIframe.Plug.popUpStyleBillboard(e.lng, e.lat, 'Billboard弹窗', '<div>点击了Billboard图标</div>', 0)
        })
    }

    showhtml(PointArr) {
        let listdiv = '<ul>'
        this.PointArr.forEach((ite, index) => {
            if (index > 10) {
                return
            }
            listdiv += '<li onclick=aaaa(' + ite.id + ')>' + ite.id + '</li>'
        })
        listdiv += '</ul>'
        $('#list0').html(listdiv)
        $('#list0').show()
    }

    aaaa(id) {
        this.mapIframe.Plug.updataOverlay(id, {
            imgUrl: './img/start.png',
            oldReplace: false,
            imgWidth: 50,
            imgHeight: 80
        })
    }

    showLabels() {
        this.PointArr = this.generatePosition(200, 2)
        this.PointArr.forEach((ite, index) => {
            ite.label = '文本'
        })
        const style = {
            'height': 0,
            'font': '18px sans-serif', // CSS 字体设置
            'showBackground': true, // 是否显示背景
            'backgroundColor': this.mapIframe.Cesium.Color.fromCssColorString('#09e5ff').withAlpha(0.4), // 背景颜色
            'fillColor': this.mapIframe.Cesium.Color.fromCssColorString('#ffffff'), // 文字颜色
            'outlineColor': this.mapIframe.Cesium.Color.fromCssColorString('#ff0000'), // 边框颜色
            'outlineWidth': 0,
            'style': this.mapIframe.Cesium.LabelStyle.FILL_AND_OUTLINE
        }
        this.mapIframe.Plug.showLabels(this.PointArr, style, (e) => {
            this.mapIframe.Plug.popUpStyleBillboard(e.lng, e.lat, 'Label弹窗', '<div>点击了Label图标</div>', 0)
        })
    }

    addDivIcons() {
        const style = {
            imgUrl: './img/fault.gif',
            imgWidth: 35,
            imgHeight: 35
        }
        this.PointArr = this.generatePosition(200, 2)
        this.superGifBillboards(this.PointArr, style, (e) => {
            this.mapIframe.Plug.popUpStyleBillboard(e.lng, e.lat, 'Gif弹窗', '<div>点击了图标</div>', 0)
        })
        this.PointArr.forEach((ite, index) => {
            ite.html = '<div>文本</div>'
        })
        this.mapIframe.Plug.showDivIcons(this.PointArr, {
            'className': 'aaa'
        }, (e) => {
            this.mapIframe.Plug.popUpStyleBillboard(e.lng, e.lat, 'DivIcons弹窗', '<div>点击了DivIcons图标</div>', 0)
        })
    }

    addDivIcons1() { // pointer-events: none;事件穿透
        this.PointArr = this.generatePosition(200, 2)
        const img = './img/fault_lan.gif'
        this.PointArr.forEach((ite, index) => {
            ite.html =
                '<img style="position: absolute;top:-28px;left:-16px;width:35px; height:35px; z-index:999" src="' +
                img + '">'
        })
        this.mapIframe.Plug.showDivIcons(this.PointArr, {}, (e) => {
            this.mapIframe.Plug.popUpStyleBillboard(e.lng, e.lat, 'DivIcons弹窗', '<div>点击了DivIcons图标</div>', 0)
        })
    }

    addCircles() {
        this.PointArr = this.generatePosition(20, 4)
        this.PointArr.forEach((ite, index) => {
            ite.label = '111'
        })
        const style = {
            showLabel: true,
            radius: 200,
            material: this.mapIframe.Plug.getMaterial('CircleWaveMaterialProperty', {
                color: this.mapIframe.Cesium.Color.fromCssColorString('#ff0000'),
                count: 2,
                gradient: 1,
                speed: 6.0 // 扩散速度
            })
        }
        this.mapIframe.Plug.showCircles(this.PointArr, style,
            (e) => {
                this.mapIframe.Plug.popUpStyleBillboard(e.lng, e.lat, 'Circle弹窗', '<div>点击了扩散圆</div>', 0)
            })
    }

    addCircles1() {
        this.PointArr = this.generatePosition(20, 4)
        const style = {
            radius: 200,
            'distanceDisplayCondition': {
                'near': 0, // 最近距离
                'far': Number.MAX_VALUE // 最远距离
            },
            material: this.mapIframe.Plug.getMaterial('CircleWaveMaterialProperty', {
                color: this.mapIframe.Cesium.Color.fromCssColorString('#ff0000'),
                count: 2,
                gradient: 1,
                speed: 6.0 // 扩散速度
            })
        }
        this.mapIframe.Plug.showCircles(this.PointArr, style,
            (e) => {
                this.mapIframe.Plug.popUpStyleBillboard(e.lng, e.lat, 'Circle弹窗', '<div>点击了扩散圆</div>', 0)
            })
        this.mapIframe.Plug.showBillboards(this.PointArr, {}, (e) => {
            this.mapIframe.Plug.popUpStyleBillboard(e.lng, e.lat, 'Billboard弹窗', '<div>点击了Billboard图标</div>', 0)
        })
    }

    showClusterPoints() {
        this.PointArr = this.generatePosition(200, 2)
        this.mapIframe.Plug.showClusterPoints(this.PointArr, {}, (e) => {
            this.mapIframe.Plug.popUpStyleBillboard(e.lng, e.lat, 'ClusterPoints弹窗', '<div>点击了图标</div>', 0)
        })
    }

    showClusterBillboards1() {
        this.PointArr = this.generatePosition(200, 2)
        this.mapIframe.Plug.showClusterBillboards(this.PointArr, {}, (e) => {
            this.mapIframe.Plug.popUpStyleBillboard(e.lng, e.lat, 'ClusterBillboards弹窗', '<div>点击了图标</div>', 0)
        })
    }

    showClusterBillboards2() {
        const ClusterStyle = {
            'size': 24, // 聚合的尺寸
            'pixelRange': 40, // 像素范围
            'distance': 50, // 聚合距离
            'gradient': {
                '0.0001': this.mapIframe.Cesium.Color.fromCssColorString('#09e5ff'),
                '0.001': this.mapIframe.Cesium.Color.fromCssColorString('#09e5ff'),
                '0.01': this.mapIframe.Cesium.Color.fromCssColorString('#09e5ff'),
                '0.1': this.mapIframe.Cesium.Color.fromCssColorString('#09e5ff')
            }, // 幅度颜色设置
            'style': 'clustering', // circle 和 clustering
            'fontSize': 48, // 字体大小
            'fontColor': this.mapIframe.Cesium.Color.fromCssColorString('#ffffff') // 字体颜色
        }
        this.PointArr = this.generatePosition(200, 2)
        this.mapIframe.Plug.showClusterBillboards(this.PointArr, {}, (e) => {
            this.mapIframe.Plug.popUpStyleBillboard(e.lng, e.lat, 'ClusterBillboards弹窗', '<div>点击了图标</div>', 0)
        }, ClusterStyle)
    }

    showClusterBillboards3() {
        const ClusterStyle = {
            'size': 24, // 聚合的尺寸
            'pixelRange': 40, // 像素范围
            'distance': 50, // 聚合距离
            'gradient': {
                '0.0001': this.mapIframe.Cesium.Color.fromCssColorString('#09e5ff'),
                '0.001': this.mapIframe.Cesium.Color.fromCssColorString('#09e5ff'),
                '0.01': this.mapIframe.Cesium.Color.fromCssColorString('#09e5ff'),
                '0.1': this.mapIframe.Cesium.Color.fromCssColorString('#09e5ff')
            }, // 幅度颜色设置
            'style': 'image', // circle 和 clustering
            'fontSize': 16, // 字体大小
            'fontColor': this.mapIframe.Cesium.Color.fromCssColorString('#ffffff'), // 字体颜色
            'imgStyle': {
                'url': './img/cluster.png',
                'width': 88,
                'height': 49
            }
        }
        this.PointArr = this.generatePosition(200, 2)
        this.mapIframe.Plug.showClusterBillboards(this.PointArr, {}, (e) => {
            this.mapIframe.Plug.popUpStyleBillboard(e.lng, e.lat, 'ClusterBillboards弹窗', '<div>点击了图标</div>', 0)
        }, ClusterStyle)
    }

    addScreenLeftClickEvent() {
        this.mapIframe.Plug.addScreenLeftClickEvent('showCircles')
    }

    showBillboardPrimitives() {
        this.PointArr = this.generatePosition(200, 2)
        this.mapIframe.Plug.showBillboardPrimitives(this.PointArr, {}, (e) => {
            this.mapIframe.Plug.popUpStyleBillboard(e.lng, e.lat, 'ClusterBillboards弹窗', '<div>点击了图标</div>', 0)
        })
    }

    clearLayers() {
        this.mapIframe.Plug.clearLayers()
    }

    xzClusterBillboards() {
        let PointArr = []
        http.getJSON('./data/hn_center.json', (xzqhdata) => {
            xzqhdata.features.forEach((item, index) => {
                PointArr.push({
                    lng: item.geometry.coordinates[0],
                    lat: item.geometry.coordinates[1],
                    label: 300
                })
            })
            let style = {
                showLabel: true,
                labelStyle: {
                    'font': '24px sans-serif',
                    'scale': 1,
                    disableDepthTestDistance: Number.POSITIVE_INFINITY,
                    // eyeOffset: mapIframe.Cartesian3([0, 0, -10]),//disableDepthTestDistance = Number.POSITIVE_INFINITY label不被遮挡
                    'distanceDisplayCondition': {
                        'near': 100000, // 最近距离
                        'far': Number.MAX_VALUE // 最远距离
                    }
                },
                imgUrl: _drawClustering(this.mapIframe.Cesium, 60, '#38ffff', 3) || './img/cluster.png',
                imgWidth: 100,
                imgHeight: 100,
                'distanceDisplayCondition': {
                    'near': 100000, // 最近距离
                    'far': Number.MAX_VALUE // 最远距离
                }
            }
            this.mapIframe.Plug.showBillboards(PointArr, style, (e) => {
                this.mapIframe.Plug.popUpStyleBillboard(e.lng, e.lat, 'Billboard弹窗', '<div>点击了Billboard图标</div>',
                    0)
            })

            PointArr = this.generatePosition(2000, 4)
            style = {
                'distanceDisplayCondition': {
                    'near': 0, // 最近距离
                    'far': 100000 // 最远距离
                }
            }
            this.mapIframe.Plug.showBillboards(PointArr, style, (e) => {
                this.mapIframe.Plug.popUpStyleBillboard(e.lng, e.lat, 'Billboard弹窗', '<div>点击了Billboard图标</div>',
                    0)
            })
        })
    }

    showPolyline() {
        this.PointArr = this.generatePolyline(2)
        var material = this.mapIframe.Plug.getMaterial('PolylineImageTrailMaterialProperty', {
            color: this.mapIframe.Cesium.Color.RED, // 设置线条颜色
            trailImage: './img/waterNormalsSmall.jpg', // 设置流动纹理图片路径
            duration: 10000 // 设置线条持续时间（毫秒）
        })
        const style = {
            width: 10,
            // showLabel:true,
            material: this.mapIframe.Cesium.Color.fromCssColorString('#ff0000')
        }
        this.mapIframe.Plug.showPolylines(this.PointArr, style, (e) => {
            this.mapIframe.Plug.popUpStyleBillboard(e.lng, e.lat, 'Polylines弹窗', '<div>点击了Polylines</div>', 0)
        })
    }

    showPolyline1() {
        this.PointArr = this.generatePolyline(1)
        const style = {
            width: 10,
            material: this.mapIframe.Plug.getMaterial('PolylineLightingTrailMaterialProperty', {
                color: this.mapIframe.Cesium.Color.fromCssColorString('#aaffff')
            })
        }
        this.mapIframe.Plug.showPolylines(this.PointArr, style, (e) => {
            this.mapIframe.Plug.popUpStyleBillboard(e.lng, e.lat, 'Polylines弹窗', '<div>点击了Polylines</div>', 0)
        })
    }

    showPolygons() {
        this.PointArr = this.generatePolygon(3)
        const style = {
            height: 0,
            material: this.mapIframe.Cesium.Color.fromCssColorString('#aaffff'),
            outline: true, // 是否显示边框
            outlineColor: this.mapIframe.Cesium.Color.BLACK, // 边框颜色
            labelStyle: {
                disableDepthTestDistance: Number.POSITIVE_INFINITY
            },
            rtOverLay: true
        }
        this.mapIframe.Plug.showPolygons(this.PointArr, style, (e) => {
            this.mapIframe.Plug.popUpStyleBillboard(e.lng, e.lat, 'Polylines弹窗', '<div>点击了Polylines</div>', 0)
            const aa = mapIframe.Comp.queryCheckedOverLays('showPolygons', 2)
            console.log(aa, 'aa')
            // mapIframe.Comp.removeDrawToLayer("showPolygons",e);
        })
    }

    showPolygons1() {
        this.PointArr = this.generatePolygon(1, true)
        const style = {
            height: 0,
            material: this.mapIframe.Cesium.Color.fromCssColorString('#aaffff')
        }
        this.PointArr[0].polyArr = '111.8, 27.4;112.8, 27.4;112.8,  28.4;111.8, 28.4'
        this.PointArr[0].holes = ['112.0, 27.6;112.4, 27.6;112.4,27.8;112.0,27.8']
        this.mapIframe.Plug.showPolygons(this.PointArr, style, (e) => {
            this.mapIframe.Plug.popUpStyleBillboard(e.lng, e.lat, 'Polylines弹窗', '<div>点击了Polylines</div>', 0)
        })
    }

    showWaterPrimitive() {
        this.PointArr = this.generatePosition(200, 2)
        this.mapIframe.Plug.showWaterPrimitive(this.PointArr, {})
    }

    addDrawing(t, type) {
        const style = {
            pixelSize: 6,
            outlineWidth: 0,
            height: 0,
            material: this.mapIframe.Cesium.Color.fromCssColorString('#aaffff'),
            color: this.mapIframe.Cesium.Color.fromCssColorString('#aaffff'),
            heightReference: 1
        }
        this.mapIframe.Plug.showDrawing({
            height: 0
        }, type, (ex) => { }, (e) => {
            // if(type=="html"){
            // 	e.setLabel("测试1",{})
            // }
            // style.imgUrl='./img/yx.png',
            // this.mapIframe.Plug.editDrawToLayer(e,style)
            e.setStyle({
                material: this.mapIframe.Cesium.Color.fromCssColorString('#000')
            })
            // e.remove()
        }, '测试')
        // this.mapIframe.Plug.removeDrawToLayer(e);
    }

    measureAndExport(type) { // 测量高度需要地形支持
        this.mapIframe.Plug.measureAndExport(type)
    }

    addBoxSelection(type) {
        this.mapIframe.Plug.showDrawing({
            height: 0
        }, type, (e) => { })
    }

    analyseGeoTools(type) {
        const style = {
            outlineWidth: 0,
            height: 0,
            color: this.mapIframe.Cesium.Color.fromCssColorString('#aaffff'),
            image: './img/yx.png',
            material: this.mapIframe.Cesium.Color.fromCssColorString('#aaffff'),
            PolygonStyle: {
                height: 0,
                fill: true,
                material: this.mapIframe.Cesium.Color.fromCssColorString('#aaffff').withAlpha(0.4),
                outline: true,
                outlineColor: this.mapIframe.Cesium.Color.fromCssColorString('#ffff00'),
                outlineWidth: 2
            }
        }
        this.mapIframe.Plug.analyseGeoTools(style, type, (e) => {
            console.log(e, '点击了' + e.type)
        }, 3000)
    }

    addImgLayer() { // 测试添加
        const item = {
            'name': 'cite:hunan_wt',
            'type': 'wms',
            'url': 'http://10.8.88.186:8088/geoserver/cite/wms',
            'layers': 'cite:hunan_wt',
            'enablePickFeatures': false,
            'parameters': {
                'srs': 'EPSG:4326',
                'format': 'image/png',
                'WIDTH': 600,
                'HEIGHT': 600,
                'transparent': true,
                'exceptions': 'application/vnd.ogc.se_inimage'
            },
            'show': true
        }
        this.mapIframe.Plug.addBaseLayer(item)
    }

    addWmsLayer() {
        const item = {
            'name': 'cite:hn_qh',
            'type': 'wms',
            'url': 'http://10.8.88.186:8088/geoserver/cite/wms',
            'layers': 'cite:hn_qh',
            'enablePickFeatures': true,
            'parameters': {
                'tiled': true,
                'srs': 'EPSG:4490',
                'format': 'image/png',
                'transparent': true,
                'width': 600,
                'height': 600,
                'exceptions': 'application/vnd.ogc.se_inimage'
            },
            'show': true
        }
        this.mapIframe.Plug.addBaseLayer(item)
    }

    addTerrainLayer() {
        const item = {
            'type': 'xyz',
            'url': 'http://10.8.88.186:8080/terrain/',
            'show': true
        }
        this.mapIframe.Plug.addBaseLayer(item)
    }

    setOverlayLayer(item) {
        this.mapIframe.Plug.setOverlayLayer(item)
    }

    showSplitDirection() {
        const item = {
            'name': 'cite:hunan_wt',
            'type': 'wms',
            'url': 'http://10.8.88.186:8088/geoserver/cite/wms',
            'layers': 'cite:hunan_wt',
            'enablePickFeatures': false,
            'parameters': {
                'srs': 'EPSG:4326',
                'format': 'image/png',
                'WIDTH': 600,
                'HEIGHT': 600,
                'transparent': true,
                'exceptions': 'application/vnd.ogc.se_inimage'
            },
            'show': true
        }
        this.mapIframe.Plug.addBaseLayer(item)
        this.mapIframe.Plug.setSplitDirection('LEFT')
        this.mapIframe.Plug.setSplitPositionValue(0.5)
    }

    hideSplitDirection() {
        this.mapIframe.Plug.setSplitDirection('NONE')
    }

    addTrackController() {
        this.PointArr = this.generatePolyline(1)
        this.PointArr[0].label = '路径1'
        const style = {
            width: 2,
            showLabel: true,
            material: this.mapIframe.Cesium.Color.fromCssColorString('#ff0000')
        }
        this.mapIframe.Plug.showPolylines(this.PointArr, style, (e) => {
            this.mapIframe.Plug.popUpStyleBillboard(e.lng, e.lat, 'Polylines弹窗', '<div>点击了Polylines</div>', 0)
        })
    }

    play() {
        this.mapIframe.Plug.trackPlay('TrackController1')
    }

    addSpeed() {
        const speed = 5

        this.mapIframe.Plug.trackChangeSpeed('TrackController1', -speed)
    }

    reduceSpeed() {
        const speed = 5

        this.mapIframe.Plug.trackChangeSpeed('TrackController1', +speed)
    }

    addTrackController1() {
        this.PointArr = this.generatePolyline(1)
        this.PointArr[0].label = '路径1'
        const spoint = this.PointArr[0].lineArr[0]
        spoint.style = {
            imgUrl: './img/start.png'
        }
        const epoint = this.PointArr[0].lineArr[this.PointArr[0].lineArr.length - 1]
        epoint.style = {
            imgUrl: './img/end.png'
        }
        this.PointArr[0].Points = [spoint, epoint]
        const style = {
            styleLine: {
                width: 10,
                showLabel: true,
                clampToGround: true,
                material: new this.mapIframe.Cesium.PolylineOutlineMaterialProperty({
                    color: this.mapIframe.Cesium.Color.fromCssColorString('#aaaa7f'),
                    outlineWidth: 3,
                    outlineColor: this.mapIframe.Cesium.Color.fromCssColorString('#ffff7f')
                })
            },
            stylePoint: {
                imgWidth: 25,
                imgHeight: 40,
                clampToGround: true,
                pixelOffset: {
                    'x': 0,
                    'y': -18
                }
            },
            styleTrack: {
                mpUrl: './img/qiche.gltf',
                isModel: true,
                duration: 20,
                mpStyle: {
                    scale: 100,
                    clampToGround: true
                    // pixelOffset:{ "x": 0, "y":-16}//图片位置偏移
                },
                pathStyle: {
                    width: 3,
                    clampToGround: true,
                    material: new this.mapIframe.Cesium.PolylineDashMaterialProperty({
                        color: this.mapIframe.Cesium.Color.fromCssColorString('#ffaa7f')
                    }),
                    disableDepthTestDistance: Number.POSITIVE_INFINITY
                }
            }
        }
        this.mapIframe.Plug.showTrackController(this.PointArr, style, (e) => {
            this.mapIframe.Plug.popUpStyleBillboard(e.lng, e.lat, 'Polylines弹窗', '<div>点击了Polylines</div>', 0)
        }, 'TrackController1')
    }

    generatePolyline(num) {
        const dataArray = []
        for (var i = 0; i < num; i++) {
            this.PointArr = this.generatePosition(3, 4)
            dataArray.push({
                id: i,
                lineArr: this.PointArr,
                label: '线条label'
            })
        }
        return dataArray
    }
    generatePolygon(num, ishost) {
        const dataArray = []
        for (var i = 0; i < num; i++) {
            this.PointArr = this.generatePosition(4, 4)
            if (ishost) {
                const holes = this.generatePosition(4, 1)
                dataArray.push({
                    id: i,
                    polyArr: this.PointArr,
                    holes: [holes],
                    label: '面label'
                })
            } else {
                dataArray.push(this.PointArr)
            }
        }
        return [{
            id: 2,
            polyArr: dataArray,
            label: '面label'
        }]
    }

    generatePosition(num, r) {
        var list = []
        for (var i = 0; i < num; i++) {
            var lng = 110.472208 + (Math.random() * r - r / 2)
            var lat = 29.136392 + (Math.random() * r - r / 2)
            list.push({
                lng,
                lat,
                id: i
            })
        }
        return list
    }

    flywireLayerShili() {
        let dataArray = [{
            'Points': [{
                x: 111.54600480133,
                y: 27.3812685
            }],
            'lineArr': [
                [111.54600480133, 27.3812685],
                [111.52600480133, 27.3812685]
            ]
        }, {
            'Points': [{
                x: 111.50600480133,
                y: 27.3812685
            }],
            'lineArr': [
                [111.50600480133, 27.3812685],
                [111.52600480133, 27.3812685]
            ]
        }, {
            'Points': [{
                x: 111.52600480133,
                y: 27.3612685
            }],
            'lineArr': [
                [111.52600480133, 27.3612685],
                [111.52600480133, 27.3812685]
            ]
        }]
        dataArray = [{
            'Points': [{
                x: 111.52600480133,
                y: 27.3812685
            }],
            'lineArr': [
                [111.52600480133, 27.3812685],
                [111.54600480133, 27.3812685]
            ]
        }, {
            'lineArr': [
                [111.52600480133, 27.3812685],
                [111.50600480133, 27.3812685]
            ]
        }, {
            'lineArr': [
                [111.52600480133, 27.3812685],
                [111.52600480133, 27.3612685]
            ]
        }]
        const style = {
            BbdStyle: {
                imgUrl: './img/yx.png',
                imgWidth: 30,
                imgHeight: 38,
                clampToGround: true,
                pixelOffset: {
                    'x': 0,
                    'y': -13
                }
            },
            PlineStyle: {
                width: 3,
                clampToGround: true,
                material: new this.mapIframe.Cesium.PolylineDashMaterialProperty({
                    color: this.mapIframe.Cesium.Color.fromCssColorString('#ffaa7f')
                }),
                disableDepthTestDistance: Number.POSITIVE_INFINITY
            }
        }
        this.mapIframe.Plug.flywireLayer(dataArray, 'cs_layerId', style, (e) => { })
    }

    addKeyGrid(dialogObj) {
        // clearVctorLayer()清除图层
        const style = {
            PgonStyle: {
                alpha: 1,
                color: '#ff0000' // rgba(11, 37, 67, 0.4)
            },
            PlineStyle: {
                color: '#ff0000', // rgba(11, 37, 67, 0.4)
                outlineColor: '#ff007f',
                outlineWidth: 3,
                height: 1
            }
        }
        http.getJSON('data/wg.json', function (data) {
            debugger
            this.mapIframe.Plug.addPolylineAndPolygon('KeyGrid_layerId', data.features, style, (e) => { })
        })
    }
}

// const KC = require('./kc-overlay.js').default
// const bigPointMarker = require('./images/markerbig_select.png')
// const waterNormalsSmall = require('./images/waterNormalsSmall.jpg')
/**
 * GisComp类gis基础功能接口
 * @module map
 */
class GisComp {
    constructor() {
        this.P = KC.P
        this._viewer = undefined// 地图
        this._handler = null// 监听实例
        this._ploUtil = undefined// 绘画标点实例
        this._ImageryDataLayer = {}// 叠加图层数组
        this._imageryLayer = []// 底图图层数组
        this._measureUtil = undefined// 测量工具实例
        this._vctorLayer = undefined// 点面线实例
        this._oldOverlay = undefined// 点面线实例
        this._configData = undefined
        this._heatLayer = undefined;
        this.creationOptions = {
            orderIndependentTranslucency: false,
            contextOptions: {
                webgl: {
                    stencil: true,
                    preserveDrawingBuffer: true,
                    alpha: true
                }
            }
        }
        this.publicStyle = {
            imgUrl: './images/markerbig_select.png',
            imgWidth: 30,
            imgHeight: 38,
            MouseEventType: ['CLICK'],
            showLabel: false,
            labelStyle: {},
            radius: 0
        }
    }
    /**
       * 初始化地图、底图加载、图层承载器加载、地图动画及定位到中心点
       * @param {Object} divId 承载地图的DIV
       * @param {Object} config 地图配置文件||Cesium 自 1.102.0 开始，为了更好支持跨平台，尤其是移动端，Cesium 默认使用 WebGL2 上下文，如果想使用 WebGL1 上下文，需要在地球初始化的时候设置相应的参数"requestWebgl1": true
       * @param {Object} [config.creationOptions] 属性参数,可参考{@link http://10.8.88.186:8080/kcgis-doc/base/#creation}
       * @param {Object} [config.options] 属性参数,可参考{@link http://10.8.88.186:8080/kcgis-doc/base/#methods}
       * @param {Object} config.map3d 3d配置对象
       * @param {Object} config.map3d.flyTo 地图是否初始化位置
       * @param {Object} config.map3d.zoomTo 地图初始化位置，为true直接跳转,可参考{@link zoomTo}
       * @param {Object} config.map3d.baseMap 底图配置参数，可参考{@link addLayers}
       * @param {Object} config.map3d.center 中心点位置参数，可参考{@link flyToPosition}
       * @param {Function}completeCallback 飞行完之后触发的回调（viewer对象）
       */
    initMap(divId, config, completeCallback) {
        const _ts = this
        _ts._configData = config
        _ts._viewer = new KC.Viewer(divId, {
            ..._ts.creationOptions,
            ..._ts._configData.creationOptions
        }).setOptions({
            ...{},
            ..._ts._configData.options
        })
        _ts.createLayer()
        _ts.initBaseLayers(_ts._configData.map3d.baseMap, _ts._viewer)
        if (_ts._configData.map3d.flyTo !== false) {
            if (_ts._configData.map3d.zoomTo) {
                _ts.zoomTo(_ts._configData.map3d.center, completeCallback)
            } else {
                _ts.flyToPosition(_ts._configData.map3d.center, completeCallback, _ts._configData.map3d.center.duration)
            }
        }
    }
    /**
       * 图层承载器加载
       */
    createLayer() {
        const _ts = this
        // 文字避让
        _ts._viewer.scene.overlapDisplayedThreshold = 20
        _ts._viewer.popup.config = {
            position: 'topright',
            customClass: 'blue-popup blue-popup-theme-29baf1'
        }
        _ts._vctorLayer = new KC.VectorLayer('vctorLayer')
        _ts._viewer.addLayer(_ts._vctorLayer)
        // 标会
        _ts._ploUtil = new KC.Plot(_ts._viewer)
        // 测量
        //_ts._measureUtil = new KC.MeasureUtil(_ts._viewer)
        // 绑定事件
        _ts._handler = new Cesium.ScreenSpaceEventHandler(_ts._viewer.scene.canvas)
    }
    /**
       * 遍历加载底图
       * @param {Object} baseMap 底图配置参数
       * @param {Object} [baseMap.name] 底图名称
       * @param {Object} [baseMap.type] 底图类型
       * @param {Object} [baseMap.layerUrl] 底图链接地址
       * @param {Object} [baseMap.show] 底图是否显示
       * @param {Object} [baseMap.style] 底图样式
       * @param {Object} [baseMap.key] 底图密钥
       * @param {Object} [baseMap....] 底图其它属性
       */
    initBaseLayers(baseMap, _viewer) {
        const _ts = this
        if (baseMap && baseMap.length > 0) {
            for (let i = 0; i < baseMap.length; i++) {
                const items = baseMap[i]
                if (items.show) {
                    _ts._imageryLayer.push({
                        'index': i,
                        'layer': _ts.addLayers(items, _viewer)
                    })
                }
            }
        }
    }
    /**
       * 底图加载
       * @function
       * @name addLayers
       * @param {Object} baseMap 底图配置参数
       * @param {Object} [baseMap.name] 底图名称
       * @param {Object} [baseMap.type] 底图类型
       * @param {Object} [baseMap.layerUrl] 底图链接地址
       * @param {Object} [baseMap.show] 底图是否显示
       * @param {Object} [baseMap.style] 底图样式
       * @param {Object} [baseMap.key] 底图密钥
       * @param {Object} [baseMap....] 底图其它属性
       */
    addLayers(layer, _viewer) {
        let lsy = null
        const _ts = this
        if (layer.t_mapSplit) {
            if (KC.ImageryType[layer.type.toUpperCase()]) {
                lsy = _viewer.mapSplit.addBaseLayer(KC.ImageryLayerFactory.createImageryLayer(layer.type, layer), layer.t_index || null)
            }
        } else {
            if (KC.TerrainType[layer.type.toUpperCase()]) {
                lsy = _viewer.scene.terrainProvider = KC.TerrainFactory.createTerrain(layer.type, layer)
            } else if (KC.ImageryType[layer.type.toUpperCase()]) {
                const provider = KC.ImageryLayerFactory.createImageryLayer(layer.type, layer);
                provider.then((val) => {
                    console.log(val)
                    lsy = _viewer.imageryLayers.addImageryProvider(val, layer.t_index || null)
                })
            } else if (layer.type == 'maps' && layer.show) {
                lsy = _viewer.imageryLayers.addImageryProvider(new Cesium.SuperMapImageryProvider({
                    url: layer.layerUrl
                }), layer.t_index || null)
                lsy.transparentBackColorTolerance = 0.2
            } else if (layer.type == 'arcgisOffLine' && layer.show) {
                const imagelayer = new Cesium.UrlTemplateImageryProvider({
                    url: layer.layerUrl + '/{selfZ}/{selfY}/{selfX}.png',
                    tilingScheme: new Cesium.GeographicTilingScheme({
                        ellipsoid: Cesium.Ellipsoid.WGS84
                    }),
                    customTags: {
                        selfZ: function (imageryProvider, x, y, level) {
                            return 'L' + (level + 1)
                        },
                        selfX: function (imageryProvider, x, y, level) {
                            var index = x.toString(16)
                            return 'C' + '00000000'.substring(0, 8 - index.length) + index
                        },
                        selfY: function (imageryProvider, x, y, level) {
                            var index = y.toString(16)
                            return 'R' + '00000000'.substring(0, 8 - index.length) + index
                        }
                    }
                })
                lsy = _viewer.imageryLayers.addImageryProvider(imagelayer, layer.t_index || null)
            } else if (layer.type == 'image' && layer.show) {
                lsy = _ts.addMapBackgroupImage(layer.layerUrl, layer.postions, _viewer)
            }
        }
        return lsy
    }
    /**
       * 加载图片底图（在指定矩形区域覆盖图片）
       * @param {Object} image 底图图片
       * @param {Object} pos 矩形面数据
       */
    addMapBackgroupImage(image, pos, _viewer) {
        const backgroupImage_layer = new KC.VectorLayer('backgroupImage_layer')
        _viewer.addLayer(backgroupImage_layer)
        const polygon = new KC.Polygon(pos)
        polygon.setStyle({
            material: new Cesium.ImageMaterialProperty({
                image: image
            })
        })
        backgroupImage_layer.addOverlay(polygon)
        return backgroupImage_layer
    }
    /**
       * 飞行到某一点(position--lng、lat、alt、0、-90、0)
       * @function
       * @name flyToPosition
       * @param {Object} position
       * @param {float} position.lng 经度
       * @param {float} position.lat 纬度
       * @param {float} position.alt 高度，单位：米，默认：0
       * @param {float} position.heading 偏航角度，表示绕 Z 轴旋转。默认：0
       * @param {float} position.pitch 俯仰角度，表示绕 Y 轴旋转。默认：0
       * @param {float} position.roll 翻转角度，表示绕 X 轴旋转。默认：0
       * @param {Function}completeCallback 飞行完之后触发的回调（viewer对象）
       * @param {float} duration 飞行时间
       */
    flyToPosition(position, completeCallback, duration = 2) {
        const _ts = this
        _ts._viewer.flyToPosition(
            new KC.Position(position.lng, position.lat, position.alt, position.heading, position.pitch, position.roll), completeCallback && completeCallback(_ts._viewer), duration)
    }
    /**
       * 飞行到矩形区域
       * @param {Object} Rect
       * @param {float} Rect.west 矩形西坐标值
       * @param {float} Rect.south 矩形南坐标值
       * @param {float} Rect.east 矩形东坐标值
       * @param {float} Rect.north 矩形北坐标值
       */
    flyToCamera(Rect) {
        const _ts = this
        _ts._viewer.camera.flyTo({
            destination: Cesium.Rectangle.fromDegrees(items.west, items.south, items.east, items.north)
        })
    }
    /**
       * 缩放到某一点
       *@function
       * @name zoomTo
       * @param {Object} position
       * @param {float} position.lng 经度
       * @param {float} position.lat 纬度
       * @param {float} position.alt 高度，单位：米，默认：0
       * @param {float} position.heading 偏航角度，表示绕 Z 轴旋转。默认：0
       * @param {float} position.pitch 俯仰角度，表示绕 Y 轴旋转。默认：0
       * @param {float} position.roll 翻转角度，表示绕 X 轴旋转。默认：0
       * @param {Function}completeCallback 飞行完之后触发的回调（viewer对象）
       */
    zoomTo(position, completeCallback) {
        const _ts = this
        _ts._viewer.zoomToPosition(
            new KC.Position(position.lng, position.lat, position.alt, position.heading, position.pitch, position.roll), completeCallback && completeCallback(_ts._viewer)
        )
    }
    /**
       * 调整相机到某一点
       * @param {Object} position
       * @param {float} position.lng 经度
       * @param {float} position.lat 纬度
       * @param {float} position.alt 高度，单位：米，默认：0
       * @param {float} position.heading 偏航角度，表示绕 Z 轴旋转。默认：0
       * @param {float} position.pitch 俯仰角度，表示绕 Y 轴旋转。默认：0
       * @param {float} position.roll 翻转角度，表示绕 X 轴旋转。默认：0
       */
    setView(position, _viewer) {
        let self_viewer = _viewer || this._viewer
        self_viewer.scene.camera.setView({
            destination: new Cesium.Cartesian3.fromDegrees(position.lng, position.lat, position.alt),
            orientation: {
                heading: Cesium.Math.toRadians(position.heading),
                pitch: Cesium.Math.toRadians(position.pitch), // 从上往下看为-90
                roll: Cesium.Math.toRadians(position.roll)
            }
        })
    }
    /**
       * 地图导出
       *
       */
    exportScene() {
        const _ts = this
        _ts._viewer.exportScene()
    }
    /**
       * 地图放大
       */
    zoomIn() {
        const scene = this._viewer.scene
        const camera = scene.camera
        const sscc = scene.screenSpaceCameraController
        if (
            scene.mode === Cesium.SceneMode.MORPHING ||
            !sscc.enableInputs ||
            scene.mode === Cesium.SceneMode.COLUMBUS_VIEW
        ) {
            return true
        } else if (scene.mode === Cesium.SceneMode.SCENE2D) {
            camera.zoomIn(camera.positionCartographic.height * 0.5)
        } else if (scene.mode === Cesium.SceneMode.SCENE3D) {
            const focus = this._getCameraFocus(scene)
            const cameraPosition = this._getCameraPosition(camera, focus, 1 / 2)
            camera.flyTo({
                destination: cameraPosition,
                orientation: {
                    heading: camera.heading,
                    pitch: camera.pitch,
                    roll: camera.roll
                },
                duration: 0.5,
                convert: false
            })
        }
    }
    /**
       * 地图缩小
       */
    zoomOut() {
        const scene = this._viewer.scene
        const camera = scene.camera
        const sscc = scene.screenSpaceCameraController
        if (
            scene.mode === Cesium.SceneMode.MORPHING ||
            !sscc.enableInputs ||
            scene.mode === Cesium.SceneMode.COLUMBUS_VIEW
        ) {
            return true
        } else if (scene.mode === Cesium.SceneMode.SCENE2D) {
            camera.zoomOut(camera.positionCartographic.height)
        } else if (scene.mode === Cesium.SceneMode.SCENE3D) {
            const focus = this._getCameraFocus(scene)
            const cameraPosition = this._getCameraPosition(camera, focus, -1)
            camera.flyTo({
                destination: cameraPosition,
                orientation: {
                    heading: camera.heading,
                    pitch: camera.pitch,
                    roll: camera.roll
                },
                duration: 0.5,
                convert: false
            })
        }
    }
    _getCameraFocus(scene) {
        const ray = new Cesium.Ray(
            scene.camera.positionWC,
            scene.camera.directionWC
        )
        const intersections = Cesium.IntersectionTests.rayEllipsoid(
            ray,
            Cesium.Ellipsoid.WGS84
        )
        if (intersections) {
            return Cesium.Ray.getPoint(ray, intersections.start)
        }
        return Cesium.IntersectionTests.grazingAltitudeLocation(
            ray,
            Cesium.Ellipsoid.WGS84
        )
    }
    _getCameraPosition(camera, focus, scalar) {
        const cartesian3Scratch = new Cesium.Cartesian3()
        const direction = Cesium.Cartesian3.subtract(
            focus,
            camera.position,
            cartesian3Scratch
        )
        const movementVector = Cesium.Cartesian3.multiplyByScalar(
            direction,
            scalar,
            cartesian3Scratch
        )
        return Cesium.Cartesian3.add(
            camera.position,
            movementVector,
            cartesian3Scratch
        )
    }
    /**
       * 地图二三维切换
       * @param {number} num 维数(2/2.5/3)
       */
    changeSceneMode(num) {
        const _ts = this
        if (_ts._viewer) {
            _ts._viewer.changeSceneMode(Number(num), 0)
        }
    }
    /**
       * 获取两点间的距离
       * @param {Object} startPoint 开始点位信息
       * @param {Object} endPoint  结束点位信息
       */
    getDistance(startPoint, endPoint) {
        const positions = []
        var stPoint = this.getLngAndLat(startPoint)
        var enPoint = this.getLngAndLat(endPoint)
        if (stPoint.x && stPoint.y && enPoint.x && enPoint.y) {
            positions.push(new KC.Position(stPoint.x, stPoint.y))
            positions.push(new KC.Position(enPoint.x, enPoint.y))
            return KC.Math.distance(positions)
        }
        return 0
    }
    /**
       *获取点位经纬度
       *@param {*} point  点位信息
       */
    getLngAndLat(point) {
        const newPoint = { 'x': 0, 'y': 0 }
        if (point instanceof Array) {
            newPoint.x = parseFloat(point[0])
            newPoint.y = parseFloat(point[1])
        } else if (point instanceof Object || typeof point === 'object') {
            if (point.longitude && point.latitude) {
                newPoint.x = parseFloat(point.longitude)
                newPoint.y = parseFloat(point.latitude)
            } else if (point.lng && point.lat) {
                newPoint.x = parseFloat(point.lng)
                newPoint.y = parseFloat(point.lat)
            } else if (point.x && point.y) {
                newPoint.x = parseFloat(point.x)
                newPoint.y = parseFloat(point.y)
            }
        } else if (typeof point === 'string') {
            const poiArr = point.split(',')
            newPoint.x = parseFloat(poiArr[0])
            newPoint.y = parseFloat(poiArr[1])
        }
        return newPoint
    }
    /**
       * 测量工具
       * @param {string} type 测量距离distance、面积area、高度(建筑支撑)height、clearAll清除测量
       */
    measure(type) {
        const _ts = this
        if (type == 'clearAll') {
            if (_ts._measureUtil) {
                _ts._measureUtil.clearAll()
            }
        } else {
            _ts._measureUtil.measure(type)
        }
    }
    /*
       *查询范围
       *@param {*} [items] 四角坐标west西坐标值/north北坐标值/east/south南坐标值
       */
    initCurrentExtent(items) {
        const _ts = this
        let rect = _ts._viewer.camera.computeViewRectangle() // 获取当前视域四角坐标
        if (items) {
            rect = items // 固定为湖南省四角坐标
        }
        const arr = [rect.west, rect.north, rect.east, rect.north, rect.east, rect.south, rect.west, rect.south, rect
            .west, rect.north
        ]
        const outlinePositions = Cesium.Cartesian3.fromRadiansArray(arr)
        const outlineArr = new Array()
        for (let i = 0, j = outlinePositions.length; i < j; i++) {
            const outpoint = new Array()
            const lonlatPoint = KC.T.transformCartesianToWGS84(outlinePositions[i])
            outpoint.push(lonlatPoint.lng)
            outpoint.push(lonlatPoint.lat)
            outlineArr.push(outpoint)
        }
        return outlineArr
    }
    /**
       * 百度坐标系转wgs84坐标系
       * @param {*} lng
       * @param {*} lat
       */
    BD09ToWGS84(lng, lat) {
        // 百度坐标系先转为火星坐标系
        const gcj02 = KC.CoordTransform.BD09ToGCJ02(lng, lat)
        // 火星坐标系转wgs84坐标系
        const result = KC.CoordTransform.GCJ02ToWGS84(gcj02[0], gcj02[1])
        return result
    }
    /**
       * wgs84坐标系转百度坐标系
       * @param {*} lng
       * @param {*} lat
       */
    WGS84ToBD09(lng, lat) {
        // wgs84坐标系先转为火星坐标系
        const gcj02 = KC.CoordTransform.WGS84ToGCJ02(lng, lat)
        // 火星坐标系转百度坐标系
        const result = KC.CoordTransform.GCJ02ToBD09(gcj02[0], gcj02[1])
        return result
    }
    /**
       * 弹出弹窗
       * @param {String} x 经度
       * @param {String} y 纬度
       * @param {Object} content 弹窗样式
       * @param {String} [height] 高度
       */
    popUpBillboard(x, y, content, height = 0) {
        const position = new KC.Position(x, y, height)
        const _center = KC.T.transformWGS84ToCartesian(position)
        this._viewer.popup.showAt(_center, content)
    }
    /**
       * 弹出弹窗（带样式）
       * @param {String} x 经度
       * @param {String} y 纬度
       * @param {String} title 弹窗标题
       * @param {Object} content 弹窗样式
       * @param {String} [height] 高度
       */
    popUpStyleBillboard(x, y, title, content, height = 0) {
        const position = new KC.Position(x, y, height)
        const _center = KC.T.transformWGS84ToCartesian(position)
        this._viewer.popup.showAt(_center, this.buildPopUp(title, content))
    }
    /**
       * 构建气泡弹窗
       * @param {Object} title
       * @param {Object} content
       */
    buildPopUp(title, content) {
        let html = '<div class="blue-popup-wrap">'
        html += '<div class="area">'
        html += '<div class="arrow-lt"></div>'
        html += '<div class="b-t"> </div>'
        html += '<div class="b-r"> </div>'
        html += '<div class="b-b"> </div>'
        html += '<div class="b-l"> </div>'
        html += '<div class="arrow-rb"> </div>'
        html += '<div class="label-wrap">'
        html += '<div class="title">' + title + '</div>'
        html += '<div class="label-content">' + content + '</div>'
        html += '</div>'
        html += '</div>'
        html += '<div class="b-t-l"> </div>'
        html += '<div class="b-b-r"> </div>'
        html += '</div><div class="arrow"> </div>'
        return html
    }
    /**
       * 关闭弹窗
       */
    closePopUp() {
        this._viewer.popup.hide()
    }
    /**
       *全屏
       */
    fullScreen() {
        var isfull = Cesium.Fullscreen.supportsFullscreen()
        var fullscreen = Cesium.Fullscreen.fullscreen
        if (isfull == true && fullscreen == false) {
            Cesium.Fullscreen.requestFullscreen(document.body)
        }
    }
    /**
       *退出全屏
       */
    exitFullScreen() {
        var isfull = Cesium.Fullscreen.supportsFullscreen()
        var fullscreen = Cesium.Fullscreen.fullscreen
        if (isfull == true && fullscreen == true) {
            Cesium.Fullscreen.exitFullscreen()
        }
    }
    /**
       *向右偏移地图
       */
    moveRight() {
        const _ts = this
        const rectangle = _ts._viewer.camera.computeViewRectangle()
        const west = rectangle.west / Math.PI * 180
        const north = rectangle.north / Math.PI * 180
        const east = rectangle.east / Math.PI * 180
        const south = rectangle.south / Math.PI * 180
        _ts._viewer.camera.flyTo({
            destination: Cesium.Rectangle.fromDegrees(west - 0.003, south, east - 0.003, north)
        })
    }
    /**
       * 设置指定值获取对应材质
       * @param {String} name 材质类名
       * @param {String} style 材质样式
       */
    getMaterial(name, style) {
        return new KC[name](style)
    }
    /**
       * 显示对应底图
       * @param {number} indexs  底图下标组
       */
    changeBaseLayer(indexs) {
        const _ts = this
        _ts._imageryLayer.forEach((item, index1) => {
            const flag = indexs.findIndex(ite => {
                return ite == item.index
            })
            if (flag != -1) {
                item.layer.show = true
            } else {
                item.layer.show = false
            }
        })
    }
    /**
       * 获取当前底图层数
       */
    getImageryLayerNum() {
        return this._imageryLayer.length
    }
    /**
       *获取当前地图中心位置信息
       * @param {Object} movement 点击点位信息
       */
    queryLayersPoint(movement) {
        const _ts = this
        const heading = Cesium.Math.toDegrees(_ts._viewer.camera.heading)
        const pitch = Cesium.Math.toDegrees(_ts._viewer.camera.pitch)
        const roll = Cesium.Math.toDegrees(_ts._viewer.camera.roll)
        const cartographic = _ts._viewer.camera.positionCartographic
        const { height, longitude, latitude } = cartographic
        let movementPoint = {}
        if (movement) {
            const cartesian = _ts._viewer.scene.globe.pick(_ts._viewer.camera.getPickRay(movement
                .position), _ts._viewer.scene)
            movementPoint = KC.T.transformCartesianToWGS84(cartesian)
        }
        const result = {
            height,
            longitude: Cesium.Math.toDegrees(longitude),
            latitude: Cesium.Math.toDegrees(latitude),
            heading,
            pitch,
            roll,
            movementPoint
        }
        return result
    }
    /**
       *点位数组转字符串
       *@param {*} dataArray 经纬度数组
       */
    arrToStr(dataArray) {
        let polygonStr = ''
        for (let i = 0; i < dataArray.length; i++) {
            const x = dataArray[i][0]
            const y = dataArray[i][1]
            polygonStr += x + ',' + y + ';'
        }
        return polygonStr.substr(0, polygonStr.length - 1)
    }
    /**
       *添加一个新的图层到图层组中，矢量图层
       *@param {String} layerId 图层唯一id，用于控制数据的加入，及图层显示隐藏
       */
    addVectorToArr(layerId, _viewer) {
        const _ts = this
        const self_viewer = _viewer || _ts._viewer;
        if (!_ts._ImageryDataLayer[layerId]) {
            const layer = new KC.VectorLayer(layerId)
            self_viewer.addLayer(layer)
            _ts._ImageryDataLayer[layerId] = { layer, type: 'data', layerType: 'VectorLayer', PointArr: {} }
        } else {
            console.log('id:' + layerId + '的图层已存在，已加载为' + _ts._ImageryDataLayer[layerId].layerType + '矢量图层')
        }
    }
    /**
       *添加一个新的图层到图层组中，图元图层
       *@param {String} layerId 图层唯一id，用于控制数据的加入，及图层显示隐藏
       */
    addPrimitiveToArr(layerId) {
        const _ts = this
        if (!_ts._ImageryDataLayer[layerId]) {
            const layer = new KC.PrimitiveLayer(layerId)
            _ts._viewer.addLayer(layer)
            _ts._ImageryDataLayer[layerId] = { layer, type: 'data', layerType: 'PrimitiveLayer', PointArr: {} }
        } else {
            console.log('id:' + layerId + '的图层已存在，已加载为' + _ts._ImageryDataLayer[layerId].layerType + '图元图层')
        }
    }
    /**
       *添加一个新的图层到图层组中，聚合图层
       *@param {String} layerId 图层唯一id，用于控制数据的加入，及图层显示隐藏
       *@param {Object} [style] 聚合图层样式
       */
    addClusterToArr(layerId, style = {}, _viewer) {
        const _ts = this
        const self_viewer = _viewer || _ts._viewer;
        if (!_ts._ImageryDataLayer[layerId]) {
            const layer = new KC.ClusterLayer(layerId, style)
            self_viewer.addLayer(layer)
            _ts._ImageryDataLayer[layerId] = { layer, type: 'data', layerType: 'ClusterLayer', PointArr: {} }
        } else {
            console.log('id:' + layerId + '的图层已存在，已加载为' + _ts._ImageryDataLayer[layerId].layerType + '聚合图层')
        }
    }
    /**
       *添加一个新的图层到图层组对象中，html图层
       *@param {String} layerId 图层唯一id，用于控制数据的加入，及图层显示隐藏
       */
    addHtmlToArr(layerId, _viewer) {
        const _ts = this
        const self_viewer = _viewer || _ts._viewer;
        if (!_ts._ImageryDataLayer[layerId]) {
            const layer = new KC.HtmlLayer(layerId)
            self_viewer.addLayer(layer)
            _ts._ImageryDataLayer[layerId] = { layer, type: 'data', layerType: 'HtmlLayer', PointArr: {} }
        } else {
            console.log('id:' + layerId + '的图层已存在，已加载为' + _ts._ImageryDataLayer[layerId].layerType + '文本图层')
        }
    }
    /**
       *根据图层id查询图层，然后往图层里面添加数据信息
       *@param {Object} dataArray 包含经纬度的数据集合
       *@param {Object} [dataArray[0]] 数据集合里的一项
       *@param {Object} [dataArray[0].style] 每项样式设置,可参考http://10.8.88.186:8080/kcgis-doc,搜索kc.Billboard的参数
       *@param {Number} [dataArray[0].style.pointHeight] 每项样式设置,Billboard高度
       *@param {Array} [dataArray[0].style.MouseEventType] 每项样式设置,添加事件，默认点击事件['CLICK']
       *@param {Array} [dataArray[0].style.showLabel] 每项样式设置,设置是否显示label
       *@param {Array} [dataArray[0].style.labelStyle] 每项样式设置,设置label样式，参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-label}
       *@param {String} layerId 图层唯一id
       *@param {Function} callback 点位点击回调
       *@param {Object} [style] 点位样式，可参考http://10.8.88.186:8080/kcgis-doc,搜索kc.Billboard的参数
       *@param {Object} [style.flyTo] 图层飞入
       *@param {Array} [style.MouseEventType] 添加事件，默认点击事件['CLICK']
       *@param {Array} [style.showLabel] 设置是否显示label
       *@param {Array} [style.labelStyle] 设置label样式，参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-label}
       *@param {Array} [style.isLayerClear] 是否清除图层之前添加的实体
       *@param {Object} [other] 其它参数
       *@param {Object} [other.pointHeight] Billboard高度
       *@param {Object} [other.labelName] label名称，用于获取对应名称的值id
       *@param {Object} [other.id] 每项id名称，用于获取id对应名称的值
       */
    addBillboards(dataArray, layerId, callback, style = {}, other = {}) {
        try {
            const _ts = this
            _ts.addImageryDataLayers(dataArray, layerId, (ite) => {
                _ts.addBillboard(ite, layerId, callback, style, other)
            }, style)
        } catch (ex) {
            callback(ex)
        }
    }
    /**
       *设置聚合图层是否聚合
       *@param {String} layerId 图层唯一id
       *@param {bool} enableCluster 是否聚合
       */
    enableCluster(layerId, enableCluster) {
        const _ts = this
        if (_ts._ImageryDataLayer[layerId]) {
            _ts._ImageryDataLayer[layerId].layer.enableCluster = enableCluster
        } else {
            console.log('图层组中无' + layerId + '图层!')
        }
    }
    addMouseEventType(overlay, type, item, callback, rtOverLay) {
        overlay.on(KC.MouseEventType[type], (e) => {
            item.clickData = e
            item.MouseEventType = type
            if (rtOverLay) {
                if (overlay.queryDatas) {
                    overlay.queryDatas = {
                        ...overlay.queryDatas,
                        ...item
                    }
                } else {
                    overlay.queryDatas = item
                }
                callback(overlay)
            } else {
                callback(item)
            }
        })
    }
    addOverlay(overlay, layerId, _style, item, callback, other) {
        const _ts = this
        overlay.setStyle(_style)
        _style.MouseEventType.forEach((mouseType, index) => {
            _ts.addMouseEventType(overlay, mouseType, item, callback, _style.rtOverLay || false)
        })
        if (_style.showLabel) {
            const label = item[other.labelName || 'label'].toString()
            overlay.setLabel(label, _style.labelStyle)
        }
        if (overlay.queryDatas) {
            overlay.queryDatas = {
                ...overlay.queryDatas,
                ...item
            }
        } else {
            overlay.queryDatas = item
        }
        _ts._ImageryDataLayer[layerId].layer.addOverlay(overlay)
        if (_ts._ImageryDataLayer[layerId].PointArr[item[other.id || 'id']]) {
            _ts._ImageryDataLayer[layerId].PointArr[item[other.id || 'id']] = [
                ..._ts._ImageryDataLayer[layerId].PointArr[item[other.id || 'id']],
                overlay
            ]
        } else {
            _ts._ImageryDataLayer[layerId].PointArr[item[other.id || 'id']] = [overlay]
        }
    }
    addImageryDataLayers(dataArray, layerId, callback, style) {
        const _ts = this
        if (_ts._ImageryDataLayer[layerId]) {
            if (dataArray && dataArray.length > 0) {
                if (style.isLayerClear && _ts._ImageryDataLayer[layerId].layer) {
                    _ts._ImageryDataLayer[layerId].layer.clear()
                }
                dataArray.forEach((ite, index) => {
                    callback(ite)
                })
                _ts.flyTo(style.flyTo, _ts._ImageryDataLayer[layerId].layer)
            }
        } else {
            console.log('图层组中无' + layerId + '图层!')
        }
    }
    /**
       *往图层组对应下标图层添加数据信息
       *@param {Object} item 包含经纬度的数据
       *@param {Object} [item.style] 每项样式设置,可参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-billboard}
       *@param {Number} [item.style.pointHeight] 每项样式设置,Billboard高度
       *@param {Array} [item.style.MouseEventType] 每项样式设置,添加事件，默认点击事件['CLICK']
       *@param {Array} [item.style.showLabel] 每项样式设置,设置是否显示label
       *@param {Array} [item.style.labelStyle] 每项样式设置,设置label样式，参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-label}
       *@param {String} layerId 图层唯一id
       *@param {Function} callback 点位点击回调
       *@param {Object} [style] 点位样式，可参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-billboard}
       *@param {Object} [style.flyTo] 图层飞入
       *@param {Array} [style.MouseEventType] 添加事件，默认点击事件['CLICK']
       *@param {Array} [style.showLabel] 设置是否显示label
       *@param {Array} [style.labelStyle] 设置label样式，参考文档{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-label}
       *@param {Array} [style.isLayerClear] 是否清除图层之前添加的实体
       *@param {Object} [other] 其它
       *@param {Object} [other.pointHeight] Billboard高度
       *@param {Object} [other.labelName] label名称，用于获取对应名称的值id
       *@param {Object} [other.id] 每项id名称，用于获取id对应名称的值
       */
    addBillboard(item, layerId, callback, style = {}, other = {}) {
        const _ts = this
        if (_ts._ImageryDataLayer[layerId]) {
            const _style = {
                ..._ts.publicStyle,
                ...style,
                ...item.style,
                ...{ datas: item }
            }
            let itell = item
            if (itell.x == undefined && itell.y == undefined) {
                itell = _ts.getLngAndLat(item)
            }
            const _position = new KC.Position(itell.x, itell.y, item.pointHeight || other.pointHeight || 0)
            const _billboard = new KC.Billboard(_position, _style.imgUrl)
            _billboard.size = [_style.imgWidth, _style.imgHeight]
            _ts.addOverlay(_billboard, layerId, _style, item, callback, other)
        } else {
            console.log('图层组中无' + layerId + '图层!')
        }
    }
    /**
       *根据图层id查询图层，然后往图层里面添加数据信息
       *@param {Object} dataArray 包含经纬度的数据集合
       *@param {Object} [dataArray[0]] 数据集合里的一项
       *@param {Object} [dataArray[0].style] 每项样式设置,可参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-billboardprimitive}
       *@param {Number} [dataArray[0].style.pointHeight] 每项样式设置,BillboardPrimitive高度
       *@param {Array} [dataArray[0].style.MouseEventType] 每项样式设置,添加事件，默认点击事件['CLICK']
       *@param {Array} [dataArray[0].style.showLabel] 每项样式设置,设置是否显示label
       *@param {Array} [dataArray[0].style.labelStyle] 每项样式设置,设置label样式，参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-label}
       *@param {String} layerId 图层唯一id
       *@param {Function} callback 点位点击回调
       *@param {Object} [style] 点位样式，可参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-billboardprimitive}
       *@param {Object} [style.flyTo] 图层飞入
       *@param {Array} [style.MouseEventType] 添加事件，默认点击事件['CLICK']
       *@param {Array} [style.showLabel] 设置是否显示label
       *@param {Array} [style.labelStyle] 设置label样式，参考文档{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-label}
       *@param {Array} [style.isLayerClear] 是否清除图层之前添加的实体
       *@param {Object} [other] 其它参数
       *@param {Object} [other.pointHeight] BillboardPrimitive高度
       *@param {Object} [other.labelName] label名称，用于获取对应名称的值id
       *@param {Object} [other.id] 每项id名称，用于获取id对应名称的值
       */
    addBillboardPrimitives(dataArray, layerId, callback, style = {}, other = {}) {
        try {
            const _ts = this
            _ts.addImageryDataLayers(dataArray, layerId, (ite) => {
                _ts.addBillboardPrimitive(ite, layerId, callback, style, other)
            }, style)
        } catch (ex) {
            callback(ex)
        }
    }
    /**
       *往图层组对应下标图层添加数据信息
       *@param {Object} item 包含经纬度的数据
       *@param {Object} [item.style] 每项样式设置,可参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-billboardprimitive}
       *@param {Number} [item.style.pointHeight] 每项样式设置,BillboardPrimitive高度
       *@param {Array} [item.style.MouseEventType] 每项样式设置,添加事件，默认点击事件['CLICK']
       *@param {Array} [item.style.showLabel] 每项样式设置,设置是否显示label
       *@param {Array} [item.style.labelStyle] 每项样式设置,设置label样式，参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-label}
       *@param {String} layerId 图层唯一id
       *@param {Function} callback 点位点击回调
       *@param {Object} [style] 点位样式，可参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-billboardprimitive}
       *@param {Object} [style.flyTo] 图层飞入
       *@param {Array} [style.MouseEventType] 添加事件，默认点击事件['CLICK']
       *@param {Array} [style.showLabel] 设置是否显示label
       *@param {Array} [style.labelStyle] 设置label样式，参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-label}
       *@param {Array} [style.isLayerClear] 是否清除图层之前添加的实体
       *@param {Object} [other] 其它
       *@param {Object} [other.pointHeight] BillboardPrimitive高度
       *@param {Object} [other.labelName] label名称，用于获取对应名称的值id
       *@param {Object} [other.id] 每项id名称，用于获取id对应名称的值
       */
    addBillboardPrimitive(item, layerId, callback, style = {}, other) {
        const _ts = this
        if (_ts._ImageryDataLayer[layerId]) {
            const _style = {
                ..._ts.publicStyle,
                ...style,
                ...item.style,
                ...{ datas: item }
            }
            let itell = item
            if (itell.x == undefined && itell.y == undefined) {
                itell = _ts.getLngAndLat(item)
            }
            const _position = new KC.Position(itell.x, itell.y, item.pointHeight || other.pointHeight || 0)
            const _billboardPrimitive = new KC.BillboardPrimitive(_position, _style.imgUrl)
            _billboardPrimitive.size = [_style.imgWidth, _style.imgHeight]
            _ts.addOverlay(_billboardPrimitive, layerId, _style, item, callback, other)
        } else {
            console.log('图层组中无' + layerId + '图层!')
        }
    }
    /**
       *根据图层id查询图层，然后往图层里面添加数据信息
       *@param {Object} dataArray 包含经纬度的数据集合
       *@param {Object} [dataArray[0]] 数据集合里的一项
       *@param {Object} [dataArray[0].style] 每项样式设置,可参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-point}
       *@param {Number} [dataArray[0].style.pointHeight] 每项样式设置,Point高度
       *@param {Array} [dataArray[0].style.MouseEventType] 每项样式设置,添加事件，默认点击事件['CLICK']
       *@param {Array} [dataArray[0].style.showLabel] 每项样式设置,设置是否显示label
       *@param {Array} [dataArray[0].style.labelStyle] 每项样式设置,设置label样式，参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-label}
       *@param {String} layerId 图层唯一id
       *@param {Function} callback 点位点击回调
       *@param {Object} [style] 点位样式，可参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-point}
       *@param {Object} [style.flyTo] 图层飞入
       *@param {Array} [style.MouseEventType] 添加事件，默认点击事件['CLICK']
       *@param {Array} [style.showLabel] 设置是否显示label
       *@param {Array} [style.labelStyle] 设置label样式，参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-label}
       *@param {Array} [style.isLayerClear] 是否清除图层之前添加的实体
       *@param {Object} [other] 其它参数
       *@param {Object} [other.pointHeight] Point高度
       *@param {Object} [other.labelName] label名称，用于获取对应名称的值id
       *@param {Object} [other.id] 每项id名称，用于获取id对应名称的值
       */
    addPoints(dataArray, layerId, callback, style = {}, other = {}) {
        try {
            const _ts = this
            _ts.addImageryDataLayers(dataArray, layerId, (ite) => {
                _ts.addPoint(ite, layerId, callback, style, other)
            }, style)
        } catch (ex) {
            callback(ex)
        }
    }
    /**
       *往图层组对应下标图层添加数据信息
       *@param {Object} item 包含经纬度的数据
       *@param {Object} [item.style] 每项样式设置,可参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-point}
       *@param {Number} [item.style.pointHeight] 每项样式设置,Point高度
       *@param {Array} [item.style.MouseEventType] 每项样式设置,添加事件，默认点击事件['CLICK']
       *@param {Array} [item.style.showLabel] 每项样式设置,设置是否显示label
       *@param {Array} [item.style.labelStyle] 每项样式设置,设置label样式，参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-label}
       *@param {String} layerId 图层唯一id
       *@param {Function} callback 点位点击回调
       *@param {Object} [style] 点位样式，可参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-point}
       *@param {Object} [style.flyTo] 图层飞入
       *@param {Array} [style.MouseEventType] 添加事件，默认点击事件['CLICK']
       *@param {Array} [style.showLabel] 设置是否显示label
       *@param {Array} [style.labelStyle] 设置label样式，参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-label}
       *@param {Array} [style.isLayerClear] 是否清除图层之前添加的实体
       *@param {Object} [other] 其它
       *@param {Object} [other.pointHeight] Point高度
       *@param {Object} [other.labelName] label名称，用于获取对应名称的值id
       *@param {Object} [other.id] 每项id名称，用于获取id对应名称的值
       */
    addPoint(item, layerId, callback, style = {}, other) {
        const _ts = this
        if (_ts._ImageryDataLayer[layerId]) {
            const _style = {
                ..._ts.publicStyle,
                ...style,
                ...item.style,
                ...{ datas: item }
            }
            let itell = item
            if (itell.x == undefined && itell.y == undefined) {
                itell = _ts.getLngAndLat(item)
            }
            const _position = new KC.Position(itell.x, itell.y, item.pointHeight || other.pointHeight || 0)
            const _point = new KC.Point(_position)
            _ts.addOverlay(_point, layerId, _style, item, callback, other)
        } else {
            console.log('图层组中无' + layerId + '图层!')
        }
    }
    /**
       *根据图层id查询图层，然后往图层里面添加数据信息
       *@param {Object} dataArray 包含经纬度的数据集合
       *@param {Object} [dataArray[0]] 数据集合里的一项
       *@param {Object} [dataArray[0].style] 每项样式设置,可参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-circle}
       *@param {Number} [dataArray[0].style.pointHeight] 每项样式设置,Circle高度
       *@param {Array} [dataArray[0].style.MouseEventType] 每项样式设置,添加事件，默认点击事件['CLICK']
       *@param {Array} [dataArray[0].style.showLabel] 每项样式设置,设置是否显示label
       *@param {Array} [dataArray[0].style.labelStyle] 每项样式设置,设置label样式，参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-label}
       *@param {String} layerId 图层唯一id
       *@param {Function} callback 点位点击回调
       *@param {Object} [style] 点位样式，可参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-circle}
       *@param {Object} [style.flyTo] 图层飞入
       *@param {Array} [style.MouseEventType] 添加事件，默认点击事件['CLICK']
       *@param {Array} [style.showLabel] 设置是否显示label
       *@param {Array} [style.labelStyle] 设置label样式，参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-label}
       *@param {Array} [style.isLayerClear] 是否清除图层之前添加的实体
       *@param {Object} [other] 其它参数
       *@param {Object} [other.pointHeight] Circle高度
       *@param {Object} [other.labelName] label名称，用于获取对应名称的值id
       *@param {Object} [other.id] 每项id名称，用于获取id对应名称的值
       */
    addCircles(dataArray, layerId, callback, style = {}, other = {}) {
        try {
            const _ts = this
            _ts.addImageryDataLayers(dataArray, layerId, (ite) => {
                _ts.addCircle(ite, layerId, callback, style, other)
            }, style)
        } catch (ex) {
            callback(ex)
        }
    }
    /**
       *往图层组对应下标图层添加数据信息
       *@param {Object} item 包含经纬度的数据
       *@param {Object} [item.style] 每项样式设置,可参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-circle}
       *@param {Number} [item.style.pointHeight] 每项样式设置,Circle高度
       *@param {Array} [item.style.MouseEventType] 每项样式设置,添加事件，默认点击事件['CLICK']
       *@param {Array} [item.style.showLabel] 每项样式设置,设置是否显示label
       *@param {Array} [item.style.labelStyle] 每项样式设置,设置label样式，参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-label}
       *@param {String} layerId 图层唯一id
       *@param {Function} callback 点位点击回调
       *@param {Object} [style] 点位样式，可参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-circle}
       *@param {Object} [style.flyTo] 图层飞入
       *@param {Array} [style.MouseEventType] 添加事件，默认点击事件['CLICK']
       *@param {Array} [style.showLabel] 设置是否显示label
       *@param {Array} [style.labelStyle] 设置label样式，参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-label}
       *@param {Array} [style.isLayerClear] 是否清除图层之前添加的实体
       *@param {Object} [other] 其它
       *@param {Object} [other.pointHeight] Circle高度
       *@param {Object} [other.labelName] label名称，用于获取对应名称的值id
       *@param {Object} [other.id] 每项id名称，用于获取id对应名称的值
       */
    addCircle(item, layerId, callback, style = {}, other) {
        const _ts = this
        if (_ts._ImageryDataLayer[layerId]) {
            const _style = {
                ..._ts.publicStyle,
                ...style,
                ...item.style,
                ...{ datas: item }
            }
            let itell = item
            if (itell.x == undefined && itell.y == undefined) {
                itell = _ts.getLngAndLat(item)
            }
            const _position = new KC.Position(itell.x, itell.y, item.pointHeight || other.pointHeight || 0)
            const _circle = new KC.Circle(_position, _style.radius)
            _ts.addOverlay(_circle, layerId, _style, item, callback, other)
        } else {
            console.log('图层组中无' + layerId + '图层!')
        }
    }
    /**
       *根据图层id查询图层，然后往图层里面添加数据信息
       *@param {Object} dataArray 包含经纬度的数据集合
       *@param {Object} [dataArray[0]] 数据集合里的一项
       *@param {Object} [dataArray[0].style] 每项样式设置,可参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-label}
       *@param {Number} [dataArray[0].style.pointHeight] 每项样式设置,Label高度
       *@param {Array} [dataArray[0].style.MouseEventType] 每项样式设置,添加事件，默认点击事件['CLICK']
       *@param {String} layerId 图层唯一id
       *@param {Function} callback 点位点击回调
       *@param {Object} [style] 点位样式，可参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-label}
       *@param {Object} [style.flyTo] 图层飞入
       *@param {Array} [style.MouseEventType] 添加事件，默认点击事件['CLICK']
       *@param {Array} [style.isLayerClear] 是否清除图层之前添加的实体
       *@param {Object} [other] 其它参数
       *@param {Object} [other.pointHeight] Label高度
       *@param {Object} [other.labelName] label名称，用于获取对应名称的值id
       *@param {Object} [other.id] 每项id名称，用于获取id对应名称的值
       */
    addLabels(dataArray, layerId, callback, style = {}, other = {}) {
        try {
            const _ts = this
            _ts.addImageryDataLayers(dataArray, layerId, (ite) => {
                _ts.addLabel(ite, layerId, callback, style, other)
            }, style)
        } catch (ex) {
            callback(ex)
        }
    }
    /**
       *往图层组对应下标图层添加数据信息
       *@param {Object} item 包含经纬度的数据
       *@param {Object} [item.style] 每项样式设置,可参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-circle}
       *@param {Number} [item.style.pointHeight] 每项样式设置,Circle高度
       *@param {Array} [item.style.MouseEventType] 每项样式设置,添加事件，默认点击事件['CLICK']
       *@param {String} layerId 图层唯一id
       *@param {Function} callback 点位点击回调
       *@param {Object} [style] 点位样式，可参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-circle}
       *@param {Object} [style.flyTo] 图层飞入
       *@param {Array} [style.MouseEventType] 添加事件，默认点击事件['CLICK']
       *@param {Array} [style.isLayerClear] 是否清除图层之前添加的实体
       *@param {Object} [other] 其它
       *@param {Object} [other.pointHeight] Circle高度
       *@param {Object} [other.labelName] label名称，用于获取对应名称的值id
       *@param {Object} [other.id] 每项id名称，用于获取id对应名称的值
       */
    addLabel(item, layerId, callback, style = {}, other = {}) {
        const _ts = this
        if (_ts._ImageryDataLayer[layerId]) {
            const _style = {
                ..._ts.publicStyle,
                ...style,
                ...item.style,
                ...{ datas: item },
                ...{ showLabel: false }
            }
            let itell = item
            if (itell.x == undefined && itell.y == undefined) {
                itell = _ts.getLngAndLat(item)
            }
            const _position = new KC.Position(itell.x, itell.y, item.pointHeight || other.pointHeight || 0)
            const _label = new KC.Label(_position, item[other.labelName || 'label'].toString())
            _ts.addOverlay(_label, layerId, _style, item, callback, other)
        } else {
            console.log('图层组中无' + layerId + '图层!')
        }
    }
    /**
       *根据图层id查询图层，然后往图层里面添加数据信息
       *@param {Object} dataArray 包含经纬度的数据集合
       *@param {Object} [dataArray[0]] 数据集合里的一项
       *@param {Object} [dataArray[0].html] 每项样式设置,div拼接字符串
       *@param {Object} [dataArray[0].style] 每项样式设置,可参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-divicon}
       *@param {Number} [dataArray[0].style.pointHeight] 每项样式设置,DivIcon高度
       *@param {Array} [dataArray[0].style.MouseEventType] 每项样式设置,添加事件，默认点击事件['CLICK']
       *@param {String} layerId 图层唯一id
       *@param {Function} callback 点位点击回调
       *@param {Object} [style] 点位样式，可参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-divicon}
       *@param {Object} [style.flyTo] 图层飞入
       *@param {Array} [style.MouseEventType] 添加事件，默认点击事件['CLICK']
       *@param {Array} [style.isLayerClear] 是否清除图层之前添加的实体
       *@param {Object} [other] 其它参数
       *@param {Object} [other.pointHeight] DivIcon高度
       *@param {Object} [other.id] 每项id名称，用于获取id对应名称的值
       */
    addDivIcons(dataArray, layerId, callback, style = {}, other = {}) {
        try {
            const _ts = this
            _ts.addImageryDataLayers(dataArray, layerId, (ite) => {
                _ts.addDivIcon(ite, layerId, callback, style, other)
            }, style)
        } catch (ex) {
            callback(ex)
        }
    }
    /**
       *往图层组对应下标图层添加数据信息
       *@param {Object} item 包含经纬度的数据
       *@param {Object} [item.html] 每项样式设置,div拼接字符串
       *@param {Object} [item.style] 每项样式设置,可参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-divicon}
       *@param {Number} [item.style.pointHeight] 每项样式设置,DivIcon高度
       *@param {Array} [item.style.MouseEventType] 每项样式设置,添加事件，默认点击事件['CLICK']
       *@param {String} layerId 图层唯一id
       *@param {Function} callback 点位点击回调
       *@param {Object} [style] 点位样式，可参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-divicon}
       *@param {Object} [style.flyTo] 图层飞入
       *@param {Array} [style.MouseEventType] 添加事件，默认点击事件['CLICK']
       *@param {Array} [style.isLayerClear] 是否清除图层之前添加的实体
       *@param {Object} [other] 其它
       *@param {Object} [other.pointHeight] DivIcon高度
       *@param {Object} [other.id] 每项id名称，用于获取id对应名称的值
       */
    addDivIcon(item, layerId, callback, style = {}, other = {}) {
        const _ts = this
        if (_ts._ImageryDataLayer[layerId]) {
            const _style = {
                ..._ts.publicStyle,
                ...style,
                ...item.style,
                ...{ datas: item },
                ...{ showLabel: false }
            }
            let itell = item
            if (itell.x == undefined && itell.y == undefined) {
                itell = _ts.getLngAndLat(item)
            }
            const _position = new KC.Position(itell.x, itell.y, item.pointHeight || other.pointHeight || 0)
            const _divIcon = new KC.DivIcon(_position, item[other.htmlName || 'html'].toString())
            _ts.addOverlay(_divIcon, layerId, _style, item, callback, other)
        } else {
            console.log('图层组中无' + layerId + '图层!')
        }
    }
    /**
       *根据图层id查询图层，然后往图层里面添加数据信息
       *@param {Object} dataArray 包含经纬度的数据集合
       *@param {Object} dataArray[0] 数据集合里的一项
       *@param {Object} dataArray[0].lineArr 每项样式设置,线字符串
       *@param {Object} [dataArray[0].style] 每项样式设置,可参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-polyline}
       http://10.8.88.186:8080/kcgis-doc/overlay/#kc-polyline
       *@param {Array} [dataArray[0].style.MouseEventType] 每项样式设置,添加事件，默认点击事件['CLICK']
       *@param {Array} [dataArray[0].style.showLabel] 每项样式设置,设置是否显示label
       *@param {Array} [dataArray[0].style.labelStyle] 每项样式设置,设置label样式，参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-label}
       *@param {String} layerId 图层唯一id
       *@param {Function} callback 点位点击回调
       *@param {Object} [style] 点位样式，可参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-polyline}
       *@param {Object} [style.flyTo] 图层飞入
       *@param {Array} [style.MouseEventType] 添加事件，默认点击事件['CLICK']
       *@param {Array} [style.showLabel] 设置是否显示label
       *@param {Array} [style.labelStyle] 设置label样式，参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-label}
       *@param {Array} [style.isLayerClear] 是否清除图层之前添加的实体
       *@param {Object} [other] 其它参数
       *@param {Object} [other.labelName] label名称，用于获取对应名称的值id
       *@param {Object} [other.id] 每项id名称，用于获取id对应名称的值
       */
    addPolylines(dataArray, layerId, callback, style = {}, other = {}) {
        try {
            const _ts = this
            _ts.addImageryDataLayers(dataArray, layerId, (ite) => {
                _ts.addPolyline(ite, layerId, callback, style, other)
            }, style)
        } catch (ex) {
            callback(ex)
        }
    }
    /**
       *往图层组对应下标图层添加数据信息
       *@param {Object} item 包含经纬度的数据
       *@param {Object} item.lineArr 每项样式设置,线字符串
       *@param {Object} [item.style] 每项样式设置,可参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-polyline}
       *@param {Array} [item.style.MouseEventType] 每项样式设置,添加事件，默认点击事件['CLICK']
       *@param {Array} [item.style.showLabel] 每项样式设置,设置是否显示label
       *@param {Array} [item.style.labelStyle] 每项样式设置,设置label样式，参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-label}
       *@param {String} layerId 图层唯一id
       *@param {Function} callback 点位点击回调
       *@param {Object} [style] 点位样式，可参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-polyline}
       *@param {Object} [style.flyTo] 图层飞入
       *@param {Array} [style.MouseEventType] 添加事件，默认点击事件['CLICK']
       *@param {Array} [style.showLabel] 设置是否显示label
       *@param {Array} [style.labelStyle] 设置label样式，参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-label}
       *@param {Array} [style.isLayerClear] 是否清除图层之前添加的实体
       *@param {Object} [other] 其它
       *@param {Object} [other.labelName] label名称，用于获取对应名称的值id
       *@param {Object} [other.id] 每项id名称，用于获取id对应名称的值
       */
    addPolyline(item, layerId, callback, style = {}, other = {}) {
        const _ts = this
        if (_ts._ImageryDataLayer[layerId]) {
            const _style = {
                ..._ts.publicStyle,
                ...style,
                ...item.style
            }
            const _polyline = new KC.Polyline(item.lineArr)
            _ts.addOverlay(_polyline, layerId, _style, item, callback, other)
        } else {
            console.log('图层组中无' + layerId + '图层!')
        }
    }
    /**
       *根据图层id查询图层，然后往图层里面添加数据信息
       *@param {Object} dataArray 包含经纬度的数据集合
       *@param {Object} dataArray[0] 数据集合里的一项
       *@param {Object} dataArray[0].polyArr 每项样式设置,面字符串
       *@param {Object} [dataArray[0].style] 每项样式设置,可参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-polygon}
  
       *@param {Array} [dataArray[0].style.MouseEventType] 每项样式设置,添加事件，默认点击事件['CLICK']
       *@param {Array} [dataArray[0].style.showLabel] 每项样式设置,设置是否显示label
       *@param {Array} [dataArray[0].style.labelStyle] 每项样式设置,设置label样式，参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-label}
       *@param {String} layerId 图层唯一id
       *@param {Function} callback 点位点击回调
       *@param {Object} [style] 点位样式，可参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-polygon}
       *@param {Object} [style.flyTo] 图层飞入
       *@param {Array} [style.MouseEventType] 添加事件，默认点击事件['CLICK']
       *@param {Array} [style.showLabel] 设置是否显示label
       *@param {Array} [style.labelStyle] 设置label样式，参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-label}
       *@param {Array} [style.isLayerClear] 是否清除图层之前添加的实体
       *@param {Object} [other] 其它参数
       *@param {Object} [other.labelName] label名称，用于获取对应名称的值id
       *@param {Object} [other.id] 每项id名称，用于获取id对应名称的值
       */
    addPolygons(dataArray, layerId, callback, style = {}, other = {}) {
        try {
            const _ts = this
            _ts.addImageryDataLayers(dataArray, layerId, (ite) => {
                _ts.addPolygon(ite, layerId, callback, style, other)
            }, style)
        } catch (ex) {
            callback(ex)
        }
    }
    /**
       *往图层组对应下标图层添加数据信息
       *@param {Object} item 包含经纬度的数据
       *@param {Object} item.polyArr 每项样式设置,面字符串
       *@param {String} [item.holes] 面字符串，经纬度之间用逗号隔开，点位用分号隔开
       *@param {Object} [item.style] 每项样式设置,可参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-polygon}
       *@param {Array} [item.style.MouseEventType] 每项样式设置,添加事件，默认点击事件['CLICK']
       *@param {Array} [item.style.showLabel] 每项样式设置,设置是否显示label
       *@param {Array} [item.style.labelStyle] 每项样式设置,设置label样式，参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-label}
       *@param {String} layerId 图层唯一id
       *@param {Function} callback 点位点击回调
       *@param {Object} [style] 点位样式，可参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-polygon}
       *@param {Object} [style.flyTo] 图层飞入
       *@param {Array} [style.MouseEventType] 添加事件，默认点击事件['CLICK']
       *@param {Array} [style.showLabel] 设置是否显示label
       *@param {Array} [style.labelStyle] 设置label样式，参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-label}
       *@param {Array} [style.isLayerClear] 是否清除图层之前添加的实体
       *@param {Object} [other] 其它
       *@param {Object} [other.labelName] label名称，用于获取对应名称的值id
       *@param {Object} [other.id] 每项id名称，用于获取id对应名称的值
       */
    addPolygon(item, layerId, callback, style = {}, other = {}) {
        const _ts = this
        if (_ts._ImageryDataLayer[layerId]) {
            const _style = {
                ..._ts.publicStyle,
                ...style,
                ...item.style
            }
            const isTwoArray = item.polyArr.some(index => {
                return Array.isArray(index)
            })
            if (isTwoArray) {
                item.polyArr.forEach((ite, index1) => {
                    const _polygon = new KC.Polygon(ite)
                    _ts.addOverlay(_polygon, layerId, _style, item, callback, other)
                })
            } else {
                const _polygon = new KC.Polygon(item.polyArr)
                if (item.holes) {
                    _polygon.holes = item.holes
                }
                _ts.addOverlay(_polygon, layerId, _style, item, callback, other)
            }
        } else {
            console.log('图层组中无' + layerId + '图层!')
        }
    }
    /**
       *根据图层组的下标值，设置对应图层的显示隐藏及透明度
       *@param {String} layerId 图层唯一id
       *@param {Object} item 对指定图层做透明度及显示隐藏操作
       *@param {float} item.alpha 设置图层透明度，0~1,data图层无效果
       *@param {bool} item.vis 设置图层显示隐藏,true|false
       */
    setOverlayLayer(layerId, item) {
        const _ts = this
        if (_ts._ImageryDataLayer[layerId]) {
            if (item.alpha != undefined) {
                _ts.overlayLayerAlpha(_ts._ImageryDataLayer[layerId].layer, item.alpha)
            }
            if (item.vis != undefined) {
                _ts.overlayLayerVis(_ts._ImageryDataLayer[layerId].layer, item.vis)
            }
        } else {
            console.log('图层组中无' + layerId + '图层!')
        }
    }
    /**
       *设置图层的透明度
       *@param {Object} layer 图层对象
       *@param {float} alpha 设置图层透明度，0~1
       */
    overlayLayerAlpha(layer, alpha) {
        if (layer) {
            layer.alpha = alpha
        }
    }
    /**
       *设置对应图层的显示隐藏
       *@param {Object} layer 图层对象
       *@param {bool} vis 设置图层显示隐藏,true|false
       */
    overlayLayerVis(layer, vis) {
        if (layer) {
            layer.show = vis
        }
    }
    /**
       *根据图层下标值移除对应图层，当不传值时，移除图层组所有图层
       *@param {String} layerId 图层唯一id
       */
    removeOverlayLayer(layerId, _viewer) {
        const _ts = this
        if (layerId && _ts._ImageryDataLayer[layerId]) {
            _ts.removeAllLayer(_ts._ImageryDataLayer[layerId], _viewer || _ts._viewer, layerId)
            delete _ts._ImageryDataLayer[layerId]
        } else if (layerId == undefined) {
            var dataLayer = Object.keys(_ts._ImageryDataLayer)
            if (dataLayer.length > 0) {
                for (const key in _ts._ImageryDataLayer) {
                    _ts.removeAllLayer(_ts._ImageryDataLayer[key], _viewer || _ts._viewer, layerId)
                    delete _ts._ImageryDataLayer[key]
                }
            }
        }
    }
    /**
       *移除所有图层
       *@param {Object} layer 图层对象
       */
    removeAllLayer(item, _viewer, layerId) {
        const _ts = this
        if (item.type) {
            if (KC.TerrainType[item.type.toUpperCase()]) {
                _ts.removeTerrain(_viewer)
            } else if (item.type == 'Track') {
                _ts.removeTrackController(item.layer)
            } else if (item.type == 'data') {
                _ts.removedataLayer(item.layer, _viewer)
                if (item.layerType === 'heatLayer') {
                    $(layerId).remove();
                }
            } else {
                _ts.removeImgLayer(item.layer, _viewer)
            }
        }
    }
    /**
       *移除对应data图层
       *@param {Object} layer 图层对象
       */
    removedataLayer(layer, _viewer) {
        const _ts = this
        try {
            if (layer) {
                layer.clear()
                _viewer.removeLayer(layer)
            }
        } catch (ex) {
            _viewer.removeLayer(layer)
        }
    }
    /**
       *飞入图层，全图显示对应图层
       *@param {bool} flyTo 是否飞入
       *@param {Object} layer 图层对象
       */
    flyTo(flyTo, layer) {
        if (flyTo) {
            this._viewer.flyTo(layer)
        }
    }
    /**
       *给画布绑定事件
       *@param {String} type 绑定事件类型,参考Cesium.ScreenSpaceEventType
       *@param {funtion} callback 绑定事件回调
       */
    setInputAction(type, callback) {
        try {
            const _ts = this
            _ts._handler.setInputAction(callback, Cesium.ScreenSpaceEventType[type])
        } catch (ex) {
            callback(ex)
        }
    }
    /**
       *获取Viewer对象
       */
    getViewer() {
        return this._viewer
    }
    /**
       *移除画布绑定事件
       *@param {String} type 绑定事件类型,参考{@link https://cesium.com/learn/cesiumjs/ref-doc/global.html?classFilter=ScreenSpaceEventType#ScreenSpaceEventType}
       */
    removeInputAction(type, callback) {
        try {
            const _ts = this
            _ts._handler.removeInputAction(Cesium.ScreenSpaceEventType[type])
        } catch (ex) {
            callback(ex)
        }
    }

    /**
       * 根据绑定事件返回点位信息查询是否点中图层，点中返回数据
       *@param {String} layerId 图层id
       *@param {String} event 绑定事件点位坐标信息
       *@param {funtion} callback 事件回调
       */
    queryDataLayer(layerId, event, callback) {
        const _ts = this
        const pick = _ts._viewer.scene.pick(event.position)
        if (pick && pick.id && pick.id.length > 1) {
            callback(pick)
        }
    }
    /**
       * 更新图标图片
       *@param {String} layerId 图层id
       *@param {String} id 数组对应id
       *@param {String} style 图片样式
       *@param {String} style.imgUrl 图片路径
       *@param {String} style.imgWidth 图片宽度
       *@param {String} style.imgHeight 图片高度
       *@param {bool} style.oldReplace 是否用当前点位图标去替换上一次点击图标
       */
    updataOverlay(layerId, id, style, other = {}) {
        const _ts = this
        if (_ts._ImageryDataLayer[layerId]) {
            const overlay = _ts._ImageryDataLayer[layerId].PointArr[id]
            if (overlay) {
                if (_ts._oldOverlay && style.oldReplace) {
                    _ts._oldOverlay.icon = overlay.icon
                    _ts._oldOverlay.size = overlay.size
                }
                _ts._oldOverlay = overlay
                _ts._oldOverlay.icon = style.imgUrl
                if (style.imgWidth && style.imgHeight) {
                    _ts._oldOverlay.size = [style.imgWidth, style.imgHeight]
                }
            }
        } else {
            console.log('图层组中无' + layerId + '图层!')
        }
    }
    /**
       * 绘图
       * @param {Object} type 绘图类型 点（'point'）、图标点（'billboard'）、线('polyline')、面('polygon')、圆('circle')、矩形（'rectangle'）、进攻箭头('attack_arrow')、双箭头('double_arrow')、
       *                               直箭头('fine_arrow')、燕尾箭头('tailed_attack_arrow')、聚集地('gathering_place')
       * @param {Object} callBack 回调事件
       * @param {Object} style 绘图样式
       */
    addDrawing(type, callBack, style = {}) {
        const _ts = this
        try {
            _ts._ploUtil && _ts._ploUtil.draw(type, overlay => {
                callBack(overlay)
            }, style)
        } catch (e) {
            callBack(e)
        }
    }
    /**
       * 绘图上图
       * @param {string} layerId 图层id
       * @param {Object} overlay 绘图数据
       * @param {Object} style
       * @param {bool} style.isPloUtilEdit 绘图编辑
       * @param {string} [style.imgUrl] billboard点位图标
       * @param {string} [style.imgWidth] billboard点位宽度
       * @param {string} [style.imgHeight] billboard点位高度
       * @param {string} [style....] 覆盖物其他样式参数
       * @param {Object} callback 点击回调
       */
    addDrawToLayer(layerId, overlay, style = {}, callback, other = {}) {
        const _ts = this
        if (_ts._ImageryDataLayer[layerId]) {
            const _style = {
                ..._ts.publicStyle,
                ...style
            }
            if (overlay.type == 'billboard') {
                if (_style.imgUrl) {
                    overlay.icon = _style.imgUrl
                }
                if (_style.imgWidth && _style.imgHeight) {
                    overlay.size = [_style.imgWidth, _style.imgHeight]
                }
            }
            _ts.addOverlay(overlay, layerId, _style, overlay.queryDatas || {}, callback, other)
            if (_style.isPloUtilEdit) {
                _ts._ploUtil.edit(overlay)
            }
        } else {
            console.log('图层组中无' + layerId + '图层!')
        }
    }
    /**
       * 移除当前绘图
       * @param {Object} layerId 图层id
       *@param {Object} overlay 覆盖物
       */
    removeDrawToLayer(layerId, overlay) {
        const _ts = this
        if (_ts._ImageryDataLayer[layerId]) {
            _ts._ImageryDataLayer[layerId].layer.removeOverlay(overlay)
        }
    }
    queryCheckedOverLays(layerId, id) {
        const _ts = this
        return _ts._ImageryDataLayer[layerId].PointArr[id]
    }
    /**
       * 编辑当前绘图
       *@param {Object} overlay 覆盖物
       *@param {Object} style 样式
       *@param {string} [items.imgUrl] billboard点位图标
       *@param {string} [items.imgWidth] billboard点位宽度
       *@param {string} [items.imgHeight] billboard点位高度
       @param {string} [items....] 覆盖图层其它样式参数
       */
    editDrawToLayer(overlay, style = {}) {
        const _ts = this
        if (overlay.type == 'billboard') {
            if (style.imgUrl) {
                overlay.icon = style.imgUrl
            }
            if (style.imgWidth && style.imgHeight) {
                overlay.size = [style.imgWidth, style.imgHeight]
            }
        }
        overlay.setStyle(style)
        _ts._ploUtil.edit(overlay)
    }
    /**
       * 测量与导出
       * @param {string} type 测量距离distance、面积area、高度(建筑支撑)height、导出exportScene、clearAll清除测量
       */
    measureAndExport(type) {
        const _ts = this
        if (type == 'clearAll') {
            if (_ts._measureUtil) {
                _ts._measureUtil.clearAll()
            }
        } else if (type == 'exportScene') {
            _ts._viewer.exportScene()
        } else {
            _ts._measureUtil.measure(type)
        }
    }
    /**
       * 获取点线面缓冲范围值
       *@param {object} item 经纬度对象集合
       *@param {string} bufferType 缓冲类型
       *@param {number} buffRadius 缓冲半径
       */
    queryGeoTools(item, bufferType, buffRadius) {
        let buffArr = new Array()
        if (bufferType == 'polyline') {
            buffArr = KC.GeoTools.polylineBuffer(item, buffRadius)
        } else if (bufferType == 'point' || bufferType == 'billboard') {
            buffArr = KC.GeoTools.pointBuffer(item, buffRadius)
        } else {
            buffArr = KC.GeoTools.polygonBuffer(item, buffRadius)
        }
        return buffArr
    }

    addHeatLayerToArr(layerId, style = {}, _viewer) {
        const _ts = this
        const self_viewer = _viewer || _ts._viewer;
        if (!_ts._ImageryDataLayer[layerId]) {
            const layer = new KC.HeatLayer(layerId, style)
            self_viewer.addLayer(layer)
            _ts._ImageryDataLayer[layerId] = { layer, type: 'data', layerType: 'heatLayer', PointArr: {} }
        } else {
            console.log('id:' + layerId + '的图层已存在，已加载为' + _ts._ImageryDataLayer[layerId].layerType + '热力图层')
        }
    }
    /**
 * 添加热力图
 * @param {Object} positions
 */
    addHeatLayer(positions, layerId) {
        const _ts = this
        if (_ts._ImageryDataLayer[layerId]) {
            if (positions && positions.length) {
                let list = [];
                for (var i = 0; i < positions.length; i++) {
                    let pos = positions[i];
                    list.push(new KC.Position(pos.x, pos.y));
                }
                _ts._ImageryDataLayer[layerId].layer.setPositions(list);
                $(layerId).css({ display: "none" });
            }
        } else {
            console.log('图层组中无' + layerId + '图层!')
        }
    }

    /*
   *添加一个新的聚合图层到图层组中，便于控制显示隐藏
   */
    addZdyClusterToArr(layerId) {
        const _ts = this
        if (!_ts._ImageryDataLayer[layerId]) {
            const layer = new Cesium.CustomDataSource(layerId)
            _ts._viewer.dataSources.add(layer);
            _ts._ImageryDataLayer[layerId] = { layer, type: 'data', layerType: 'ZdyClusterToArr', PointArr: {} }
        } else {
            console.log('id:' + layerId + '的图层已存在，已加载为' + _ts._ImageryDataLayer[layerId].layerType + '聚合图层')
        }
    }
    addZdyClusterLayer(dataArray, layerId, style, callback) {
        const _ts = this
        try {
            let dataSource = _ts._ImageryDataLayer[layerId].layer;
            // 设置聚合参数
            dataSource.clustering.enabled = true;
            dataSource.clustering.pixelRange = style.clusterStyle.pixelRange;
            dataSource.clustering.minimumClusterSize = style.clusterStyle.distance;
            dataArray.forEach((pos, index) => {
                const entity = dataSource.entities.add({
                    position: Cesium.Cartesian3.fromDegrees(
                        Number(pos.lng),
                        Number(pos.lat),
                        Number(pos.height) || 0
                    ),
                    billboard: {
                        image: style.imgUrl,
                        width: style.imgWidth,
                        height: style.imgHeight,
                    },
                });
                entity._billboard.cs = pos;
                entity.click = function (e) {
                    callback(pos, e);
                };
            });
            // 添加监听函数
            dataSource.clustering.clusterEvent.addEventListener(function (
                clusteredEntities,
                cluster
            ) {
                cluster.billboard.show = true;
                let allCount = dataSource.entities.values.length || 0;
                for (let key in style.clusterStyle.gradient) {
                    if (clusteredEntities.length >= allCount * key) {
                        let numLength = String(clusteredEntities.length).length;
                        if (style.clusterIcon) {

                        } else {
                            cluster.billboard.image = _ts._drawClustering(
                                style.clusterStyle.size,
                                style.clusterStyle.gradient[key],
                                numLength
                            );
                        }
                        cluster.billboard.id = cluster.label.id;
                        cluster.label.show = true;
                        cluster.label.font = style.clusterStyle.font;
                        cluster.label.fillColor = style.clusterStyle.fontColor;
                        cluster.label.verticalOrigin = Cesium.VerticalOrigin.CENTER; //垂直位置
                        cluster.label.horizontalOrigin = Cesium.HorizontalOrigin.CENTER; //水平位置
                        cluster.label.disableDepthTestDistance = Number.POSITIVE_INFINITY;
                    }
                }
            });
        } catch (ex) {
            callback(ex)
        }
    }
    _drawClustering(tsize, color, numLength) {
        let size = tsize * (numLength + 1);
        let startAngle = -Math.PI / 12;
        let angle = Math.PI / 2;
        let intervalAngle = Math.PI / 6;
        let canvas = document.createElement("canvas");
        canvas.width = size;
        canvas.height = size;
        let context2D = canvas.getContext("2d");
        context2D.save();
        context2D.scale(size / 24, size / 24);
        context2D.beginPath();
        context2D.arc(12, 12, 6, 0, 2 * Math.PI);
        context2D.fillStyle = color.toCssColorString();
        context2D.fill();
        context2D.closePath();
        context2D.lineWidth = 2;
        for (let i = 0; i < 3; i++) {
            context2D.beginPath();
            context2D.arc(12, 12, 8, startAngle, startAngle + angle, false);
            context2D.strokeStyle = color.withAlpha(0.4).toCssColorString();
            context2D.stroke();
            context2D.arc(12, 12, 10, startAngle, startAngle + angle, false);
            context2D.strokeStyle = color.withAlpha(0.2).toCssColorString();
            context2D.stroke();
            context2D.closePath();
            startAngle = startAngle + angle + intervalAngle;
        }
        context2D.restore();
        return canvas.toDataURL();
    }
    /**
       * 加载图层
       * @param {Object} layerId 图层id
       * @param {Object} items 底图配置参数
       * @param {Object} [items.name] 底图名称
       * @param {Object} [items.type] 底图类型
       * @param {Object} [items.layerUrl] 底图链接地址
       * @param {Object} [items.show] 底图是否显示
       * @param {Object} [items.style] 底图样式
       * @param {Object} [items.key] 底图密钥
       * @param {Object} [items....] 底图其它属性
       */
    addBaseLayer(layerId, items, _viewer) {
        const _ts = this
        if (!_ts._ImageryDataLayer[layerId]) {
            _ts._ImageryDataLayer[layerId] = {
                type: items.type,
                layerType: 'imglayer',
                layer: _ts.addLayers(items, _viewer || _ts._viewer)
            }
        } else {
            console.log('id:' + layerId + '的图层已存在，已加载为' + _ts._ImageryDataLayer[layerId].layerType + '底图图层')
        }
    }
    /**
           * 加载范围外界覆盖图层
           */
    addRangeLayer(geometry, hpositions, style) {
        const _ts = this
        const _holes = new Array()
        const _line = new Array()
        if (geometry.type == 'MultiLineString') {
            geometry.coordinates.forEach((item, index) => {
                var strqq = new Array()
                item.forEach((ite, inde) => {
                    strqq.push(ite[0])
                    strqq.push(ite[1])
                })
                _holes.push({ positions: Cesium.Cartesian3.fromDegreesArray(strqq) })
                _line.push(strqq)
            })
        } else {
            var strqq = new Array()
            geometry.coordinates.forEach((item, index) => {
                strqq.push(item[0])
                strqq.push(item[1])
            })
            _holes.push({ positions: Cesium.Cartesian3.fromDegreesArray(strqq) })
            _line.push(strqq)
        }

        if (_ts._viewer.entities.removeAll) {
            _ts._viewer.entities.removeAll()
        }
        _ts._viewer.entities.add({
            polygon: {
                hierarchy: {
                    positions: Cesium.Cartesian3.fromDegreesArray(hpositions),
                    holes: _holes
                },
                heightReference: Cesium.HeightReference.CLAMP_TO_GROUND,
                material: Cesium.Color.fromCssColorString(style.polygonColor || '#ebff86'),
                // height: 0,
                outline: true
            }
        })
        _line.forEach((item, index) => {
            _ts._viewer.entities.add({
                polyline: {
                    positions: Cesium.Cartesian3.fromDegreesArray(item),
                    width: style.polylineWidth || 3,
                    material: Cesium.Color.fromCssColorString(style.polylineColor || '#ebff86'),
                    clampToGround: true
                }
            })
        })
    }
    /**
       * 根据id设置图层显示位置
       * @param {Object} layerId 图层id
       * @param {String} state LEFT显示 Scene＃imagerySplitPosition 左侧的ImageryLayer;NONE始终显示ImageryLayer;RIGHT在 Scene＃imagerySplitPosition 右侧显示ImageryLayer。
       */
    setSplitDirection(layerId, state) {
        const _ts = this
        if (_ts._ImageryDataLayer[layerId]) {
            _ts._ImageryDataLayer[layerId].layer.splitDirection = Cesium.SplitDirection[state]
        }
    }
    setSplitEnable(enable, _viewer) {
        const viewer = _viewer || this._viewer
        viewer.mapSplit.enable = enable
    }
    initRollerShutter(netToken, item, mapSplit = false) {
        let self = this;
        self.removeOverlayLayer('swiper-yunyao_' + mapSplit)
        axios.post(netToken.generateToken + '?username=' + netToken.username + '&password=' + netToken.password, {}, {
            contentType: 'application/x-www-form-urlencoded', // 必须
            dataType: 'json', // 必须
            type: 'post',
            jsonp: 'callback'
        }).then(res => {
            const layerUrl = netToken.netUrl + '/access/rest/services/' + item.serviceName + '/Transfer';
            const url = layerUrl +
                '?style=default&tilematrixset=EPSG%3A3857&Service=WMTS&Request=GetTile&Version=1.0.0&Format=image%2Fpng&TileMatrix={TileMatrix}&TileCol={TileCol}&TileRow={TileRow}'
            const resource_Url = new window.Cesium.Resource({
                url: url,
                headers: {
                    'x-gistack-token': res.data['x-gistack-token'],
                    'security-token': res.data['security-token']
                }
            })
            const baseMap = {
                name: item.serviceName,
                type: 'wmts',
                url: resource_Url,
                layers: item.serviceName,
                t_index: -1,
                enablePickFeatures: false,
                parameters: {
                    srs: 'EPSG:3857',
                    format: 'image/png'
                }
            }
            if (mapSplit) {
                baseMap.t_mapSplit = true
            }
            this.addBaseLayer('swiper-yunyao_' + mapSplit, baseMap)
        })
    }
    /**
       * 获取或设置图像拆分器在视口中的位置。有效值在0.0到1.0之间。
       * @param {float} data 图像拆分器在视口中的位置,0.0到1.0之间
       */
    setSplitPositionValue(data) {
        const _ts = this
        if (data) {
            _ts._viewer.scene.splitPosition = data
        } else {
            return _ts._viewer.scene.splitPosition
        }
    }
    /**
       *添加一个新的图层到图层组中，历史轨迹图层
       *@param {String} layerId 图层唯一id
       */
    addTrackControllerToArr(layerId) {
        const _ts = this
        if (!_ts._ImageryDataLayer[layerId]) {
            const layer = new KC.TrackController(_ts._viewer)
            _ts._ImageryDataLayer[layerId] = {
                layer: layer,
                layerType: 'TrackController',
                type: 'Track'
            }
        } else {
            console.log('id:' + layerId + '的图层已存在，已加载为' + _ts._ImageryDataLayer[layerId].layerType + '动图图层')
        }
    }
    mercatorTolonlat(mercator) {
        var lonlat = { x: 0, y: 0 }
        var x = mercator[0] / 20037508.34 * 180
        var y = mercator[1] / 20037508.34 * 180
        y = 180 / Math.PI * (2 * Math.atan(Math.exp(y * Math.PI / 180)) - Math.PI / 2)
        lonlat.x = x
        lonlat.y = y
        return lonlat
    }
    /**
       *往图层组对应下标图层添加数据信息
       *@param {Object} positions 包含经纬度的数据
       *@param {String} layerId 图层唯一id
       *@param {Object} [style] 样式
       *@param {string} [style.isModel] 是否使用model
       *@param {string} [style.mpUrl] 历史轨迹移动点url
       *@param {string} [style.mpStyle] 历史轨迹移动点样式
       *@param {Number} [style.duration] 历史轨迹间隔时间，单位：秒
       *@param {string} [style.isPath] 历史轨迹路径显示
       *@param {string} [style.pathStyle] 历史轨迹路径样式
       */
    addTrackController(positions, layerId, style) {
        const _ts = this
        if (_ts._ImageryDataLayer[layerId]) {
            const _style = {
                ...{
                    'isModel': false,
                    'mpUrl': './images/markerbig_select.png',
                    'mpStyle': {
                        'scale': 1
                    },
                    'duration': 30,
                    'isPath': true,
                    'pathStyle': {
                        'width': 3
                    }
                },
                ...style
            }
            const track = new KC.Track(positions, _style.duration, (position) => {
            })
            if (_style.isModel) {
                track.setModel(_style.mpUrl, _style.mpStyle)
            } else {
                track.setBillboard(_style.mpUrl, _style.mpStyle)
            }
            track.setPath(_style.isPath, _style.pathStyle)
            _ts._ImageryDataLayer[layerId].layer.addTrack(track)
        }
    }
    trackPlay(layerId) {
        const _ts = this
        _ts._ImageryDataLayer[layerId].layer.play()
    }
    trackPause(layerId) {
        const _ts = this
        _ts._ImageryDataLayer[layerId].layer.pause()
    }
    trackRestore(layerId) {
        const _ts = this
        _ts._ImageryDataLayer[layerId].layer.restore()
    }
    trackChangeSpeed(layerId, speed) {
        const _ts = this
        _ts._ImageryDataLayer[layerId].layer.changeSpeed(speed)
    }
    /**
       *往图层组对应下标图层添加数据信息
       *@param {Object} positions 包含经纬度的数据
        *@param {String} layerId 图层唯一id
       *@param {Function} callback 点位点击回调
       *@param {Number} height 高度
       *@param {Object} [style] 点位样式，可参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-waterprimitive}
       */
    addWaterPrimitive(positions, layerId, style = {}) {
        const _ts = this
        if (_ts._ImageryDataLayer[layerId]) {
            const _style = {
                ...{
                    baseWaterColor: Cesium.Color.AQUA.withAlpha(0.3),
                    normalMap: './images/waterNormalsSmall.jpg',
                    frequency: 1000.0,
                    animationSpeed: 0.01,
                    amplitude: 10,
                    specularIntensity: 10
                },
                ...style
            }
            const _water = new KC.WaterPrimitive(positions)
            _water.setStyle(_style)
            _ts._ImageryDataLayer[layerId].layer.addOverlay(_water)
        }
    }
    /**
       * 移除历史轨迹图层
       */
    removeTrackController(layer) {
        const _ts = this
        layer.clear()// 移除图层数据
    }

    /* 移除高程图层
      *@param {Object} item 高程地址信息
      */
    removeTerrain(_viewer) {
        const _ts = this
        _viewer.scene.terrainProvider = new Cesium.EllipsoidTerrainProvider({})// 清空高程图层
    }
    /**
       * 移除添加img图层
       */
    removeImgLayer(layer, _viewer) {
        const _ts = this
        _viewer.imageryLayers.remove(layer)// 移除图层数据
    }
}
/**
 * Plug类gis功能接口
 */
class Plug {
    constructor(comp) {
        this.comp = comp
    }
    /**
       * 弹出弹窗（带样式）
       * @param {String} x 经度
       * @param {String} y 纬度
       * @param {String} title 弹窗标题
       * @param {Object} content 弹窗样式
       * @param {String} [height] 高度
       */
    popUpStyleBillboard(x, y, title, content, height = 0) {
        this.comp.popUpStyleBillboard(x, y, title, content, height)
    }
    /**
       * 描点方法
       *@param {Object} [style] 点位样式，可参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-billboard}
       *@param {bool} [style.flyTo] 图层飞入
       *@param {Function} lcallback 描点回调
       *@param {Function} callback 点位点击回调
       */
    tracingBillboard(style = { removeClick: true }, lcallback = () => { }, callback = () => { }) {
        this.comp.setInputAction('LEFT_CLICK', (movement) => {
            const objPoint = this.comp.queryLayersPoint(movement)
            this.comp.addVectorToArr('tracingBillboard')
            lcallback(objPoint.movementPoint)
            this.comp.addBillboards([objPoint.movementPoint], 'tracingBillboard', callback, style)
            if (style.removeClick == true) {
                this.comp.removeInputAction('LEFT_CLICK')
            }
        })
    }
    isDrawToLayer(type, overlay) {
        if (type === 'circle') {
            if (overlay.radius === 0) {
                return false
            }
        } else if (type === 'rectangle') {
            var rectangle = new Cesium.Rectangle(overlay.positions[0].lng, overlay.positions[0].lat, overlay.positions[1].lng, overlay.positions[1].lat)
            if (rectangle.width === 0 || rectangle.height === 0) {
                return false
            }
        } else if (type === 'polygon') {
            if (overlay.positions.length <= 2 || (overlay.positions.length === 3 && ((overlay.positions[0].lng === overlay.positions[1].lng && overlay.positions[0].lat === overlay.positions[1].lat) || (overlay.positions[1].lng === overlay.positions[2].lng && overlay.positions[1].lat === overlay.positions[2].lat)))) {
                return false
            }
        }
        return true
    }
    /**
       *清空图层
       */
    clearLayers() {
        this.comp.removeInputAction('LEFT_CLICK')
        this.comp.removeOverlayLayer()
    }
    /**
       *往图层里面添加数据信息
       *@param {Object} PointArr 包含经纬度的数据集合||imgUrl单个图标图片地址
       *@param {Object} [style] 点位样式，可参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-point}
       *@param {bool} [style.flyTo] 图层飞入
       *@param {Function} callback 点位点击回调
       */
    showPoints(PointArr, style, callback, layerId) {
        this.comp.addVectorToArr(layerId || 'showPoints')
        this.comp.addPoints(PointArr, layerId || 'showPoints', callback, style)
    }
    /**
       *往图层里面添加数据信息
       *@param {Object} PointArr 包含经纬度的数据集合||imgUrl单个图标图片地址
       *@param {Object} [style] 点位样式，可参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-point}
       *@param {bool} [style.flyTo] 图层飞入
       *@param {Function} callback 点位点击回调
       */
    showClusterPoints(PointArr, style, callback, layerId) {
        this.comp.addClusterToArr(layerId || 'showClusterPoints')
        this.comp.addPoints(PointArr, layerId || 'showClusterPoints', callback, style)
    }
    /**
       *往图层里面添加数据信息
       *@param {Object} PointArr 包含经纬度的数据集合||imgUrl单个图标图片地址
       *@param {Object} [style] 点位样式，可参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-billboard}
       *@param {bool} [style.flyTo] 图层飞入
       *@param {Function} callback 点位点击回调
       */
    showBillboards(PointArr, style, callback, layerId) {
        this.comp.addVectorToArr(layerId || 'showBillboards')
        this.comp.addBillboards(PointArr, layerId || 'showBillboards', callback, style)
    }
    /**
       *往图层里面添加数据信息(由于聚合id写死，聚合样式为第一个的样式，可以清空实现更换)
       *@param {Object} PointArr 包含经纬度的数据集合||imgUrl单个图标图片地址
       *@param {Object} [style] 点位样式，可参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-billboard}
       *@param {bool} [style.flyTo] 图层飞入
       *@param {Function} callback 点位点击回调
       *@param {Object} [ClusterStyle] 聚合图层样式
       */
    showClusterBillboards(PointArr, style, callback, ClusterStyle = {}, layerId) {
        this.comp.addClusterToArr(layerId || 'showClusterBillboards', ClusterStyle)
        this.comp.addBillboards(PointArr, layerId || 'showClusterBillboards', callback, style)
    }
    /**
       *往图层里面添加数据信息
       *@param {Object} PointArr 包含经纬度的数据集合||imgUrl单个图标图片地址
       *@param {Object} [style] 点位样式，可参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-billboard}
       *@param {bool} [style.flyTo] 图层飞入
       *@param {Function} callback 点位点击回调
       */
    showCircles(PointArr, style, callback, layerId) {
        this.comp.addVectorToArr(layerId || 'showCircles')
        this.comp.addCircles(PointArr, layerId || 'showCircles', callback, style)
    }
    /**
       * 设置指定值获取对应材质
       * @param {String} name 材质类名
       * @param {String} style 材质样式
       */
    getMaterial(name, style) {
        return this.comp.getMaterial(name, style)
    }
    /**
       * 更新图标图片
       *@param {String} id 数组对应id
       *@param {String} style 图片样式
       *@param {String} style.imgUrl 图片路径
       *@param {String} style.imgWidth 图片宽度
       *@param {String} style.imgHeight 图片高度
       *@param {bool} style.oldReplace 是否用当前点位图标去替换上一次点击图标
       */
    updataOverlay(id, style, other = {}, layerId) {
        this.comp.updataOverlay(layerId || 'showBillboards', id, style, other)
    }

    /**
       *往图层里面添加数据信息
       *@param {Object} PointArr 包含经纬度的数据集合||imgUrl单个图标图片地址
       *@param {Object} [style] 点位样式，可参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-label}
       *@param {bool} [style.flyTo] 图层飞入
       *@param {Function} callback 点位点击回调
       */
    showLabels(PointArr, style, callback, layerId) {
        this.comp.addVectorToArr(layerId || 'showLabels')
        this.comp.addLabels(PointArr, layerId || 'showLabels', callback, style)
    }
    /**
       *往图层里面添加数据信息
       *@param {Object} PointArr 包含经纬度的数据集合||imgUrl单个图标图片地址
       *@param {Object} [style] 点位样式，可参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-label}
       *@param {bool} [style.flyTo] 图层飞入
       *@param {Function} callback 点位点击回调
       */
    showDivIcons(PointArr, style, callback, layerId) {
        this.comp.addHtmlToArr(layerId || 'showDivIcons')
        this.comp.addDivIcons(PointArr, layerId || 'showDivIcons', callback, style)
    }
    /**
       *往图层里面添加数据信息
       *@param {Object} PointArr 包含经纬度的数据集合||imgUrl单个图标图片地址
       *@param {Object} [style] 点位样式，可参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-label}
       *@param {bool} [style.flyTo] 图层飞入
       *@param {Function} callback 点位点击回调
       */
    showBillboardPrimitives(PointArr, style, callback, layerId) {
        this.comp.addPrimitiveToArr(layerId || 'showBillboardPrimitives')
        this.comp.addBillboardPrimitives(PointArr, layerId || 'showBillboardPrimitives', callback, style)
    }
    /**
       *往图层里面添加数据信息
       *@param {Object} PointArr 包含经纬度的数据集合||lineArr线路径字符串
       *@param {Object} [style] 点位样式，可参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-label}
       *@param {bool} [style.flyTo] 图层飞入
       *@param {Function} callback 点位点击回调
       */
    showPolylines(PointArr, style, callback, layerId) {
        this.comp.addVectorToArr(layerId || 'showPolyline')
        this.comp.addPolylines(PointArr, layerId || 'showPolyline', callback, style)
    }
    /**
       *往图层里面添加数据信息
       *@param {Object} PointArr 包含经纬度的数据集合||polyArr 面字符串，经纬度之间用逗号隔开，点位用分号隔开
       *@param {Object} [style] 点位样式，可参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-label}
       *@param {bool} [style.flyTo] 图层飞入
       *@param {Function} callback 点位点击回调
       */
    showPolygons(PointArr, style, callback, layerId) {
        this.comp.addVectorToArr(layerId || 'showPolygons')
        this.comp.addPolygons(PointArr, layerId || 'showPolygons', callback, style)
    }
    /**
       *往图层里面添加数据信息
       *@param {Object} PointArr 包含经纬度的数据集合||polyArr 面字符串，经纬度之间用逗号隔开，点位用分号隔开
       *@param {Object} [style] 点位样式，可参考{@link http://10.8.88.186:8080/kcgis-doc/overlay/#kc-label}
       *@param {bool} [style.flyTo] 图层飞入
       */
    showWaterPrimitive(PointArr, style, layerId) {
        this.comp.addPrimitiveToArr(layerId || 'showWaterPrimitive')
        this.comp.addWaterPrimitive(PointArr, layerId || 'showWaterPrimitive', style)
    }
    /**
       * 绘图
       * @param {Object} style 绘图样式
       * @param {Object} type 绘图类型 (html)、点（'point'）、图标点（'billboard'）、线('polyline')、面('polygon')、圆('circle')、矩形（'rectangle'）、进攻箭头('attack_arrow')、双箭头('double_arrow')、
       *                               直箭头('fine_arrow')、燕尾箭头('tailed_attack_arrow')、聚集地('gathering_place')
       * @param {Object} callBack 回调事件
       * @param {Object} text type为html时文本参数
       */
    showDrawing(style, type, lcallback = () => { }, callback = () => { }, text, layerId) {
        this.comp.addVectorToArr(layerId || 'showDrawing')
        if (type == 'html') {
            this.comp.addDrawing('point', (overlay) => {
                overlay.setStyle({ 'show': false })
                overlay.setLabel(text || '', style.labelStyle || {})
                this.comp.addDrawToLayer(layerId || 'showDrawing', overlay, {}, callback)
            }, style)
        } else {
            this.comp.addDrawing(type, (overlay) => {
                if (this.isDrawToLayer(type, overlay)) {
                    lcallback(overlay)
                    this.comp.addDrawToLayer(layerId || 'showDrawing', overlay, {}, callback)
                } else {
                    lcallback(false)
                }
            }, style)
        }
    }
    editDrawToLayer(overlay, style, layerId) {
        this.comp.editDrawToLayer(overlay, style)
    }
    removeDrawToLayer(overlay, layerId) {
        this.comp.removeDrawToLayer(layerId || 'showDrawing', overlay)
    }
    /**
       * 测量与导出
       * @param {string} type 测量距离distance、面积area、高度(建筑支撑)height、导出exportScene、clearAll清除测量
       */
    measureAndExport(type) {
        this.comp.measureAndExport(type)
    }
    /**
       * 缓存分析边界获取
       *overlay 分析数据
       */
    queryDataTools(overlay) {
        const obj = {}
        const P = this.comp.P
        if (overlay.type == 'circle') {
            obj.positions = P.parsePolygonCoordToArray(this.comp.queryGeoTools(overlay.center, 'point', overlay.radius))
            obj.center = P.parsePointCoordToArray(overlay.center)
        } else if (overlay.type == 'rectangle') {
            const east = (overlay.positions[0]._lng < overlay.positions[1]._lng ? overlay.positions[0]._lng : overlay.positions[1]._lng) / 180 * Math.PI
            const north = (overlay.positions[0]._lat < overlay.positions[1]._lat ? overlay.positions[0]._lat : overlay.positions[1]._lat) / 180 * Math.PI
            const west = (overlay.positions[0]._lng > overlay.positions[1]._lng ? overlay.positions[0]._lng : overlay.positions[1]._lng) / 180 * Math.PI
            const south = (overlay.positions[0]._lat > overlay.positions[1]._lat ? overlay.positions[0]._lat : overlay.positions[1]._lat) / 180 * Math.PI
            obj.positions = P.parsePolygonCoordToArray(this.comp.initCurrentExtent({ 'east': east, 'north': north, 'south': south, 'west': west }))
            const centerX = (overlay.positions[0]._lng + overlay.positions[1]._lng) / 2
            const centerY = (overlay.positions[0]._lat + overlay.positions[1]._lat) / 2
            obj.center = P.parsePointCoordToArray([centerX, centerY])
        } else if (overlay.type == 'polygon') {
            obj.positions = P.parsePolygonCoordToArray(overlay.positions)
            obj.center = P.parsePointCoordToArray(overlay.center)
        } else if (overlay.type == 'polyline') {
            obj.positions = P.parsePolylineCoordToArray(overlay.positions)
            obj.center = P.parsePointCoordToArray(overlay.center)
        } else {
            obj.positions = P.parsePolylineCoordToArray(overlay.position)
            if (overlay.center) {
                obj.center = P.parsePointCoordToArray(overlay.center)
            }
        }
        return obj
    }
    /**
       * 数据处理
       *datas 分析数据
       *type拼接的数据类型polygon，polyline
       */
    datasProcessing(datas, type, key = 'mapPoint') {
        const PointArr = []
        datas.forEach((item, index) => {
            if (typeof item[key] === 'string') {
                item[key] = item[key].replaceAll('"', '')
            }
            const dataPoint = eval(item[key])
            if (type == 'polygon') {
                item.polyArr = dataPoint
            } else if (type == 'polyline') {
                item.lineArr = dataPoint
            }
            PointArr.push(item)
        })
        return PointArr
    }
    /**
       * 缓冲分析
       * @param {Object} style 缓冲分析样式||PolygonStyle缓冲分析缓冲区样式
       * @param {Object} style.PolygonStyle 缓冲分析缓冲区样式
       * @param {Object} type 缓冲分析类型 线('polyline')、面('polygon')、圆('circle')、矩形（'rectangle'）
       * @param {Object} callBack 回调事件
       * @param {Object} radius 缓冲分析半径
       */
    analyseGeoTools(style, type, callback, radius, layerId) {
        this.comp.addVectorToArr(layerId || 'analyseGeoTools')
        this.comp.addDrawing(type, (overlay) => {
            const positions = this.queryDataTools(overlay)
            const polyArr = this.comp.queryGeoTools(positions, type, radius)
            const obj = [{ polyArr }]
            this.comp.addPolygons(obj, layerId || 'analyseGeoTools', callback, style.PolygonStyle || {})
            this.comp.addDrawToLayer(layerId || 'analyseGeoTools', overlay, {}, callback)
        }, style)
    }
    /**
       * 加载图层
       * @param {Object} items 底图配置参数
       * @param {Object} [items.name] 底图名称
       * @param {Object} [items.type] 底图类型
       * @param {Object} [items.layerUrl] 底图链接地址
       * @param {Object} [items.show] 底图是否显示
       * @param {Object} [items.style] 底图样式
       * @param {Object} [items.key] 底图密钥
       * @param {Object} [items....] 底图其它属性
       * @param {Object} layerId 图层id
       */
    addBaseLayer(items, layerId) {
        this.comp.addBaseLayer(layerId || 'addBaseLayer', items)
    }
    /**
       *根据图层组的下标值，设置对应图层的显示隐藏及透明度
       *@param {Object} item 对指定图层做透明度及显示隐藏操作
       *@param {float} item.alpha 设置图层透明度，0~1,data图层无效果
       *@param {bool} item.vis 设置图层显示隐藏,true|false
       *@param {String} layerId 图层唯一id
       */
    setOverlayLayer(item, layerId) {
        this.comp.setOverlayLayer(layerId || 'addBaseLayer', item)
    }
    /**
       * 根据id设置图层显示位置
       * @param {Object} layerId 图层id
       * @param {String} state LEFT显示 Scene＃imagerySplitPosition 左侧的ImageryLayer;NONE始终显示ImageryLayer;RIGHT在 Scene＃imagerySplitPosition 右侧显示ImageryLayer。
       */
    setSplitDirection(state, layerId) {
        this.comp.setSplitDirection(layerId || 'addBaseLayer', state)
    }
    /**
       * 获取或设置图像拆分器在视口中的位置。有效值在0.0到1.0之间。
       * @param {float} data 图像拆分器在视口中的位置,0.0到1.0之间
       */
    setSplitPositionValue(data) {
        return this.comp.setSplitPositionValue(data)
    }
    /**
       *往图层组对应下标图层添加数据信息
       *@param {Object} PointArr 包含经纬度的数据
       *@param {Object} [style] 样式
       *@param {string} [style.isModel] 是否使用model
       *@param {string} [style.mpUrl] 历史轨迹移动点url
       *@param {string} [style.mpStyle] 历史轨迹移动点样式
       *@param {Number} [style.duration] 历史轨迹间隔时间，单位：秒
       *@param {string} [style.isPath] 历史轨迹路径显示
       *@param {string} [style.pathStyle] 历史轨迹路径样式
       *@param {String} layerId 图层唯一id
       */
    showTrackController(PointArr, style, callback, layerId) {
        const _layerId = layerId || 'showTrackController'
        this.showPolylines(PointArr, style.styleLine || {}, callback, _layerId)
        this.comp.addTrackControllerToArr(_layerId + '_t')
        PointArr.forEach((item, index) => {
            if (item.Points) {
                this.comp.addBillboards(item.Points, _layerId, callback, style.stylePoint || {})
            }
            this.comp.addTrackController(item.lineArr, _layerId + '_t', style.styleTrack || {})
        })
    }
    trackPlay(layerId) {
        this.comp.trackPlay(layerId + '_t')
    }
    trackPause(layerId) {
        this.comp.trackPause(layerId + '_t')
    }
    trackRestore(layerId) {
        this.comp.trackRestore(layerId + '_t')
    }
    trackChangeSpeed(layerId, speed) {
        this.comp.trackChangeSpeed(layerId + '_t', speed)
    }
    addScreenLeftClickEvent(layerId) {
        this.comp.setInputAction('LEFT_CLICK', (movement) => {
            this.comp.queryDataLayer(layerId, movement, (ex) => {
                console.log(ex)
                if (ex) {
                    const objPoint = this.comp.queryLayersPoint(movement)
                    const obj = {
                        ...{
                            alt: 0,
                            heading: 0,
                            lat: 0,
                            lng: 0,
                            pitch: -90,
                            roll: 0
                        },
                        ...{
                            lat: objPoint.movementPoint.lat,
                            lng: objPoint.movementPoint.lng,
                            alt: objPoint.height / 1.5
                        }
                    }
                    console.log(objPoint)
                    this.comp.flyToPosition(obj, (e) => { }, 0)
                }
            })

            // comp.removeInputAction("LEFT_CLICK");
        })
    }
    flywireLayer(dataArray, layerId, style, callback) {
        this.comp.addVectorToArr(layerId)
        if (dataArray && dataArray.length > 0) {
            dataArray.forEach((item, index) => {
                if (item.Points) {
                    item.Points.forEach((ite, index) => {
                        this.comp.addBillboard(ite, layerId, callback, style.BbdStyle, {})
                    })
                }
                this.comp.addPolyline(item, layerId, callback, style.PlineStyle, {})
            })
        }
    }
    addPolylineAndPolygon(layerId, dataArr, style, callback) {
        this.comp.addVectorToArr(layerId)
        dataArr.forEach((ite, index) => {
            const item = ite.properties
            const geometry = ite.geometry
            if (geometry.type == 'MultiPolygon') {
                geometry.coordinates.forEach((ite1, index1) => {
                    this.comp.addPolygon(ite1, layerId, callback, style.PgonStyle, {})
                    this.comp.addPolyline(ite1, layerId, callback, style.PlineStyle, {})
                })
            }
        })
    }
}

window._this = {
    Comp: null,
    Plug: null
}
const comp = new GisComp()
_this.Comp = comp
_this.Plug = new Plug(comp)
const mapSwitch = () => {
    const play = (comp) => {
        comp.changeBaseLayer([0, 2])
        const _wrapper = document.getElementById('kc-map-switch')
        _wrapper.onmouseover = () => {
            let width = 60
            const rightMargin = 7
            width = 2 * (width + rightMargin)
            _wrapper.style.width = `${width}px`
        }
        _wrapper.onmouseout = () => {
            _wrapper.style.width = `60px`
        }
        const mapItem = document.getElementsByClassName('map-item')
        for (let i = 0; i < mapItem.length; i++) {
            const mapEl = mapItem[i]
            mapEl.onclick = (e) => {
                comp.changeBaseLayer([i + 0, 2])
                const old = document.getElementsByClassName('map-item active')
                if (old && old.length) {
                    old[0].className = 'map-item'
                }
                e.target.className = 'map-item active'
            }
        }
    }
    play(_this.Comp)
}
const initFn = function (viewer, KCGIS) {
    let hnVlayer = undefined;
			let shiVlayer = undefined;
			let sceneIntensity = 0.6;
			let circlePointCenter = [111.711649, 27.629216];

    const initViewer = () => {
        // viewer = new KCGIS.Viewer('viewer-container', {
        //     contextOptions: {
        //         webgl: {
        //             alpha: true
        //         }
        //     },
        // });
        // viewer.setOptions({
        //     showAtmosphere: false,
        //     showSun: false,
        //     showMoon: false,
        //     skyBox: {
        //         show: false //显示或隐藏天空盒子
        //     },
        //     globe: {
        //         show: false, //显示或隐藏地球
        //         depthTestAgainstTerrain: false, //开启或者关闭深度检测
        //     }
        // });
        viewer.scene.backgroundColor = new KCGIS.Color(0, 0, 0, 0);
        viewer.scene.globe.baseColor = new KCGIS.Color(0, 0, 0, 0);
        viewer.scene.light.intensity = sceneIntensity;

        // 开启抗锯齿
        if (window.Cesium.FeatureDetection.supportsImageRenderingPixelated()) {
            viewer.resolutionScale = window.devicePixelRatio
        }
        viewer.scene.postProcessStages.fxaa.enabled = true;

        let baseLayer_img = KCGIS.ImageryLayerFactory.createImageryLayer(KCGIS.ImageryType.AMAP, {
            style: 'img'
        })

        // let imgNet = KCGIS.ImageryLayerFactory.createImageryLayer(KCGIS.ImageryType.WMTS, {
        //     url: 'https://onemapserver.img.net/OneMapServer/rest/services/2023_1M_06/Transfer?token=e2_gy9cb6jW1jcwVe-GbVQbd-lIl9f1wb66GiZztmfRMzE42sBdGG387AZczUhzMx3w6vieHZWnLt4W5ECDwNoyNVFe7JZuR-CKWFwlbyn0.&style=default&tilematrixset=EPSG%3A3857&Service=WMTS&Request=GetTile&Version=1.0.0&Format=image%2Fwebp&TileMatrix={TileMatrix}&TileCol={TileCol}&TileRow={TileRow}',
        //     layer: '2023_1M_06',
        //     style: 'default',
        //     format: 'image/jpeg',
        //     tileMatrixSetID: 'EPSG:3857'
        // })


        // viewer.addBaseLayer([baseLayer_img, imgNet], {
        //     iconUrl: '../assets/icon/elec.png',
        //     name: '云遥'
        // })

        hnVlayer = new KCGIS.VectorLayer('hn_v_layer');
        shiVlayer = new KCGIS.VectorLayer('hn_shi_layer');
        hnVlayer.show = false;
        shiVlayer.show = false;
        viewer.addLayer(hnVlayer);
        viewer.addLayer(shiVlayer);
        viewer.loadingMask.enable = true;

        //点击视图，清除区县选中状态
        viewer.on(KCGIS.MouseEventType.CLICK, e => {
            removeQxAllMaterial(null);
        });

        //鼠标滑轮滚动事件
        viewer.on(KCGIS.MouseEventType.WHEEL, e => {
            let height = Math.ceil(viewer.camera.positionCartographic.height);
            let level = getLevelByHeight(height);
            isLevelGreateThan(level);
        });

        //添加旋转圈动画
        addCircle(circlePointCenter[0], circlePointCenter[1]);
        //添加墙体
        addHNWall();
        //添加湖南省行政区划面，和贴图
        addHNPolygon();
        //防止模型贴图卡白,延时处理
        setTimeout(function() {
            hnVlayer.show = true;
            shiVlayer.show = true;
            setTimeout(function() {
                viewer.loadingMask.enable = false;
                //内圈大小设置
                let circle_vec_id = hnVlayer.getOverlaysByAttr("infoId", "circle_vec_id");
                circle_vec_id[0].radius = 300000;
                //中圈大小设置
                let circle1_vec_id = hnVlayer.getOverlaysByAttr("infoId", "circle1_vec_id");
                circle1_vec_id[0].radius = 350000;
                //外圈大小设置
                let circle2_vec_id = hnVlayer.getOverlaysByAttr("infoId", "circle2_vec_id");
                circle2_vec_id[0].radius = 400000;
            }, 1000);
        }, 2000);
        //加载湖南省区县JSON文件
        readJson();
    }

    /**
     * 鼠标滑轮滚动，地图效果切换
     */
    const isLevelGreateThan = (level) => {
        if (level > 8) {
            viewer.scene.globe.show = true;
            hnVlayer.show = false;
            shiVlayer.show = false;
        } else {
            viewer.scene.globe.show = false;
            hnVlayer.show = true;
            shiVlayer.show = true;
        }
    }

    /**
     * 加载湖南省区县JSON文件
     */
    const readJson = () => {
        $.ajax({
            url: './assets/data/hn.json',
            type: 'GET',
            dataType: 'json',
            success: function(data) {
                if (data.type === "FeatureCollection" && data.features.length > 0) {
                    for (let i = 0; i < data.features.length; i++) {
                        const item = data.features[i];
                        let itemCoordinates = item.geometry.coordinates;
                        //添加行政区划名称
                        addLabel(item.properties.centroid, item.properties.name);
                        //添加区县行政区划线
                        addLine(itemCoordinates[0][0]);
                        //添加区县行政区划面，默认透明，目的为了实现区县选中效果
                        addQXPolygon(itemCoordinates[0][0], item.properties.adcode);
                    }
                    setCameraView();
                } else {
                    console.error("Invalid GeoJSON data received");
                }
            },
            error: function(jqXHR, textStatus, errorThrown) {
                console.error("Error fetching data: " + textStatus);
            }
        });
    }

    const setCameraView = () => {
        //设置相机默认视角
        viewer.camera.setView({
            destination: window.Cesium.Cartesian3.fromDegrees(
                112.505904,
                20.792204,
                759668.7,
            ),
            orientation: {
                heading: window.Cesium.Math.toRadians(352.75),
                pitch: window.Cesium.Math.toRadians(-52.59),
                roll: 0.01
            },
        });
    }
    /**
     * 添加外围圈旋转动画，三个圈
     * @param {Object} lng
     * @param {Object} lat
     */
    const addCircle = (lng, lat) => {
        let circle = new KCGIS.Circle(new KCGIS.Position(lng, lat), 1);
        circle.attr.infoId = "circle_vec_id";
        circle.setStyle({
            height: -30000,
            material: new KCGIS.ImageMaterialProperty({
                image: '../assets/icon/qu1.png',
                color: KCGIS.Color.fromCssColorString('rgba(255,255,255,0.3)')
            })
        })
        circle.rotateAmount = -1
        let circle1 = new KCGIS.Circle(new KCGIS.Position(lng, lat), 1);
        circle1.attr.infoId = "circle1_vec_id";
        circle1.setStyle({
            height: -30000,
            material: new KCGIS.ImageMaterialProperty({
                image: '../assets/icon/qu2.png',
                color: KCGIS.Color.fromCssColorString('rgba(255,255,255,0.3)')
            })
        })
        circle1.rotateAmount = 1
        let circle2 = new KCGIS.Circle(new KCGIS.Position(lng, lat), 1);
        circle2.attr.infoId = "circle2_vec_id";
        circle2.setStyle({
            height: -30000,
            material: new KCGIS.ImageMaterialProperty({
                image: '../assets/icon/qi3.png',
                color: KCGIS.Color.fromCssColorString('rgba(255,255,255,0.3)')
            })
        })
        circle2.rotateAmount = -1
        hnVlayer.addOverlay(circle).addOverlay(circle1).addOverlay(circle2);
    }


    /**
     * 添加湖南省边界墙
     */
    const addHNWall = () => {
        let newPos = hnData.map(item => {
            return [item[0], item[1], -60000]
        });
        let wall = new KCGIS.Wall(newPos);
        wall.setStyle({
            material: new KCGIS.ImageMaterialProperty({
                image: './assets/icon/fence-top2.png',
                color: KCGIS.Color.fromCssColorString('rgb(11,136,227)'),
                transparent: true
            }),
            outline: false
        });
        hnVlayer.addOverlay(wall);
    }

    /**
     * 添加湖南省行政区划面并贴图
     */
    const addHNPolygon = () => {
        let polygon = new KCGIS.Polygon(hnData);
        polygon.setStyle({
            extrudedHeight: 1,
            material: new KCGIS.ImageMaterialProperty({
                image: './assets/icon/tt2.png',
            })
        });
        hnVlayer.addOverlay(polygon);
    }


    /**
     * 添加区县行政区划面，并默认透明
     * @param {Object} pos
     * @param {Object} adcode
     */
    const addQXPolygon = (pos, adcode) => {
        let polygon = new KCGIS.Polygon(pos);
        polygon.attr.adcode = adcode;
        polygon.setStyle({
            height: 200,
            extrudedHeight: 2000,
            material: KCGIS.Color.fromCssColorString('#08D6F7').withAlpha(0.01),
        });
        polygon.on(KCGIS.MouseEventType.CLICK, e => {
            removeQxAllMaterial(e);
        });
        shiVlayer.addOverlay(polygon);
    }


    /**
     * 添加/移除区县行政区划选中效果
     * @param {Object} e
     */
    const removeQxAllMaterial = (e) => {
        shiVlayer.eachOverlay((item) => {
            item.setStyle({
                material: KCGIS.Color.fromCssColorString('#08D6F7').withAlpha(0.01),
            })
        });
        if (e && e.overlay) {
            e.overlay.setStyle({
                material: KCGIS.Color.fromCssColorString('#08D6F7').withAlpha(0.5),
            })
        }
    }

    /**
     * 添加区县行政区划线
     * @param {Object} pos
     */
    const addLine = (pos) => {
        let polyline = new KCGIS.Polyline(pos);
        polyline.setStyle({
            width: 1.2,
            material: KCGIS.Color.fromCssColorString('rgba(255,255,255,0.6)'),
        });
        hnVlayer.addOverlay(polyline);
    }


    /**
     * 添加区县行政区划名称
     * @param {Object} pos
     * @param {Object} text
     */
    const addLabel = (pos, text) => {
        let newPos = [pos[0], pos[1], 1];
        let label = new KCGIS.Label(newPos, text);
        label.setStyle({
            font: "14px sans-serif",
            heightReference: 2,
            disableDepthTestDistance: Number.POSITIVE_INFINITY
        });
        hnVlayer.addOverlay(label);
    }



    // 获取level层
    const getLevelByHeight = (height) => {
        let A = 40487.57;
        let B = 0.00007096758;
        let C = 91610.74;
        let D = -40467.74;
        console.log("获取level层级" + Math.round(D + (A - D) / (1 + Math.pow(height / C, B))));
        return Math.round(D + (A - D) / (1 + Math.pow(height / C, B)));
    }

    initViewer()

}
window.initConfig = (config, ref) => {
    return new Promise((resolve, reject) => {
        const play = (comp) => {
            comp.initMap(ref || document.getElementById('map'), { ...config }, (viewer) => {
                // mapSwitch()
                viewer.scene.globe.baseColor = new Cesium.Color(0, 0, 0, 0) // 设置地球透明
                viewer.scene.globe.depthTestAgainstTerrain = false // 关闭深度检测
                viewer.on(Cesium.ScreenSpaceEventType.LEFT_CLICK, (ex) => {
                    comp.closePopUp()
                })
                initFn(viewer, KC)
                // 定义一个插件
                const MyPlugin = {
                    install(hostClass, option1, option2) {
                        hostClass.prototype.myPluginMethod = function () {
                            console.log('This is a method added by the plugin.', option1, option2, this, hostClass.prototype)
                        }

                        // 可以在此处添加其他初始化逻辑或生命周期钩子
                    }
                }

                // 注册插件
                GisClass.use(MyPlugin, 'value1', 'value2')

                const gis = new GisClass({
                    Plug: _this.Plug,
                    Cesium: window.Cesium // 来自public的资源静态 方便替换版本
                }, {
                    event: function (e) {
                        console.log(e, 'Event triggered:')
                    }
                }, this)
                window.gis = gis
                // this.$emit('load', gis, this.Plug, this.Comp)
                gis.emit('load', gis)
                // 订阅事件
                // gis.on('mapLoaded', (data) => {
                //     console.log('Event triggered:', data)
                // })

                // 创建类实例并使用插件提供的方法
                gis.myPluginMethod() // 输出 "This is a method added by the plugin. value1 value2"
                // this.isloaded = true
                resolve({
                    gis,
                    Plug: _this.Plug,
                    Comp: _this.Comp,
                    viewer
                })
                window.MapEvent.emit('loadMap', {
                    Cesium,
                    Comp: _this.Comp,
                    viewer: viewer
                })
                /* comp.setInputAction("LEFT_CLICK", async (event) => {
                  viewer.selectedEntity = undefined;
                  var pickRay = viewer.camera.getPickRay(event.position);
                  var featuresPromise = await viewer.imageryLayers.pickImageryLayerFeatures(
                    pickRay,
                    viewer.scene
                  );
                  if (Array.isArray(featuresPromise) && featuresPromise.length > 0) {
                    let style = {
                      fill: true,
                      height: 0, //设置了高度面边框才能显示
                      material: Cesium.Color.fromCssColorString("#FFFF00").withAlpha(0.2),
                      outline: true,
                      outlineColor: Cesium.Color.fromCssColorString("#022954"),
                      outlineWidth: 1 //Webgl在win只能显示1
                    };
                    //comp.removeOverlayLayer(comp.queryFlag("pointCs"));
                    comp.addVectorToArr("pointCs");
                    let features = featuresPromise[0].data;
                    if (features.geometry.type == "MultiPolygon") {
                      features.geometry.coordinates.forEach((item, index) => {
                        let itemObj = {
                          polyArr: item[0]
                        }
                        comp.addPolygon(itemObj, comp.queryFlag("pointCs"), (e) => {},
                          style);
                      })
                    }
        
                  }
                }) */
            })
        }
        play(_this.Comp)
    })
}