引言：因项目需求，需要将vue项目中的地图资源（vue-amap）更换为本地的离线地图，经过多方搜集，离线地图选用百度瓦片地图。

1、下载离线地图资源

http://www.xiaoguo123.com/p/baidumap_offline_v3_use/
下载好后，将离线地图资源放到服务器

2、项目中引用离线地图

public目录下index.html中引用

<script src="服务器地址/bmap-offline/map3.0_init.js"></script>
<script src="服务器地址/bmap-offline/map3.0.js"></script>

3、项目中使用离线地图

有两种方式

第一种方式——直接使用百度地图API

// 百度地图API功能
<script type="text/javascript">
	var map = new BMap.Map("mapBox");    // 创建Map实例
	map.centerAndZoom(new BMap.Point(116.404, 39.915), 6);  // 初始化地图,设置中心点坐标和地图级别
	//添加地图类型控件
	map.addControl(new BMap.MapTypeControl({
		mapTypes:[
            BMAP_NORMAL_MAP,
            BMAP_SATELLITE_MAP,
            BMAP_HYBRID_MAP
        ]}));	  
	//离线不支持
  //map.setCurrentCity("北京");          // 设置地图显示的城市 此项是必须设置的
	
  map.enableScrollWheelZoom(true);     //开启鼠标滚轮缩放
</script>

第二种方式——使用vue-baidu-map

首先要感谢大佬们的轮子，相对于第一种方式，因为是针对vue进行的封装，用起来更加得心应手
文档地址：https://dafrok.github.io/vue-baidu-map/#/zh/start/installation

index.html中引用的地址会将地图资源路径指向离线地图资源，可以断开网络进行测试