echart:中国地图与世界地图合并

项目中有使用到中国地图，然而，真实情况是有一些坐标点跑到了国外，导致看起来一片空白。因此我想到，能不能将中国地图与世界地图合并，看起来效果会好一点。

首先我尝试了将多个地图放置到series数组中，发现地图是显示出来了，但它们是重叠的，达不到我想要的效果。所以唯一的办法是将两个地图合并。下面记录一下详细步骤。

1.获得地图的json数据

echart5.x以上的包里面已经不提供地图，但是早期的版本是有的。所以我们可以先通过npm安装echart4.x，得到地图相关的文件。

npm install echarts@4.6.0

可以看到在echarts/map文件夹中有我需要的世界地图和中国地图文件。其中js文件引入后会直接运行echarts.registerMap注册地图，而json则需要自行调用方法注册。我用的是js文件。

image.png

2.地图合并

查看world.js,可以看到文件是经过压缩的，但可以很容易找到注册相关的代码。
地图相关的矢量数据其实就是features数组中的元素，只要将china.js和world.js中的features数组合并成一个就行了。复制黏贴即可。

image.png

json格式的我没有尝试，但理论应该是一样的。

合并之后变成一个world-china.js,将其在echarts后面引入即可注册使用。

image.png