ECharts地图图表示例

地图类可视化里，ECharts 配合百度地图的方案还挺顺手的。图表类型多、样式精美，最主要是它的交互做得不错，能缩放、能拖拽，展示地理数据那叫一个直观。你要做中国地图展示人口分布、区域经济什么的，用它就蛮合适。

ECharts地图图表其实就是在原图表类型上加了个地图背景。你只要先引入基础的 ECharts 库，再加上echarts/map/js/bmap.js，地图图层就能跑起来。还有一点，地图资源得自己加载，默认是不带的。

容器部分没啥的，用document.getElementById('main')绑个 div 就好。核心配置里，series要指定type: 'map'，mapType写成'baidu'。数据格式嘛，类似{ name: '北京', value: 100 }这样的数组，想展示多少区域就写多少。

交互效果也别忽略了。像roam: true可以开缩放和平移，label可以控制区域名显示样式。视觉风格方面，itemStyle能调颜色，搞高亮都靠它。配置写好了，用myChart.setOption(option)就能渲染了。

下面是个简化版的配置示例：

option = {
  tooltip: {},
  series: [{
    name: '中国省份数据',
    type: 'map',
    mapType: 'baidu',
    roam: true,
    label: {
      normal: { show: true },
      emphasis: { show: true }
    },
    data: [
      { name: '北京', value: 100 },
      { name: '上海', value: 200 }
    ]
  }]
};
myChart.setOption(option);

嗯，如果你想加点高级玩法，比如区域点击事件、地图缩放回调什么的，ECharts 的 API 也挺全，比如dispatchAction()和getZoomOnPosition()。不过建议数据不要太大，不然浏览器容易卡。

如果你正打算做个中国区域的可视化项目，尤其是面向国内用户，ECharts + Baidu 地图的组合真的挺稳的，省心还高效。