echarts 添加自定义label标签

1.echarts 自定义标签

注：当设置visualMap的后，给覆盖regions单独定义的值（如果data 中没有regions的地区 则无妨，我这个是从data中删除'青岛'，但是lable 无法正常显示了，如有哪位大神有好的方法，请赐教）

 initChart(id,data){
                // console.log(data);
                let obj = echarts.init(document.getElementById(id));

                const geoCoordMap = {
                    '济南市': [117,36.65 ],
                    '青岛市': [120.33,36.07 ],
                    '淄博市': [118.05,36.78 ],
                    '枣庄市': [117.57,34.86 ],
                    '东营市': [118.49,37.6 ],
                    '烟台市': [121.0,37.52 ],
                    '潍坊市': [119.1,36.62 ],
                    '济宁市': [116.59,35.38 ],
                    '泰安市': [117.13,36.0 ],
                    '威海市': [122.3,37.5],
                    '日照市': [119.46,35.42 ],
                    '滨州市': [118.03,37.4],
                    '德州市': [116.29,37.45 ],
                    '聊城市': [115.97,36.45 ],
                    '临沂市': [118.35,35.05 ],
                    '菏泽市': [115.43,35.24 ],
                    '莱芜市': [117.67,36.2 ],
                }
                const convertData = function(data) {
                    var res = [];
                    for (var i = 0; i < data.length; i++) {
                        var geoCoord = geoCoordMap[data[i].region];
                        if (geoCoord) {
                            res.push({
                                value: geoCoord.concat(data[i].value),
                                name: data[i].region,
                                managercount:data[i].managercount,
                                fundcount:data[i].fundcount,
                            });
                        }
                    }
                    return res;
                };

                let option = ({ // 进行相关配置
                    visualMap: {  //各市区的颜色由value值得大小定
                        show:false,
                        text: ['高', '低'],
                        showLabel: true,
                        seriesIndex: [0],
                        min: 1,
                        max: 300,
                        inRange: {
                            color:[ '#2ab0fc','#0195f1', '#047ad7',]
                        },

                    },
                    geo: {
                        map: '山东',
                        label: {
                            emphasis: {
                                show: false
                            }
                        },
                        itemStyle: {
                            normal: {
                                areaColor: '#83caf5',
                                borderColor: '#fff',
                            },
                            emphasis: {
                                areaColor: '#aed6f2',
                            }
                        },
                        regions: [{  //单独定义青岛市的颜色
                            name: '青岛市',
                            value:this.qdVal.managercount,
                            itemStyle: {
                                normal: {
                                    areaColor: '#fe9910',
                                }
                            }
                        }],
                    },
                    series: [
                        {
                            type: 'map',
                            map: '山东',
                            geoIndex: 0, //此处地图为geo的第一个值
                            data:data,
                        },
                        {
                            name:'山东',
                            type: 'scatter',
                            coordinateSystem: 'geo',
                            symbol:'pin',
                            symbolSize:1,
                            label:{ //标签样式设置
                                normal:{
                                    show:true,
                                    formatter:function(params){ //标签内容
                                        return  params.name+':'+params.data.managercount+','+params.data.fundcount
                                    },
                                    lineHeight: 20,
                                    backgroundColor:'rgba(255,255,255,.9)',
                                    borderColor:'#80cffd',
                                    borderWidth:'1',
                                    padding:[5,15,4],
                                    color:'#000000',
                                    fontSize: 14,
                                    fontWeight:'normal',
                                },
                            },
                            data:convertData(data),
                        }
                    ]
                })

                obj.setOption(option);

            },

效果展示：