Mapbox 作为现如今比较流行的地图框架为我们提供了漂亮的个性化地图,在平常的使用过程中可以方便的接入高德/谷歌等矢量切片地图。由于Mapbox地图数据来源于Open Street Map等国外厂商,中国地图POI/道路等信息都不全,造成在实际项目中使用很不精细。对比国内互联网地图厂商,百度和高德都提供了自有格式的矢量地图,如何解析其数据,再将数据PBF化,就是我们重点研究的问题了。本文作为学术研究,将探讨下解析高德矢量地图,并PFB化。

  1. 打开高德地图,我们可以看到地图数据有以下两种请求格式:
    1. mapType=normal&v=2&style=5&rd=1&flds=poilabel,roadlabel&t= 2. mapType=normal&v=2&style=5&rd=1&flds=region,building,road&t=
    第一种格式是用来请求标志类的,包括POI 道路标注,第二种数据格式是用来请求区域、建筑面数据、道路信息的。

  2. url 参数t后面就是请求的行列号和地图层级。注意:这个行列号是经过加密的。
  3. 请求第一种格式的URL,通过分析返回的数据结构,可以得到每组JSON 数据是通过|连接的,从下标为1的数据进行JSON反序列化,得到的POI 和道路标注数据。如下图

再进一步研究得出下标为0的就是POI数据,下标为1的是标注的颜色(也是加密的),下标为4的就是POI 的分类,分类为labels:pois的兴趣点,二级分类是下标为5的数据。
分析POI数据如下图

下标为0 的是标注名称,下标为1的是坐标信息(加密),下标为2 为文字偏移量,下标3为POI 的图片的位置和偏移量。

  1. 过同样的分析手段,我们得到了高德地图的各个元素数据,接下来进行PBF序列化数据,在这之前先考虑下Mapbox的Style样式问题。

A) sprite Json 文件和图片文件。高德地图中POI 所有的图标都在一个文件中icon-normal-small.png,每个图标的大小为24×24,计算POI 图标生成sprite Json文件。

B) mapbox 图层大致可分为地图背景、region、road、building、poi、road_label,当然根据高德数据格式可以划分的更细,比如可以将poi 分为19个小类和区域标注、城市、区县乡镇,村庄等。这样的分类和高德提供的风格化地图样式一样的了。
同时我们可以加入自定义的行政区背景地图使得地图更加的漂亮。

解决了以上两个问题后,就可以进行PBF序列化数据
新建java web 项目,引入java-vector-tile jar 包,编写相关代码,发布服务,再使用mapbox 接入服务,此致mapbox成功接入了高德矢量化地图。

遗留问题:
1)高德地图中将道路和道路标注分开,且道路标注是多个文字,使得mapbox 中道路的文字显示不全。
2)道路数据不够精细,导致地图在大比例尺下道路与道路之间有间隙。
3)建筑物锯齿过于明显。
4)对于区县绘制矩形底图需要动态计算暂时未实现。

