在 Mapbox 中组合大小写和缩放表达式

Question

我有一个层将 Geojson 源中的多边形要素渲染为填充区域。以下是其中一项功能的示例：

{
  "type": "FeatureCollection",
  "features": [
    {
      "type": "Feature",
      "properties": {
        "id": 12345,
        "name": 'exampleName',
        "hasCities": true | false,
      },
      "geometry": {
        "type": "Polygon",
        "coordinates": [[...], [...]]
      }
    }, {...}
  ]
  "properties": {
    "parent_name": "parent1",
    "parent_id": 23,
  }
}

我想达到这个填充不透明度逻辑：

const isRed = true | false
const redOpacity = 0.5
const notRedOpacity = 0.8

if (hasCities) {
  opacity = 0
} else if (isRed) {
  if(zoom <= 14) // use linear interpolation
    opacity = redOpacity
  else if(zoom >= 19)
    opacity = 0.03
  else 
    interpolate
} else {
  if(zoom <= 14) // use linear interpolation
    opacity = notRedOpacity
  else if(zoom >= 19)
    opacity = 0.03
  else 
    interpolate
}

这是我的出发点：

const opacity = [
  'case',
  ['boolean', ['get', 'hasCities']],
  0,
  isRed ? redOpacity : notRedOpacity,
]

然后我不知道如何实现缩放部分。我想我需要这样的东西：

const zoomOpacity = ['interpolate', ['linear'], ['zoom'], 14, notRedOpacity | redOpacity, 19, 0.03]

但我不确定如何结合这两个表达式？我知道这一点"zoom" expression may only be used as input to a top-level "step" or "interpolate" expression."，所以我想我需要使用step运算符。

有人能帮助我吗？

Answer 1

您需要首先翻转您的逻辑，以便缩放是第一个决定：

if(zoom <= 14) // use linear interpolation
    if (hasCities)
        opacity = 0
    else if (isRed) {
        opacity = redOpacity
    else
        opacity = notRedOpacity
if (zoom >= 19)
    if (hasCities)
        opacity = 0
    else 
        opacity = 0.03

然后将其表示为一个根据缩放和其他选项计算不透明度的函数：

opacity = interpolate (zoom)
    14:     
        if (hasCities)
            0
        else if (isRed) {
            redOpacity
        else
            notRedOpacity
    19:
        if (hasCities)
            0
        else 
            0.03

最后，在实际的 Mapbox GL 语言中：

if(zoom <= 14) // use linear interpolation
    if (hasCities)
        opacity = 0
    else if (isRed) {
        opacity = redOpacity
    else
        opacity = notRedOpacity
if (zoom >= 19)
    if (hasCities)
        opacity = 0
    else 
        opacity = 0.03