1. 基本说明

本项目实现了离线展示百度、谷歌、高德、腾讯地图。主要功能如下:

  • 实现了地图瓦片图下载、存储。目前支持存储至MySQL
  • Node.js服务调用MySQL中的瓦片图
  • Leaflet展示地图

展示效果如下:

2. 地图瓦片下载工具及配置

工具下载链接: http://pan.baidu.com/s/1qYoHj4K 密码: ehgh 工具使用方法:

  • 数据库配置

打开工具目录中的 MapDownloader.exe.config 文件。根据实际情况填写如图中的配置信息。

  • 地图瓦片图下载

打开工具目录中 MapDownloader.exe -> 选择画图工具、矩形 -> 地图上框选区域 -> 存储方式选择MySQL数据库 -> Zoom根据需要选择 -> 点击下载

  

  • 数据库中存储的瓦片图

备注:数据库中Type字段指的是地图类型,对于谷歌地图 普通地图(1818940751)、卫星地图(47626774)、标注(1024577166)。此工具功能丰富,可细细研究。

3. node.js服务配置

  • 修改mysql.js 中的配置。根据实际情况,配置数据库链接

  • 进入目录 cd OfflineMap
  • 安装资源 npm install
  • 启动服务 npm start
  • 服务地址 http://127.0.0.1:3001

4. 页面展示

打开example文件夹中的map.html即可。

GitHub地址:https://github.com/dxxzst/OfflineMap

如本项目对您有所帮助,欢迎Star。

基于MySQL + Node.js + Leaflet的离线地图展示,支持百度、谷歌、高德、腾讯地图的更多相关文章

  1. 基于 Angularjs&Node.js 云编辑器架构设计及开发实践

    基于 Angularjs&Node.js 云编辑器架构设计及开发实践 一.产品背景 二.总体架构 1. 前端架构 a.前端层次 b.核心基础模块设计 c.业务模块设计 2. Node.js端设 ...

  2. node.js与HTML5离线缓存

    最近正学到HTML5的离线缓存,却看到需要配置服务器.一下子就懵了,毕竟服务器的有关配置一般是很复杂的,而node.js的服务器是自己的代码生成的,这下要怎么配置?在网上搜索了很久,都没用关于node ...

  3. Vue3.0中引入地图(谷歌+高德+腾讯+百度)

    1 概述 项目需求需要引入地图,对于目前最新的Vue3.0,无论是百度/高德/腾讯地图目前还没有适配,只有Vue 2.x版本的: 目前只有谷歌地图的Vue3.0适配: 但是没有适配并不代表不能使用,本 ...

  4. 基于Vue+node.js的个人博客

    前言 作为一个年轻的程序员,而且是作为一个未来的前端工程师,怎么能没有一个属于自己的博客呢,于是乎在暑假咸鱼了一个多月后开始了我的博客的编写. 技术栈 前端 vue.js+scss  因为当时没学vu ...

  5. 在阿里云ECS CentOS7上部署基于MongoDB+Node.js的博客

    前言:这是一篇教你如何在阿里云的ECS CentOS 7服务器上搭建一个个人博客的教程,教程比较基础,笔者尽可能比较详细的把每一步都罗列下来,包括所需软件的下载安装和域名的绑定,笔者在此之前对Linu ...

  6. 腾讯云部署golang flow流程,vue.js+nginx+mysql+node.js

    这次总算把js-ojus/flow的ui部署到腾讯云上,比较吐槽的就是,为啥这么复杂,vue.js前后端分离,比golang编写的部署方面复杂几万倍.真是浪费人生啊. golang+sqlite写的东 ...

  7. 基于Hexo+Node.js+github+coding搭建个人博客——基础篇

    附上个人教程:http://www.ookamiantd.top/2017/build-blog-hexo-base/ 搭建此博客的动机以及好处在此就不多谈了,之前已经表达过,详情请看Start My ...

  8. node.js和npm离线安装

    离线安装node.js和npm 1.下载官方安装包并拷贝到离线机器上. 官方下载地址:https://nodejs.org/en/download/ 2.解压文件: tar-xJf node-v8.9 ...

  9. MySQL+Node.js连接和操作

    在本节中,您将学习如何使用mysql模块从node.js应用程序与MySQL进行交互. 我们将向您展示如何使用Node.js连接到MySQL,执行常用操作,如使用mysql模块API执行插入,选择,更 ...

随机推荐

  1. Servlet 笔记-Session 跟踪

    HTTP 是一种"无状态"协议,这意味着每次客户端检索网页时,客户端打开一个单独的连接到 Web 服务器,服务器会自动不保留之前客户端请求的任何记录. 但是仍然有以下三种方式来维持 ...

  2. require.js实现js模块化编程(一)

    1.认识require.js: 官方文档:http://requirejs.org/RequireJS是一个非常小巧的JavaScript模块载入框架,是AMD规范最好的实现者之一.最新版本的Requ ...

  3. java 随记

    后台开发的过程中积累的关于java的杂记 架构 SSH框架 为什么要分层? 因为分层使代码变得清晰,容易写也容易阅读,更重要的是让代码扩展性更好,层与层之间的改动不会互相影响 各层的分工 dao--与 ...

  4. spark join操作解读

    本文主要介绍spark join相关操作,Java描述. 讲述三个方法spark join,left-outer-join,right-outer-join 我们以实例来进行说明.我的实现步骤记录如下 ...

  5. hihocoder 1015题

    代码 #include <iostream> #include <string> #include <typeinfo> #include <vector&g ...

  6. Linux系统安装_Centos6.9

    第1章 虚拟机安装  1.1 镜像下载 1.1.1 新版本下载 http://mirrors.aliyun.com  #阿里云官方镜像站点 1.1.2 旧版本下载 http://vault.cento ...

  7. JQuery Deferred 对象剖析

    JQuery 中利用 Deferred 对象提供类似 ES2016(aka. es7) 中 Promise 的功能. JQuery 中的 AJAX 请求函数返回的就是 Deferred 对象. 通过使 ...

  8. RobotFramework自动化测试框架-移动手机自动化测试Get Element Location关键字的使用

    Get Element Location关键字用来获取一个Element的Location位置,该关键字接收一个参数[ locator ] 示例1:使用Get Element Location来获取一 ...

  9. PHP--最常用--必背函数总结!php学习者收藏必备!

    一.PHP系统函数 函数 功能 用法 var_dump() 打印变量结构信息,包括类型和值.数组将递归展开值 var_dump ( $arg1...); echo():是语法结构 输出一个或者多个字符 ...

  10. mapbox-gl象形文字字体glyph生成

    简介 mapbox-gl可以对文字显示各种字体(依赖ttf文件),内部采用的是读取protobuf文件 环境条件 硬件:mac.网络 软件:nodejs.npm 创建mapbox-gl可用的字体pro ...