02 调用自制瓦片

准备

数据

首先要在QGIS里面自制一份地图，如下图所示：

通过QGIS中的【栅格工具】→【生成XYZ瓦片】生成自制的瓦片，主要设置的参数就是瓦片输出的范围和最大缩放级别。

生成好的瓦片就会如图所示：

搭建服务

用Express快速生成框架，在VSCode中可以打开一个文件夹在终端中通过npx命令来运行 Express 应用程序生成器。

npx express-generator

然后安装所有依赖包：

npm install

将瓦片拷贝到Express中的public文件下，运行程序，准备阶段就完成了。

调用瓦片

加载地图瓦片，express默认端口是3000

  //加载自制瓦片地图
  const campuslayer = new L.TileLayer('http://localhost:3000/tiles/{z}/{x}/{y}.png');
  campuslayer.addTo(map);

实现效果：