
Echarts版本:v4.x
通过Echarts实现世界地图,其实是很简单的(看文档就可实现)。难点在于:
- 基础的地图数据,Echarts官网不再提供,需要自己收集
- 地图数据中国家和地区的名称使用的是英文(还有部分使用的是特有的简写),中文(或其他语言)名称需要通过
nameMap自己个性化设置,两百多个国家和地区,需要一一比对,工作量不小
本想在下方直接贴出nameMap的相应设置,可掘金一直判断文章违规。。。。。。只好作罢。(点击获取基础的地图数据和下方nameMap设置中的JSON数据文件)
<script src="echarts.js"></script>
<script src="world.js"></script>
<script>
var chart = echarts.init(document.getElementById('main'));
chart.setOption({
series: [{
type: 'map',
map: 'world',
nameMap: nameMap
}]
});
</script>