实现的效果图长这样
steps
因为热力图的点是相对于整张地图，与经纬度相关。所以可以使用地图叠加的方式。
series里面是数组的形式。
第一个数组是相对应省份的一个边界图。底图是中国地图的热力图。然后根据中心位置和缩放比例使两者重合。展示第一层的省份边界图和后面几层的热力图。
series: [ //第一层是省份的边界地图 { name: 'map', type: 'map', // map: 'guangxi', coordinateSystem: 'geo', zoom:1, roam: false, label: { show:true, normal: { show: true, color:"#fff", }, emphasis: { show: true, fontSize:16, color:"#fff" } }, itemStyle: { normal: { areaColor: '#323c48', borderColor: '#111' }, emphasis: {//鼠标移入高亮显颜色 areaColor: '#f46d43', show:false } } }, //小型企业热力分布图 { name: '小型企业', type: 'heatmap', // coordinateSystem: 'geo', data: convertData([ {name: "百色市", value: 999}, {name: "河池市", value: 654}, {name: "桂林市", value: 546}, {name: "南宁市", value: 545}, {name: "柳州市", value: 564}, {name: "崇左市", value: 654}, {name: "来宾市", value: 87}, {name: "玉林市", value: 99}, {name: "梧州市", value: 55}, {name: "贺州市", value: 767}, {name: "钦州市", value: 567}, {name: "贵港市", value: 55}, {name: "防城港市", value: 43}, {name: "北海市", value: 234}, ]), pointSize: 5, blurSize: 6 },.....]复制代码 map有两种引入方式：
这边采用json引入的方式
$.get('map/json/china.json', function (chinaJson) { echarts.registerMap('china', chinaJson); var chart = echarts.init(document.getElementById('main')); chart.setOption({ series: [{ type: 'map', map: 'china' }] });});复制代码 附上中国各省份的边界json数组和实现的map