Mapbox GL JS CookbookMapbox GL JS Cookbook
快速开始
样式规范
空间数据
插件
进阶
DECK.GL
  • 文档
  • 术语
  • 示例
GitHub
快速开始
样式规范
空间数据
插件
进阶
DECK.GL
  • 文档
  • 术语
  • 示例
GitHub
  • 样式规范

    • 样式规范
    • 雪碧图
    • 字体
    • 数据源

      • 数据源
      • 瓦片数据源
      • GeoJSON
      • 图片 & 视频
      • 自定义数据源
    • 图层
    • 表达式
    • 灯光
    • 地形

图层

图层属性列出了所有样式所有的图层,图层类型由 type 指定,且必须是 background(背景), fill(填充), line(线), symbol(符号), raster(栅格), circle(圆), fill-extrusion(填充挤压), heatmap(热力图), hillshade(山体阴影), sky(天空) 之一。除了 background 和 sky,其他所有类型的图层必须是指定数据源(source),图层从源获取数据、过滤要素和渲染。

图层示例:

"layers": [
  {
    "id": "water",
    "source": "mapbox-streets",
    "source-layer": "water",
    "type": "fill",
    "paint": {
      "fill-color": "#00ffff"
    }
  }
]

图层的属性如下:

属性类型必须描述
idstring是图层唯一标识
typestring是图层类型
sourcestring否数据源名称,除 background 图层类型外必须
source-layerstring否图层名,矢量瓦片源(vector)必须,其他类型不可用
minzoomnumber否图层最小缩放级别
maxzoomnumber否图层最大缩放级别
filterexpression否过滤器
layoutobject否图层布局属性
paintobject否图层绘制属性
metadataany否任意属性,对跟踪图层很有用,不影响渲染

提示

  • layout 属性都有 visibility 属性,可设置 "visible"(默认) 和 "none" 。
  • 颜色支持的格式有:十六进制, RGB, RGBA, HSL, HSLA, HTML 预定义颜色名称。

背景

背景(background)图层覆盖整个地图,可配置颜色和图案填充。

background

填充

填充(fill)图层在地图上渲染一个或多个填充(和可选描边)的面,可以使用填充图层来配置面或多面要素的渲染。

fill

线

线(line) 图层在地图上呈现一条或多条描边线,可以使用线图层来配置线或线集要素的渲染。

line

符号

符号(symbol)图层在地图上的点或沿线渲染图标和文本注记。

symbol

栅格

栅格(raster)图层在地图上渲染栅格瓦片。

raster

圆

圆(circle)图层在地图上渲染填充圆。

circle

填充挤压

填充挤压(fill-extrusion) 图层与填充(fill)图层不同的是可以设置挤压以渲染 3D 多边形。

fill extrusion

热力图

热力图(heatmap)图层渲染一系列颜色以表示区域中点的密度。

heatmap

山体阴影

山体阴影(hillshade)图层渲染 DEM 数据,仅支持 Mapbox Terrain RGB 和 Mapzen Terrarium tiles。

hillshade

天空

从 v2.9.0 开始,雾(fog)是大气样式的首选方法。地球投影(globe)不支持天空(sky)图层,并将在将来的版本中逐步淘汰。

sky

在 GitHub 上编辑此页!
上次更新:
贡献者: huanglii, 黄俐
Next
表达式