⭐Mapbox GL JS学习探索系列(2) - Source

简介

在mapbox中对于地图,图层的呈现都依托于相应的数据源去渲染。mapbox 中的数据源一般分为vector, raster, raster-dem, geojson, image, video这六种类型,本文依次对这6中资源类型进行简单介绍。

vector 与 raster

矢量瓦片与栅格瓦片。关于地图的瓦片加载,在上一篇文章中有介绍,这里简单说一下矢量与栅格的区别。在gis 中 矢量瓦片与栅格瓦片的关系,类似于计算机图形中的矢量图和点阵图的关系,vector是通过点线面这三种基础模型,然后在地图的横纵坐标上进行绘制呈现,而raster则是通过像素点来对地图进行绘制。

  • vector优点:因为不同于raster通过像素点绘制,因此不会出现放大后地图变模糊的情况。
  • vector缺点:在数据存储过程中,运算相对较多。不能存储高程数据(DEM)来对地理特征做表示。
  • raster优点:每个单元格的地理信息都是很明确的,因此去做建模和数据分析都比较方便。
  • raster缺点:单元格数据大小决定分辨率,因此容易出现模糊,不能较好的表示地图显示的线性特征。

pdf 即是地图的瓦片数据。
⭐Mapbox GL JS学习探索系列(2) - Source_第1张图片

raster DEM

栅格瓦片 - 数字高程模型。
因为raster这种数据源对于地图位置能有较好的表示,在此基础上,可以增加对于地表特征的描述,应用场景为地形地貌的分析描述。
关于 DEM的详细介绍

geojson

geojson 是gis中常用到表示地理信息的数据格式,对于点线面等基本图形,都有其标准的表示方法。
比如在地图中对于一个点的数据表示方法

{
   type: 'geojson',
   data: {
       "type": "FeatureCollection",
       "features": [{
           "type": "Feature",
           "bbox": [-180.0, -90.0, 180.0, 90.0],
           "properties": {},
           "geometry": {
               "type": "Point",
               "coordinates": [
                   -76.53063297271729,
                   39.18174077994108
               ]
           }
       }]
   }
}

在geometry中的type,具体表述了数据的类型,可以是点,线,以及面。具体有:"Point", "MultiPoint", "LineString", "MultiLineString", "Polygon", "MultiPolygon"。

在feature这一层级可以加入bbox属性来表示这一个特征值的边界,通常为左上右下的两个x,y坐标。

通常在实际开发应用的,还会使用turf.js 这个空间坐标的类库,来提高开发效率,这个库提供了空间地理坐标常用的一些方法,非常好用。

在geojson这里介绍一个cluster属性,这是一个聚合属性,在开启这个属性之后,图层会检测数据渲染之后是否该聚合(变相的碰撞检测),可以通过设置clusterRadius来控制图层数据间的显示隐藏的距离。在实际开发中对于图层的处理方面,有很大帮助,在之后介绍layer的文章中会用一个实际是范例来讲解。

image,video

能够直接在地图中引入图片和视频,本人在实际工作中接触的较少,就不展开说明了。

以上就是mapbox的数据源的简单介绍,其中geojson是使用频率最高的,也是在对地图进行二次构造中,最为灵活易用的数据类型。

你可能感兴趣的:(mapbox,javascript)