banner
Hi my new friend!

山河浪漫,
人间温暖。

Scroll down

前言

在离线环境中使用地图功能,需要提前下载地图瓦片到本地。本文详细介绍如何使用 QGIS 添加高德地图源并下载指定区域的离线瓦片。


一、下载安装 QGIS

1.1 下载 QGIS

官网地址:https://qgis.org/zh-Hans/site/forusers/download.html

推荐下载:QGIS Standalone Installer(长期支持版)

  • Windows 64位:QGIS-OSGeo4W-3.34.x-Setup-x86_64.exe
  • 文件大小:约 500 MB
    网站下载页面

1.2 安装步骤

  1. 双击下载的安装文件
  2. 选择安装路径(建议默认)
  3. 勾选 Create Desktop Icon(创建桌面图标)
  4. 点击 Install 等待安装完成
  5. 安装完成后,桌面出现 QGIS 图标

1.3 启动 QGIS

双击桌面 QGIS 图标启动软件
在这里插入图片描述


二、安装 QTiles 插件

2.1 打开插件管理器

菜单栏:PluginsManage and Install Plugins

2.2 搜索并安装

  1. 在搜索框输入:QTiles
  2. 找到 QTiles 插件
  3. 点击 Install Plugin 安装
  4. 安装完成后关闭窗口

2.3 验证安装成功

菜单栏:Plugins → 应该能看到 QTiles 选项


三、添加高德地图源

3.1 打开 XYZ Tiles 管理

左侧 Browser 面板 → 找到 XYZ Tiles → 右键点击 → New Connection

3.2 填写连接信息

高德街道地图(推荐)
参数
名称 高德街道
URL https://webrd01.is.autonavi.com/appmaptile?lang=zh_cn&size=1&scale=1&style=8&x={x}&y={y}&z={z}
Min. Zoom Level 1
Max. Zoom Level 15

在这里插入图片描述

ℹ️ 提示

OpenStreetMap的Max. Zoom Level最多只能选择到14

高德卫星地图(可选)
参数
名称 高德卫星
URL https://webst01.is.autonavi.com/appmaptile?style=6&x={x}&y={y}&z={z}
Min. Zoom Level 1
Max. Zoom Level 18
高德卫星+街道标注(可选)
参数
名称 高德卫星标注
URL https://webst01.is.autonavi.com/appmaptile?style=8&x={x}&y={y}&z={z}
Min. Zoom Level 1
Max. Zoom Level 18

3.3 保存连接

填写完成后点击 OK 保存


四、加载高德地图

4.1 加载地图图层

左侧 Browser 面板 → 展开 XYZ Tiles → 双击 高德街道

4.2 地图显示

地图会在主窗口中显示,使用鼠标拖动和滚轮缩放浏览


五、定位到目标区域

方法一:手动定位

  1. 用鼠标拖动地图到目标区域
  2. 滚轮放大,逐步定位到具体位置

方法二:坐标定位

  1. 菜单栏:ViewGeolocationZoom to Coordinates
  2. 输入目标坐标(如扬州市:纬度 32.39,经度 119.42)
  3. 点击 Zoom

六、下载地图瓦片

6.1 打开 QTiles 插件

菜单栏:PluginsQTilesQTiles

6.2 设置下载参数

Tileset name: 扬州(自定义名称)

Output:
  Format: Directory          # 输出为目录结构
  Path: D:\yangzhou_tiles    # 输出路径

Extent:                      # 下载范围
  点击右侧按钮 → "Draw on Map" → 在地图上框选区域
  或直接输入坐标:119.022934, 119.912792, 32.223636, 33.422056 [EPSG:4326]

Zoom:                        # 缩放级别
  Minimum zoom: 0
  Maximum zoom: 15

Tile Parameters:
  Tile size: 256 px
  Tile format: PNG
  DPI: 96
  Quality: 70%

在这里插入图片描述

6.3 开始下载

点击 Run 按钮开始下载

6.4 等待完成

进度条显示:Rendering: X from Y (Z%)

下载完成后自动关闭窗口


七、下载结果

7.1 目录结构

D:\yangzhou_tiles\
└── 扬州\
    ├── 0\
    │   └── 0\
    │       └── 0.png
    ├── 1\
    │   └── ...
    ├── ...
    └── 15\
        └── ...

7.2 存储空间参考

级别范围 瓦片数量 存储空间 适用场景
0-12 约 500 张 约 5 MB 省级概览
0-14 约 3,000 张 约 200 MB 市级概览
0-15 约 12,000 张 约 1 GB 街道级别
0-16 约 50,000 张 约 4 GB 详细级别

八、Java 后端代码

8.1 Controller 代码

package com.mcxx.controller;

import org.springframework.stereotype.Controller;
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.ResponseBody;

import javax.servlet.http.HttpServletResponse;
import java.io.*;

@Controller
@RequestMapping("/map")
public class MapController {
   

    // 瓦片存储根目录(根据实际情况修改)
    private static final String TILE_ROOT_PATH = "/data/map/tiles";
    private static final String BLANK_TILE_PATH = TILE_ROOT_PATH + "/blank.png";

