Mapbox GL JS 中的复合 属性 函数
Composite property functions in Mapbox GL JS
有没有办法在 Mapbox GL JS 的 属性 函数中使用多个 属性?在 CartoCSS 中,我会做如下的事情:
.states {
[name="California"] {
"polygon-fill": "blue"
},
[name_abbrev="WA"] {
"polygon-fill": "green"
}
}
在 Mapbox GL JS 中,我似乎可以根据 属性 name
- 或 - name_abbrev
设置 fill-color
的样式,但不能同时使用两者特性。例如:
'fill-color': {
'property': 'name',
'type': 'categorical',
'stops': [
['California', 'blue']
]
},
'fill-color': {
'property': 'name_abbrev',
'type': 'categorical',
'stops': [
['WA', 'green']
]
}
这导致第二个 fill-color
覆盖第一个,加利福尼亚将只是绿色。
Mapbox GL 不支持基于一层内多个属性的样式。您可以重新处理您的数据以将您想要设置样式的属性组合到一个图层中,或者您可以创建两个图层并使用过滤器来分离功能,如果您的推理是并非所有功能都具有特定的 layer/some 需要使用回退 属性:类似于
{
... layer metadata (id, source, source-layer, type, etc) ...
'filter': ['has', 'name'],
'paint': {
'fill-color': {
'property': 'name',
'type': 'categorical',
'stops': [
['California', 'blue']
]
}
}
},
{
... layer metadata (id, source, source-layer, type, etc) ...
'filter': ['!has', 'name'],
'paint': {
'fill-color': {
'property': 'name_abbrev',
'type': 'categorical',
'stops': [
['WA', 'green']
]
}
}
}
有没有办法在 Mapbox GL JS 的 属性 函数中使用多个 属性?在 CartoCSS 中,我会做如下的事情:
.states {
[name="California"] {
"polygon-fill": "blue"
},
[name_abbrev="WA"] {
"polygon-fill": "green"
}
}
在 Mapbox GL JS 中,我似乎可以根据 属性 name
- 或 - name_abbrev
设置 fill-color
的样式,但不能同时使用两者特性。例如:
'fill-color': {
'property': 'name',
'type': 'categorical',
'stops': [
['California', 'blue']
]
},
'fill-color': {
'property': 'name_abbrev',
'type': 'categorical',
'stops': [
['WA', 'green']
]
}
这导致第二个 fill-color
覆盖第一个,加利福尼亚将只是绿色。
Mapbox GL 不支持基于一层内多个属性的样式。您可以重新处理您的数据以将您想要设置样式的属性组合到一个图层中,或者您可以创建两个图层并使用过滤器来分离功能,如果您的推理是并非所有功能都具有特定的 layer/some 需要使用回退 属性:类似于
{
... layer metadata (id, source, source-layer, type, etc) ...
'filter': ['has', 'name'],
'paint': {
'fill-color': {
'property': 'name',
'type': 'categorical',
'stops': [
['California', 'blue']
]
}
}
},
{
... layer metadata (id, source, source-layer, type, etc) ...
'filter': ['!has', 'name'],
'paint': {
'fill-color': {
'property': 'name_abbrev',
'type': 'categorical',
'stops': [
['WA', 'green']
]
}
}
}