javascript - Mapbox GL - 无法通过缩放功能设置可见性

Question

我有一组标记可以添加到我的 map 中。现在，我正在使用 Mapbox GL 缩放功能根据缩放级别调整它们的大小——这很有效。现在我想对可见性做一些类似的事情——当缩放级别为 7 或更低时隐藏这些标记。我使用这段代码来定义标记的布局:

"layout": {
          "icon-image": "marker-{icon}",
          "icon-allow-overlap": true,
          "icon-size": {
              stops: [[6, 0.12], [11, 0.3], [16, 0.3]]
           },
           "icon-offset": [0, -42],
           "visibility": {
              stops: [[7, 'none'], [8, 'visible']]
           }
     }

但是，这是我在 js 控制台中得到的错误 - “错误:layers.places.layout.visibility:期望在 Function.module.exports 中找到 [visible，none]，[object Object] 之一.emitErrors (mapbox-gl.js:149)"

不用说，我的标记没有显示。有谁知道我做错了什么？非常感谢。

Answer 1

首先，要澄清的是，您谈论的是“图标”(“符号”的一部分)层 - 而不是“markers”，它们是在样式之外添加到 map 中的东西。

现在，这里的简单答案是 visibility属性不支持数据驱动样式(注意表中没有“数据驱动样式”行)。 Mapbox 已表示他们不打算根据内存实现它。

相反，您可以使用 icon-opacity获得几乎相同的结果:

"paint": {
    "icon-opacity": {
        stops: [[7, 0], [8, 1]]
    }
}

(我说“几乎”是相同的结果，因为 map 平移和缩放时仍会加载“可见”但不透明度为 0 的图标，因此性能略差。)