    /** * 获取地图瓦片 * URL格式: /map/tile/{z}/{x}/{y} */
    @RequestMapping(value = "/tile/{z}/{x}/{y}", method = RequestMethod.GET)
    @ResponseBody
    public void getTile(
            @PathVariable("z") int z,
            @PathVariable("x") int x,
            @PathVariable("y") int y,
            HttpServletResponse response) {
   
        
        String tilePath = TILE_ROOT_PATH + "/" + z + "/" + x + "/" + y + ".png";
        File tileFile = new File(tilePath);
        
        response.setContentType("image/png");
        response.setHeader("Cache-Control", "max-age=31536000");
        
        if (!tileFile.exists()) {
   
            File blankTile = new File(BLANK_TILE_PATH);
            if (blankTile.exists()) {
   
                outputFile(blankTile, response);
            } else {
   
                response.setStatus(HttpServletResponse.SC_NOT_FOUND);
            }
            return;
        }
        
        outputFile(tileFile, response);
    }

    /** * 地图定位页面 */
    @RequestMapping(value = "/location", method = RequestMethod.GET)
    public String locationPage() {
   
        return "map/location";
    }

    private void outputFile(File file, HttpServletResponse response) {
   
        try (FileInputStream fis = new FileInputStream(file);
             OutputStream os = response.getOutputStream()) {
   
            byte[] buffer = new byte[4096];
            int bytesRead;
            while ((bytesRead = fis.read(buffer)) != -1) {
   
                os.write(buffer, 0, bytesRead);
            }
            os.flush();
        } catch (IOException e) {
   
            e.printStackTrace();
        }
    }
}

九、常见问题

问题1:插件列表中找不到 QTiles

解决方法:

  1. PluginsManage and Install PluginsSettings
  2. 勾选 Show also experimental plugins
  3. 重新搜索 QTiles

问题2:地图加载很慢

解决方法:

  • 高德地图源在国内访问速度较快
  • 如仍慢,可更换高德服务器:webrd01webrd02 / webrd03 / webrd04

问题3:下载时提示 OSM 限制

解决方法:

  • 使用高德地图源代替 OSM,可避免限制

问题4:下载中断

解决方法:

  • QTiles 支持断点续传
  • 重新运行,会跳过已下载的瓦片
  • 或减少下载范围/级别

十、资源下载

资源 下载地址
QGIS https://qgis.org/zh-Hans/site/forusers/download.html
Leaflet https://leafletjs.com/download.html
jQuery https://jquery.com/download/

总结

本文介绍了使用 QGIS + 高德地图源下载离线瓦片的完整流程:

  1. 安装 QGIS 和 QTiles 插件
  2. 添加高德地图 XYZ 瓦片源
  3. 框选下载区域,设置缩放级别
  4. 下载瓦片到本地目录
  5. 使用 Java 后端提供瓦片服务

该方案适用于离线环境等场景,可满足基本的地图定位需求。


参考链接:

  • QGIS 官网:https://qgis.org/
  • 高德开放平台:https://lbs.amap.com/
  • Leaflet 官网:https://leafletjs.com/

原文链接:https://blog.csdn.net/weixin_43688610/article/details/158918096

我很可爱,请给我钱

昵称
邮箱
0/200
  • 😂
  • 😀
  • 😅
  • 😊
  • 🙂
  • 🙃
  • 😌
  • 😍
  • 😘
  • 😜
  • 😝
  • 😏
  • 😒
  • 🙄
  • 😳
  • 😡
  • 😔
  • 😫
  • 😱
  • 😭
  • 💩
  • 👻
  • 🙌
  • 🖕
  • 👍
  • 👫
  • 👬
  • 👭
  • 🌚
  • 🌝
  • 🙈
  • 💊
  • 😶
  • 🙏
  • 🍦
  • 🍉
  • 😣
  • OωO
  • |´・ω・)ノ
  • ヾ(≧∇≦*)ゝ
  • (☆ω☆)
  • (╯‵□′)╯︵┴─┴
  •  ̄﹃ ̄
  • (/ω\)
  • ∠( ᐛ 」∠)_
  • (๑•̀ㅁ•́ฅ)
  • →_→
  • ୧(๑•̀⌄•́๑)૭
  • ٩(ˊᗜˋ*)و
  • (ノ°ο°)ノ
  • (´இ皿இ`)
  • ⌇●﹏●⌇
  • (ฅ´ω`ฅ)
  • (╯°A°)╯︵○○○
  • φ( ̄∇ ̄o)
  • ヾ(´・ ・`。)ノ"
  • ( ง ᵒ̌皿ᵒ̌)ง⁼³₌₃
  • (ó﹏ò。)
  • Σ(っ °Д °;)っ
  • ( ,,´・ω・)ノ"(´っω・`。)
  • ╮(╯▽╰)╭
  • o(*////▽////*)q
  • >﹏<
  • ( ๑´•ω•) "(ㆆᴗㆆ)
  • Emoji
  • 颜文字
0 条评论