Mapbox GL - 基于缩放防止图层标签褪色答案

【问题标题】：Mapbox GL - Prevent Layer Label Fading Based on ZoomMapbox GL - 基于缩放防止图层标签褪色
【发布时间】：2020-10-06 19:51:45
【问题描述】：

将 Mapbox GL JS 1.12.0 与 GeoJSON 源结合使用，我正在添加具有基于 GeoJSON 中“名称”值的数字标签的圆圈。

map.addLayer({
    'id': 'marker',
    'type': 'circle',
    'source': 'geojson',
    'minzoom': 0,
    'maxzoom': 24,
    'paint': {
        'circle-radius': 10,
        'circle-color': '#FFFFFF',
        'circle-stroke-color': '#000000',
        'circle-stroke-width': 2,
        'circle-opacity': 1,
    },
    'filter': ['==', '$type', 'Point']
});

map.addLayer({
    'id': 'marker-label',
    'type': 'symbol',
    'source': 'geojson',
    'minzoom': 0,
    'maxzoom': 24,
    'layout': {
        'text-field': [ 'format', ['get', 'name'], { 'font-scale': 0.8, 'text-translate': [0,-20] } ],
    },
    'filter': ['==', '$type', 'Point']
});

当您放大时，它们看起来是正确的：

当您缩小时，圆圈开始重叠，但看起来仍然正确：

但随后“2”淡出，“1”通过#2 的圆圈显示（即使圆圈具有白色填充和不透明度为 1），并且不清楚哪个是＃1，哪个是＃ 2.

有没有更好的方法来做到这一点？我希望你可以给圆圈本身添加一个居中的标签。

我可以禁用这种自动淡入/透明吗？

我能以某种方式将标签绑定到那个特定的圈子吗？

【问题讨论】：

标签： mapbox mapbox-gl-js mapbox-gl mapbox-marker

【解决方案1】：

我可以禁用这种自动淡入/透明吗？

您可以使用"text-allow-overlap": true 禁用它。你可能不喜欢这个结果。

我能以某种方式将标签绑定到那个特定的圈子吗？

没有。

【讨论】：