Vue + Echarts + Bmap

0. 环境 & 效果图

vue 2.6.11 + echarts 5.0.1

1. 绘图文件：BmapTest.vue

是一个用来绘制地图的组件（component），可被页面（view）调用

2. 页面文件：Multi.vue

调用（import）了许多组件，其中包括 BmapTest.vue，这样就能在 Multi 页面中看见我们绘制的地图啦

核心代码：

import BmapTest from "@/components/multi/BmapTest"

3. 修改 Index.html，设置 AK

echarts 地图本质上还是散点图，用经纬度值取代x，y坐标，在此基础上以地图为图像背景。这个图像背景，就需要调用百度地图的API啦，需要自己去百度地图的官网申请密钥~

把申请到的AK密钥写进 public 目录下的 index.html 中：

4. 注意事项

散点的坐标不能重复，如果出现重复值，地图也会无法显示。