Skip to content

月份:2016年12月

Mapbox矢量切片源码分析

为了了解矢量切片的更多技术细节,轻微挖一挖Mapbox-gl-js的前端结构。比较关键的内容是矢量切片如何在前端如何被定义、加载和绘制,下面结合源码稍微介绍下。

概念

矢量切片规范

Mapbox矢量切片规范定义的内容:文件格式(后缀名、MIME)、投影和范围、内部结构(图层、要素、几何图形编码、要素属性)。切片文件里不在是地理坐标(例如经度和纬度),而是屏幕坐标,也并不包含任何地理信息。在切片文件里,原点坐标是左上角,x轴向右递增,y轴向下递增。

绘制

Mapbox-gl-js使用客户端绘制,这是vector tiles在前端最核心的部分,也因为此,在前端运行时修改地图样式变得轻而易举。大多数地图前端SDK或api(如arcgis、openlayers、leaflet),决定mapview的通常就是center point + zoom level(或 center point + extent),在矢量绘制情况下,zoom level可以是任意的,包括小数(例如6.5),应该基本上算是无极缩放了。除此之外,还有两个很重要的参数:
1. bearing:地图旋转参数,单位是度数。
2. pitch:地图倾斜角度(3d才cool嘛)。

在图层方面,Mapbox gl中定义了渲染数据的方式,这些数据即可以是栅格,也可以是矢量。但由于前端渲染,所以实际上底图和专题图在技术实现上,并没有实质的区别。这样的好处是,所有的要素都可以如同arcgis下的GraphicLayer,或者Javascript中的div一般可拥有较可控的交互能力。

camera和Map

Mapboxgl.camera控制目标位置的中心点位置、缩放级别、旋转角度和倾斜角度。Mapboxgl.Map对象是提供开发接口的最基本对象,继承自camera,并在初始化的时候通过container的设置(HTML元素)来告知Mapboxgl渲染出对应的Map对象。

5 Comments

矢量地图切片技术分析

1. 什么是矢量切片

传统的栅格地图切片,是预先在Server端绘制好固定的PNG和JPG切片集合。而矢量切片是很早就已经出现,并已通过各种不同的技术手段在应用中表现出来,大多以json或二进制文件将矢量地图数据传输至前端进行绘制。例如百度地图、Google地图等都较早实现了栅格和矢量两种模式。

矢量地图切片将矢量数据通过不同的描述文件来组织和定义,通常通过自定义文件或json文件进行传输,在前端按需请求不同的矢量瓦片数据文件,并利用类似canvas等技术进行绘制。使用这种技术有不少好处,例如不再需要为不同的样式而反复进行制图、渲染、切片、更新service等过程,并且在当前各种高分屏、视网膜屏大肆发展的阶段,避开按照特定DPI和分辨率渲染的栅格图片在不同的显示设备上无法以统一清晰的效果呈现,等等。

当前,矢量切片已经广泛应用开了,现在的在OSM数据中得到了广泛的使用,例如这个站点提供了OSM Planet和分国家区域的daily下载包,并且以MBTiles文件的形式提供。

 

1.1 矢量切片规范

Mapbox提出了Vector Tile的开放规范,并遵守Creative Commons Attribution 3.0 United States License:Mapbox Vector Tile Specification,该规范用到了Google的Protocol Buffers作为数据编码规范。同样被Mapbox列入规范的还有MBTiles is a specification,作为在SQLite中存储切片数据的规范。在两者的github页面上,都可以找到对应规范的实现清单,这些实现大多是开源工具,也包含一些闭源软件,而这些所有,足以支撑起矢量切片的数据转换、数据存储、数据服务的全技术架构的基本骨架。

90 Comments

说一说新出的ArcGIS Runtime SDK v100.0

11月21日,ESRI在官博上发布了题为“ArcGIS Runtime SDK 100.0 has arrived!”的博文,这个100.0足够吸引了眼球,其实回头算算,quartz beta已经太久太久了,而这个100.0,本质上就是quartz release。

以下只是一些吐槽,以及从地图结构的变化角度,来看看ESRI的思路。

关于Desktop Development

ESRI的Runtime产品线在不断壮大,其中单个开发语言中的具体选型,也看出了跨平台的思路。Android、iOS、macOS三者不说,都是运行在特定平台之上,而似乎有不能被忽略的。而Java(Windows/Linux/macOS)、.NET(Windows/iOS/Android)、Qt(Windows/Linux/Android/iOS)三者,无一不是看起来牛气冲天。但是冷静思考下来,其核心竞争力还是很难讲,毕竟在跨平台这个层面,Qt受众较小;.NET独大,但app开发者中,没有足够多的Xamarin用户;Java本该是一枝独秀,无奈Oracle强取豪夺之下,发展堪忧,其客户端开发技术更是令人无所适从,在这种情况下,ESRI此次的v100居然选择了JavaFX这个看似时髦(2008年才推出)却又实际上后劲不足的语言实现。按我建议,更倾向于继续使用swing来保留住传统意义的Java开发者。不过值得推崇的是,此次的Java SDK已经扩展到了macOS(除了Local Server之类无法支持)。相比之下,macOS在ArcGIS的用户(尤其是中国用户)中也属于相对小众,但是单看Swift和Objc的双重策略,也该为ESRI点赞。毕竟在“语系”上,macOS的开发技术与iOS/watchOS系出同门。

73 Comments