mapbox 接入高德矢量地图实战的更多相关文章

  1. Unity与Android交互-Unity接入高德地图实现定位以及搜索周边的功能(使用Android Studio)详细操作

    刚进公司给安排的任务就是Unity接入高德地图,算是踩了不少坑总算做出来了,抽点时间写个博客记录一下 废话不多说 先上效果图 获取定位并根据手机朝向显示周边信息            使用的Unity ...

  2. ArcGIS Javascript API 加载高德在线地图扩展

    利用ArcGIS JavaScript API加载高德在线地图的扩展 /** * Created by WanderGIS on 2015/7/15. */ define(["dojo/_b ...

  3. jQuery Mapael – 呈现动态的矢量地图

    jQuery Mapael 是基于 Raphael.js 的一个 jQuery 插件,可以显示动态矢量地图.例如,使用 Mapael 可以显示国家能够点击的世界地图.此外,你可以用圈,方形或者图片来标 ...

  4. 关于如何使用ehcarts2加载svg矢量地图并自定义县级内部乡镇轮廓

    项目需求:显示县级内部的乡镇一级地图的轮廓! 效果预览: 阻碍因素:echarts不提供县级以下乡镇级轮廓. 解决思路: 1.根据资料查找相关县的行政区域图(百度搜索),如本人所制作的浙江省宁波市宁海 ...

  5. vue-amap | 基于 Vue 2.x 与高德的地图组件

    vue-amap | 基于 Vue 2.x 与高德的地图组件 参考:https://elemefe.github.io/vue-amap/#/

  6. (android 地图实战开发)2 创建MapActivity,根据设备当前位置,显示地图

    (android 地图实战开发)2 创建MapActivity,根据设备当前位置,显示地图 http://www.cnblogs.com/macroxu-1982/archive/2011/09/13 ...

  7. ArcGIS Earth(原谷歌地球)如何获取高精度矢量地图数据?(shp文件/要素类/kml)

    大家好,这次来分享干货.做地理分析的同学,或者需要使用地图却不知道哪里有矢量数据的时候,怎么办呢? 这次,我就告诉大家哪里能自己手工制作矢量点线面数据!注意哦,是自己绘制的. 使用到的软件: ArcG ...

  8. 使用tippecanoe把GeoJSON制作成供mapbox展示的矢量切片vectortile

    本文记录一下把geojson格式的数据制作成本地的矢量切片,并在mapbox中展示的过程. 1.切片 1.1 矢量数据需要先转换为geojson,如果是shp格式可以使用QGIS或者下载shp2gwo ...

  9. Android ---------高德卫星地图绘制多个点和点的点击事件自定义弹窗

    最近开发中,遇到一个多个点绘制,并实现点击事件,出现自定义窗口显示相关信息等功能,所以写了这篇博客. 从后台请求数据,得到多个经纬度,然后绘制在地图上,并实现点击,出现相关信息(自定义弹框实现) 先来 ...

随机推荐

  1. P3153 [CQOI2009]跳舞

    题目描述 一次舞会有n个男孩和n个女孩.每首曲子开始时,所有男孩和女孩恰好配成n对跳交谊舞.每个男孩都不会和同一个女孩跳两首(或更多)舞曲.有一些男孩女孩相互喜欢,而其他相互不喜欢(不会”单向喜欢“) ...

  2. CF 1103B Game with modulo

    题目 $a, x$ 是正整数.显然有 \begin{aligned} x \ge 2x \pmod{a} \implies a \le 2x \end{aligned} 若 $x \le a$ 则 \ ...

  3. Manacher算法学习 【马拉车】

    好久没写算法学习博客了 比较懒,一直在刷水题 今天学一个用于回文串计算问题manacher算法[马拉车] 回文串 回文串:指的是以字符串中心为轴,两边字符关于该轴对称的字符串 ——例如abaaba 最 ...

  4. gdb调试的艺术——Debug技巧

    调试的艺术——Debug技巧总结 (本文从写好的wiki里粘出来的,格式稍乱不影响阅读) 用Q+编号代表问题,A+编号代表答案.用这种方式组织.如无特别说明,这些技巧都是针对Visual Studio ...

  5. testng自定义注解

    在testng中大部分的注解已经可以满足我们测试的需求,但是在测试的时候想要通过注解的方式加入自己测试一些内容,比如 测试项目 测试描述  验证点等信息,可通过自定义注解的方式实现. 具体操作步骤如下 ...

  6. 从零开始--Spring项目整合(1)使用maven框架搭建项目

    这些年一直在用spring的框架搭建项目,现在开始我们从零开始利用Spring框架来搭建项目,目前我能想到有Spring.SpringMVC.SpringJDBC.Mybatis.WebSockt.R ...

  7. 洛谷noip 模拟赛 day1 T1

    T7925 剪纸 题目描述 小芳有一张nnn*mmm的长方形纸片.每次小芳将会从这个纸片里面剪去一个最大的正方形纸片,直到全部剪完(剩下一个正方形)为止. 小芳总共能得到多少片正方形纸片? 输入输出格 ...

  8. sql 查找死锁对象的存储过程

    USE [master] GO /****** Object: StoredProcedure [dbo].[sp_who_lock] Script Date: 05/12/2016 14:13:46 ...

  9. android hook 框架 ADBI 简介、编译、运行

    Android so注入-libinject2 简介.编译.运行 Android so注入-libinject2  如何实现so注入 Android so注入-Libinject 如何实现so注入 A ...

  10. LVM更换硬盘

    #检测坏道 smartctl -a /dev/sdd #硬盘检测 e2fsck -f /dev/mapper/vg_root-lv_data #重新定义空间大小,将原来的大小上减去要移走的硬盘 res ...