使用`icon-allow-overlap`时,Mapbox标记闪烁>]

问题描述 投票:2回答:1

我有一张地图正在使用mapboxgl-js根据某些条件隐藏或显示地图标记。

隐藏标记正在按预期方式工作,但是当我希望标记再次显示时,它们会闪烁几毫秒,然后消失,而地图会在它们再次显示之前在基础层上隐藏标签(街道名称等)。

观看此视频:https://streamable.com/debcp

请参见此密码笔:https://codepen.io/jakobfuchs/details/VRRgJO

我得出的结论是这是由于在标记符号图层上设置'icon-allow-overlap': true引起的。

关于如何保持该设置并避免闪烁的任何建议?

奇怪的是,这种情况并非100%的时间发生,而是〜95%的时间。

代码示例:

标记层:

  map.addLayer({
    id: 'property-layer',
    type: 'symbol',
    source: 'properties',
    filter: ['!has', 'point_count'],
    layout: {
      'symbol-placement': 'point',
      'icon-image': 'marker',
      'icon-size': 1,
      'icon-anchor': 'bottom',
      'icon-allow-overlap': true,
    }
  });

过滤器代码:

  const filterToggle = document.getElementById('filterToggle');
  filterToggle.addEventListener('change', function(e) {
    if (openPopup) {
      openPopup.remove();
      openPopup = '';
    }
    let properties;
    if (this.checked) {
      properties = {
        type: "FeatureCollection",
        features: features.features.filter((property) => property.properties.availability === 'Available')
      }
    } else {
      properties = features;
    }
    map.getSource('properties').setData(properties);
  });

我有一张地图正在使用mapboxgl-js根据某些条件隐藏或显示地图标记。隐藏标记可以按预期工作,但是当我希望标记再次显示时,它们会闪烁一些...

javascript mapbox mapbox-gl-js mapbox-gl mapbox-marker
1个回答
0
投票

我也遇到过同样的问题,我的解决方案是使用icon-ignore-placement

© www.soinside.com 2019 - 2024. All rights reserved.