前言

离线地图？接到需要做离线地图这个需求的时候我还在问公司的负责人要腾讯地图的key。结果晚上开会就突然说项目需要内网部署，必须要使用离线地图。一脸懵逼的我心想幸好还没有开始接腾讯地图（无用功没做）。

经过我两天的调研，基本的离线地图方案就是下载地图瓦片来使用第三方库将它们拼接起来。达到显示离线地图的效果。其中地图瓦片不可能放到客户端，需要提前下载好图片。然后放到服务器通过启动一个http-server来实现文件静态访问。

如何下载瓦片地图

先说软件下载某度网盘下载。7天有效。

打开以上链接你下载完成之后会是一个rar的压缩包，解压之后得到如下。并点击红框文件启动。

启动之后你会看到如下界面。我这边想要拉取高德地图的瓦片，故如图选择高德地图-街道图。

至此我们就可以开始下载。下载前我们需要了解下地图级别这个选项

由上表可见，如果想比例尺越小则级别越高，比例尺越大则级别越小。说人话就是你想要数据越详细则就需要级别越高，数据越小则级别越小。

通过选择级别可以看到明显区别⬇️⬇️

如上两张图可见。下载0-8的级别的综合才1972张图片瓦片，而比例尺越高的9-10就有27466张图片瓦片。

自己可以根据需要下载。我们下载完成之后是如下的目录结构。

mappabc/roadmap/

全局安装http-server然后使用终端进入该目录运行

// 全局安装http-server
npm i http-server  -g
// 如果是mac可能需要加sudo

// 安装完成之后字节在上文提到的目录运行
http-server

如果你是第一次执行大概率结果如下

至此下载瓦片地图的操作结束。