福州市地图echarts effectScatter配置项内容和展示

      myChart.showLoading();
var fujian = "/asset/get/s/data-1558943429102-FLPo8kwNj.json";


var data = [
    { name: '南平市', value: 120 },
    { name: '三明市', value: 120 },
    { name: '龙岩市', value: 120 },
    { name: '漳州市', value: 140 },
    { name: '厦门市', value: 110 },
    { name: '泉州市', value: 125 },
    { name: '莆田市', value: 100 },
    { name: '福州市', value: 90 },
    { name: '宁德市', value: 88 }
];

var geoCoordMap = {
    "南平市":[118.12,27.3376],
    "三明市":[117.64,26.26],
    "龙岩市":[117.02,25.08],
    "漳州市":[117.65,24.51],
    "厦门市":[118.09,24.48],
    "泉州市":[118.68,24.88],
    "莆田市":[119.01,25.46],
    "福州市":[119.3,26.08],
    "宁德市":[119.54,26.67]
};

var convertData = function (data) {
    var res = [];
    for (var i = 0; i < data.length; i++) {
        var geoCoord = geoCoordMap[data[i].name];
        if (geoCoord) {
            res.push({
                name: data[i].name,
                value: geoCoord.concat(data[i].value)
            });
        }
    }
    return res;
};



$.get(fujian, function (usaJson) {
    myChart.hideLoading();

    echarts.registerMap('fujian', usaJson, {
        
    });
    
    
    option = {
        title: {
            top: 10,
            text: '',
            subtext: '',
            sublink: '',
            subtextStyle: {
                color: '#ccc'
            },
            left: 'center',
            textStyle: {
                color: '#fff'
            }
        },
        backgroundColor: '#000',
        legend: {
            show:false
        },
        geo: {

            map: 'fujian',
            label: {
                normal: {
                    show: false
                },
                emphasis: {
                    show: false,
                }
            },
            roam: true,
            itemStyle: {
						normal: {
						borderColor: 'rgba(147, 235, 248, 1)',
						borderWidth: 1,
						areaColor: {
							type: 'radial',
							x: 0.5,
							y: 0.5,
							r: 0.8,
							colorStops: [{
								offset: 0,
								color: 'rgba(147, 235, 248, 0)' // 0% 处的颜色
							}, {
								offset: 1,
								color: 'rgba(147, 235, 248, .2)' // 100% 处的颜色
							}],
							globalCoord: false // 缺省为 false
						},
						shadowColor: 'rgba(128, 217, 248, 1)',
						// shadowColor: 'rgba(255, 255, 255, 1)',
						shadowOffsetX: -2,
						shadowOffsetY: 2,
						shadowBlur: 10
					},
					emphasis: {
						areaColor: '#389BB7',
						borderWidth: 0
					}
                
            }
        },
        series : [
            {
                name: 'Tooltip Test',
                type: 'effectScatter',
                coordinateSystem: 'geo',
                data: convertData(data.sort(function (a, b) {
                    return b.value - a.value;
                }).slice(0, 50)),
                symbolSize: function (val) {
                    return val[2] / 5;
                },
                showEffectOn: 'render',
                rippleEffect: {
                    brushType: 'stroke'
                },
                hoverAnimation: true,
                label: {
                    normal: {
                        formatter: '{b}',
                        position: 'top',
                        show: true
                    },
                    emphasis: {
                        show: true
                    }
                },
                itemStyle: {
                    normal: {
                        color: '#f4e925',
                        shadowBlur: 10,
                        shadowColor: '#333'
                    }
                },
                zlevel: 1
            }
        ]
    };


    myChart.setOption(option);
});