Echarts地图合并提取

Echarts简述 ：一个纯 Javascript 的图表库。

讲解使用版本：2.x。

合适人群：相对Echarts有所了解、以及对地图数据合并有所疑惑的朋友。

1.Echarts基础地图实现

//参数配置 - 如果不熟悉请参考官网 - 此处以重庆地图为例
var options = {
  "title" : {
    "text": "重庆地图",
    "x":"center"
  },
  "tooltip" : {
    "trigger": "item",
    "enterable":true
  },
  "dataRange": {
    "min": 0,
    "max" : 50,
    "precision":0,
    "text":["高","低"],           // 文本，默认为数值文本
    "calculable" : false,
    "x": "left",
    "color":["#FFA500","#93AE46","#27B78C","#93DBC5","#CCCCCC"]
  },
  "toolbox": {
    "show" : true,
    "orient" : "vertical",
    "x": "right",
    "y": "center",
    "feature" : {
      "mark" : {"show": true},
      "dataView" : {"show": true, "readOnly": false},
      "restore" : {"show": true},
      "saveAsImage" : {"show": true}
    }
  },
  "series" : [
    {
      "name": "重庆",
      "type": "map",
      "mapType": "重庆",
      "roam": false,
      "itemStyle":{
        "normal":{
          "label":{"show":true},
          "areaStyle":{
              "color":"#CCCCCC"
          },
          "borderColor":"#FFF"
        },
        "emphasis":{
          "label":{"show":true},
          "areaStyle":{
            "color":"#2D8CD1"
          }
        }
      },
      "data":[]
    }]
}

这里大家不难发现，中间几个区域文字重合，不够理想化.

2.解决方式-合并区域

由于重合显示不友好，建议吧重合区域合并提出。根据源码可以看出只要将其他区域的coordinate和encodeOffsets合并到一个即可。

//将巴南区、江北区、渝北区、璧山区、北碚区、九龙坡区、沙坪坝区、大渡口区、南岸区、渝中区
//等区域的coordinates和encodeOffsets放在统一的模块就能被当作是一个区域,然后删除原模块数据
{
    'type': 'Feature',
    'id': '500103',
    'properties': {
        'name': '主城区',//自定义名称 
        'cp': [
            106.574269,29.571625
        ],
        'childNum