多边形¶
多边形是包含外部笔划(或“轮廓”)和内部(或“填充”)的二维形状。多边形可以被认为是一个不规则形状的点,其样式与圆形相似。
多边形层示例¶
这个 polygons layer
下面使用的是一个虚构国家的县信息。作为参考,下面包含了多边形的属性表。
|
|
|
---|---|---|
polygon.1 |
反讽县 |
412234 |
polygon.2 |
跟踪县 |
235421 |
polygon.3 |
德古拉县 |
135022 |
polygon.4 |
保利县 |
1567879 |
polygon.5 |
轴承县 |
201989 |
polygon.6 |
基督山县 |
152734 |
polygon.7 |
大县 |
67123 |
polygon.8 |
伦布县 |
198029 |
简单多边形¶
此示例显示一个用蓝色填充的多边形。

简单多边形¶
代码¶
Download the "Simple polygon" MBStyle
1{
2 "version": 8,
3 "name": "simple-polygon",
4 "layers": [
5 {
6 "id": "polygon",
7 "type": "fill",
8 "paint": {
9 "fill-color": "#000080"
10 }
11 }
12 ]
13}
细节¶
这种样式有一个层,这是最简单的可能情况。造型多边形是通过填充类型完成的。( 第7行 ) 第9行 指定深蓝色 ('#000080'
)作为多边形的填充颜色。
备注
图中多边形周围的浅色轮廓是由相邻的多边形引起的渲染器的伪影。这种样式没有轮廓。
带笔划的简单多边形¶
此示例将1像素的白色轮廓添加到 简单多边形 例子。

带笔划的简单多边形¶
代码¶
Download the "Simple polygon with stroke" MBStyle
1{
2 "version": 8,
3 "name": "simple-polygon-outline",
4 "layers": [
5 {
6 "id": "polygon-outline",
7 "type": "fill",
8 "paint": {
9 "fill-outline-color": "#FFFFFF",
10 "fill-color": "#000080"
11 }
12 }
13 ]
14}
细节¶
此示例与 简单多边形 上面的例子,加上 fill-outline
油漆参数( 第9行 ) 第9行 同时将笔划颜色设置为白色 ('#FFFFFF'
) "fill-outline-color"
只能是1个像素,这是mbstyle的限制。
透明多边形¶
此示例基于 带笔划的简单多边形 示例并通过将不透明度设置为50%使填充部分透明。

透明多边形¶
代码¶
Download the "Transparent polygon" MBStyle
1{
2 "version": 8,
3 "name": "simple-polygon-transparent",
4 "layers": [
5 {
6 "id": "polygon-transparent",
7 "type": "fill",
8 "paint": {
9 "fill-outline-color": "#FFFFFF",
10 "fill-color": "#000080",
11 "fill-opacity": 0.5
12 }
13 }
14 ]
15}
细节¶
此示例与 带笔划的简单多边形 示例,保存以定义填充的不透明度 第11行 .0.5的值会导致部分透明的填充,即50%不透明。不透明度值为1将填充绘制为100%不透明,而不透明度值为0将导致完全透明(0%不透明)填充。在本例中,由于背景是白色,所以深蓝色看起来更亮。如果填充在深色背景上,生成的颜色将更暗。