echarts地图的使用

var mapFeatures = echarts.getMap('china').geoJson.features;
let res = []
    mapFeatures.forEach(function (v) {
        // 地区名称
        let name = v.properties.name;
        let value = v.properties.cp;
        value.push(0)
        res.push({name,value})
        // 地区经纬度
        // geoCoordMap[name] = v.properties.cp;
    });
    let max = function (data) {
            return Number(data[0].value)
    }
    let min = function (data) {

        return Number(data[data.length-1].value)
    }
    var convertData = function (data) {
        res.forEach(item=>{
            data.forEach(ite=>{
                if(item.name == ite.name){
                    item.value[2] = ite.value
                }
            })
        })
        return res;
    };












var option = {
        tooltip: {
            trigger: 'item',
            triggerOn:"click",
            confine:true,
            position:"left",
            enterable: true,
            alwaysShowContent: false,
            formatter: function (params) {
                if(type==1){
                    if (params.value==0) {
                        return params.name + ' : ' + 0 + '家';
                    } else {
                        var res = params.name + '：<span style="font-size:22px;color:rgba(122,233,229,1);">' + params.data.value[2] + '</span>家' + '<br/>';
                        res += '<ul class="format-list">'
                        for (var i = 0; i < json.dcqylist.length; i++)
                            if (json.dcqylist[i].name == params.name)
                                res += '<li>' + json.dcqylist[i].DCQY + '</li>'
                        res += '</ul>'
                        return res
                    }
                }else if(type == 2){

                        return params.name + ' : ' + params.data.value[2] + 'GWh';

                }

            },
            textStyle: {
                fontFamily: 'PingFangSC-Regular',
                fontSize: 15,
                lineHeight: 18
            },
            backgroundColor: 'rgba(0,22,30,0.4)',
            borderColor: 'rgba(27, 113, 110, 0.5)',
            borderWidth: '1px',
            padding: [20, 20, 20, 20],
            extraCssText: 'border-radius:2px;'
           
        },
        legend: {
        },
        visualMap: {
            show: true,
            min: min(data),
            max: max(data),
            left: '20%',
            top: 'bottom',
            // text: ['高', '低'], // 文本，默认为数值文本
            seriesIndex: [0],
            inRange: {
                color: ["#48AFC3","#389FB3","#268DA0","#157C8E","#0C7385","#02697B"] // 蓝绿

            },
            textStyle: {
                show:false,
                fontFamily: 'PingFangSC-Regular',
                fontSize: 8,
                lineHeight: 18,
                color:'#fff'
            }
        },
        geo: {
            // regions: [{
            //     name: '广东',
            //     itemStyle: {
            //         areaColor: 'red',
            //         color: 'red'
            //     }
            // }],
            map: 'china',

            zoom:1.2,
            roam: true,
            left:"29%",
            label: {
                normal: {
                    show: false,
                    textStyle: {
                        color: "#e2e2e2",
                        fontSize: 8
                    },

                },
                emphasis: {
                    show: false,
                    textStyle: {
                        color: "#fff"
                    },

                }
            },
            itemStyle: {
                normal: {
                    areaColor: 'rgba(15, 118, 132, 0.9)',
                    color: 'rgba(128, 128, 128, 0)'
                },
                emphasis: {
                    areaColor: 'rgba(239,197,73,0.9)',
                }
            }
        },

        series: [
            {
                type: 'map',
                geoIndex: 0,

                data: convertData(data),
                showLegendSymbol:false,
            },


            {
                type: 'scatter',
                coordinateSystem: 'geo',
                symbol: 'circle', //气泡
                symbolSize: 5,
                label: {
                    normal: {
                        show: true,
                        position:"right",
                        formatter:"{b}",
                        textStyle: {
                            color: "#e2e2e2",
                            fontSize: 8
                        },

                    }
                },
                itemStyle: {
                    normal: {
                        color: '#e2e2e2', //标志颜色
                    }
                },

                data: convertData(data),

            },
        ]
    };