离线瓦片发布
leaflet是webgis中相对成熟的开源地图组件库,包含了几乎大部分开发者的基本需求,对于一般用户而言,联网状态下采用在线的瓦片服务即可,但也有一些需要必须离线的场景,本篇博客将讲述两种离线瓦片发布的方式,其一:采用Springboot后端发布;其二:直接将瓦片资源放在文件路径下访问。
瓦片发布前的准备
在发布瓦片服务前,先要根据框定的经纬度爬取地图瓦片图片,这里采用已经开源的”全能地图下载器3.0”,选择好需要爬取的地图级别(级别越大,相当于放大程度Zoom越大)所以越大耗费的存储空间越大。

Springboot瓦片发布
参考

controller下新建PublicData.java
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43
| package com.public_data.public_data.controller;
import org.springframework.beans.factory.annotation.Value; import org.springframework.web.bind.annotation.PathVariable; import org.springframework.web.bind.annotation.RequestMapping; import org.springframework.web.bind.annotation.RequestMethod; import org.springframework.web.bind.annotation.RestController; import javax.imageio.ImageIO; import javax.servlet.http.HttpServletResponse; import java.awt.image.BufferedImage; import java.io.FileInputStream; import java.io.IOException; import java.io.InputStream;
@RestController @RequestMapping(value = "/xyz") public class PublicData {
@Value("${DATA_PATH}") String dataPath;
@RequestMapping(value="/{name}/{level}/{col}/{rowExtention:.+}",method= RequestMethod.GET) public void xyz(@PathVariable String name, @PathVariable int level, @PathVariable int col, @PathVariable String rowExtention, HttpServletResponse response){ String[] rowParts=rowExtention.split("\\."); try { int row=Integer.parseInt(rowParts[0]); String extension=rowParts[1]; String path = dataPath+"/"+name+"/"+level+"/"+col+"/"+rowExtention;
InputStream inputStream = new FileInputStream(path); if(inputStream==null){ return; } BufferedImage br = ImageIO.read(inputStream); ImageIO.write(br, extension, response.getOutputStream()); br.flush(); inputStream.close(); } catch (IOException e) { e.printStackTrace(); System.out.println(String.format("%s/%d/%d/%s请求出错!" ,name,level,col,rowExtention)); } } }
|
CorsFilter.java文件
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37
| package com.public_data.public_data.filter;
import org.springframework.beans.factory.annotation.Value; import org.springframework.stereotype.Component; import javax.servlet.*; import javax.servlet.http.HttpServletResponse; import java.io.IOException;
@Component public class CorsFilter implements Filter {
@Value("${web.CorsFilter}") private boolean corsFilter;
@Override public void init(FilterConfig filterConfig) throws ServletException {
}
@Override public void doFilter(ServletRequest req, ServletResponse res, FilterChain chain) throws IOException, ServletException { HttpServletResponse response = (HttpServletResponse) res; if (corsFilter) { response.setHeader("Access-Control-Allow-Origin", "*"); response.setHeader("Access-Control-Allow-Credentials", "true"); response.setHeader("Access-Control-Allow-Methods", "POST,GET,PUT,DELETE,OPTIONS"); response.setHeader("Access-Control-Max-Age", "3600"); response.setHeader("Access-Control-Allow-Headers", "Content-Type,Content-Length,Authorization,Accept,X-Requested-With"); } chain.doFilter(req, res); }
@Override public void destroy() {
} }
|
配置图片路径,在application.properties中修改
1 2 3 4 5
| #瓦片存放的本地路径 DATA_PATH = /Users/apple/xxx/xxx #DATA_PATH = E:/newtask #设置允许跨域(jar包设置为true,war包设置为false) web.CorsFilter = true
|
地图前端的url:
1
| var url = 'http://localhost:8080/xyz/roadmap/{z}/{x}/{y}.png';
|
本地路径访问
把url地址写对即可:
1
| var url = './roadmap/{z}/{x}/{y}.png'
|