广州echarts effectScatter配置项内容和展示

配置项如下
      var geoCoordMap = {
	'广州': [113.5107,23.2196],
	'越秀': [113.273152,23.134756],
	'白云': [113.283644,23.16546],
	'天河': [113.368444,23.130502],
	'荔湾': [113.243429,23.122843],
	'番禺': [113.390607,22.944312],
	'海珠': [113.329594,23.093658],
	'花都': [113.228697,23.410155],
	'增城': [113.81971,23.267341],
	'黄埔': [113.464915,23.112174],
	'从化': [113.593984,23.554304],
	'南沙': [113.527294,22.827079],
};

var GZData = [
    [{name:'广州'},{name: '越秀',value:96}],
    [{name:'广州'},{name: '白云',value:90}],
    [{name:'广州'},{name: '天河',value:96}],
    [{name:'广州'},{name: '荔湾',value:90}],
	[{name:'广州'},{name: '番禺',value:77}],
	[{name:'广州'},{name: '海珠',value:70}],
	[{name:'广州'},{name: '花都',value:94}],
	[{name:'广州'},{name: '增城',value:79}],
	[{name:'广州'},{name: '从化',value:51}],
    [{name:'广州'},{name: '黄埔',value:67}]
					
];
var convertData = function(data) {
    var res = [];
    for (var i = 0; i < data.length; i++) {
        var dataItem = data[i];
        var fromCoord = geoCoordMap[dataItem[0].name];
        var toCoord = geoCoordMap[dataItem[1].name];
        if (fromCoord && toCoord) {
            res.push([{
                coord: fromCoord,
                value: dataItem[0].value//来源或流向修改
            }, {
                coord: toCoord,
            }]);
        }
    }
    return res;
};
var series = [];
[['广州', GZData]].forEach(function (item, i) {
    series.push(
    {
        type: 'effectScatter',
        coordinateSystem: 'geo',
        zlevel: 2,
       
        label: { //图形上的城市文本标签
            normal: {
                show: true,
                position: 'right',
                formatter: '{b}',
                textStyle:{
                    color:'#fff',
					fontStyle: 'normal',
                    fontFamily: 'arial',
                    fontSize: 12,
                }
            }
        },
        symbolSize: 1,//点大小
        itemStyle: {
            normal: {
                color: function(params) {
                      var tmp = params.data.value[2]
                      if (tmp < 25) {
                          return 'aqua';
                      } else if (tmp < 50) {
                          return 'lime';
                      } else if (tmp < 76) {
                          return 'yellow';
                      } else if (tmp < 95) {
                          return 'orange'
                      } else
                          return '#ff3333';
                }
            }
        },
        data: item[1].map(function (dataItem) {
            return {
                name: dataItem[1].name,
                value: geoCoordMap[dataItem[1].name].concat([dataItem[1].value])
            };
        })
    });
});
option = {
    backgroundColor: '#23243a',
    tooltip : {  //提示组件
        trigger: 'item',
    },
    geo: {
        map: 'guangzhou',
        label: {
            emphasis: {
                show: false,
                textStyle: {
					color: '#fff'
				}
            }
        },
        roam: true, //开启缩放或者平移
        zoom: 1.1,  //缩放比例
        itemStyle: {
            normal: {
                areaColor: 'none',
                borderColor: 'rgba(100,149,237,1)'
            },
            emphasis: {
                areaColor: '#1b1b1b'
            }
        }
    },
    series: series
};
    
截图如下