mapbox-gl-js筛选器或数据驱动属性

Question

对于知道mapbox内部工作方式的人来说，这是一个问题。

用例:根据属性区域，我们要显示两个颜色不同的多边形。

目前，使用mapbox，您可以根据数据定义样式的两种方法：

1. 使用过滤器：

{
  "id": "region_sud",
  "filter": [
    "all",
    [
      "==",
      "sud",
      ["get", "region"]
    ]
  ],
  "paint": {
    "fill-color": "#F27E00",
  },
  "source": "region",
  "source-layer": "region",
  "type": "fill"
},{
  "id": "region_nord",
  "filter": [
    "all",
    [
      "==",
      "nord",
      ["get", "region"]
    ]
  ],
  "paint": {
    "fill-color": "#007E00",
  },
  "source": "region",
  "source-layer": "region",
  "type": "fill"
}

1. 使用数据驱动样式属性

{
  "id": "region",
  "paint": {
    "fill-color": [
      "case",
      ["==", ["get", "region"],"sud"],
      "#F27E00",
      ["==", ["get", "region"],"nord"],
      "#007E00",
      "#000000",
    ],
  },
  "source": "region",
  "source-layer": "region",
  "type": "fill"
}

我认为最好的选择是方法2，因为我们只需要创建一种样式，而不是2。

但是如果有20到200个不同的区域要画呢？哪种解决方案在性能上是最好的？

Answer 1

如果您定义了20-200层，则地图绘制将变得缓慢.因此，当然，将它们看作一个单层并使用数据驱动样式是一种更好的方法。

你可以看看文档