mapbox-gl实战教程:加载各种底图技巧2
  f3bWzBI6oP0A 2023年11月02日 62 0

接续上篇,本篇继续讲mapbox-gl加载各种底图的技巧。 五、矢量切片底图加载 矢量切片(vector tiles)是随着mapbox-gl产生的一种地图切片格式,相比于之前的影像/图片格式的切片,矢量切片可以在客户端进行样式设置,当用户觉得地图配色等不满足要求时,只需要在客户端调整配置即可。 矢量切片加载时,使用vector的数据源,在layer里根据属性设置图层在地图上展示的样式;mapbox-gl官方提供了矢量切片工具,用geoserver等地图发布软件可以进行发布 加载数据源的简单代码,其中scheme需要根据切片形式修改:

"vectorsource": {
    "type": "vector",
     "tiles": [
    'http://.../{z}/{x}/{y}.pbf'
      ],
    "scheme": "tms" 
     },

根据数据源,加载图层,一个数据源中可以包含多个图层,source-layer是根据图层名称设置:

{
      id: 'vectorlayer',
      type: 'fill-extrusion',
      source: 'vectorsource',
      "source-layer": "samplelayer", 
      paint: { 
        'fill-extrusion-color': 'rgba(69, 172, 241, 1)',
        ...
      }

五、geojson底图加载 这里加一项,在不注重地图细节的场景中,使用geojson形式的行政区划数据,也能够作为开发的底图数据。 加载geojson格式的数据源代码:

"geojsondata": {
    "type": "geojson",
    "data": "geojson数据或者数据链接地址"
}

加载图层的代码和矢量图层的基本相同,只是不需要设置source-layer属性。

【版权声明】本文内容来自摩杜云社区用户原创、第三方投稿、转载,内容版权归原作者所有。本网站的目的在于传递更多信息,不拥有版权,亦不承担相应法律责任。如果您发现本社区中有涉嫌抄袭的内容,欢迎发送邮件进行举报,并提供相关证据,一经查实,本社区将立刻删除涉嫌侵权内容,举报邮箱: cloudbbs@moduyun.com

  1. 分享:
最后一次编辑于 2023年11月08日 0

暂无评论

f3bWzBI6oP0A