如何在地图缩放时交换图层可见性？

Question

我认为这应该非常简单，或者有一些使用 Azure Maps 的示例...

因此，我在地图中添加了 3 个图层、2 个点和 1 个多边形。我希望点层最初处于打开状态，然后如果用户放大地图，则关闭点层并打开多边形。如果用户缩小多边形关闭并且点重新打开，这也会发生相反的情况。

我已经能够通过单击按钮关闭 1 点层并打开多边形，但是 1 点层是一个 htmlMarker，因此我可以将其脉冲以产生效果。

关于在另一层之后添加一层的文档也不起作用。如果我保持全部打开，多边形位于两个点层之上？

   htmlMarkerLayer = new atlas.layer.SymbolLayer(dataSource, null, {
     filter: ['any', ['==', ['geometry-type'], 'Point'], ['==', ['geometry-type'], 'MultiPoint']], // Only render Point or MultiPoint in this layer.
     name: 'htmlMarkerLayer'
   });
   map.layers.add(htmlMarkerLayer, 'poiPointLayer');

   poiPointLayer = new atlas.layer.SymbolLayer(dataSource, null, {
     filter: ['any', ['==', ['geometry-type'], 'Point'], ['==', ['geometry-type'], 'MultiPoint']], // Only render Point or MultiPoint in this layer.
     name: 'poiPointLayer'
   });
   map.layers.add(poiPointLayer, 'htmlMarkerLayer');

polygonLayer = new atlas.layer.PolygonLayer(dataSource, null, {
        filter: ['any', ['==', ['geometry-type'], 'Polygon'], ['==', ['geometry-type'], 'MultiPolygon']], // Only render Point or MultiPoint in this layer.
        name: 'facilityLayer',
        fillColor: 'gray',
        fillOpacity: 0.5
    });
    map.layers.add(polygonLayer, 'poiPointLayer');

// Does not work on htmlMarker layer with pulse?
      var opts = htmlMarkerLayer.getOptions();
      opts['visible'] = false;
      htmlMarkerLayer.setOptions(opts);

// Works
   opts = poiPointLayer .getOptions();
   opts['visible'] = false;
   poiPointLayer .setOptions(opts);

// Works
   opts = polygonLayer.getOptions();
   opts['visible'] = true;
   polygonLayer.setOptions(opts);

关于如何与地图进行缩放交互，有什么想法吗？如何关闭 htmlMarker 层？

Answer 1

所有图层都有 minZoom 和 maxZoom 选项。使用这些来指定你的限制，它会做你所要求的。此外，名称不是图层的选项。初始化函数时的第二个参数（代码中为 null）是您可以传入 ID 的地方。我在下面的代码中进行了此更改。

polygonLayer = new atlas.layer.PolygonLayer(dataSource, 'facilityLayer', {
    minZoom: 10,
    maxZoom: 24,    
    fillColor: 'gray',
    fillOpacity: 0.5,
    filter: ['any', ['==', ['geometry-type'], 'Polygon'], ['==', ['geometry-type'], 'MultiPolygon']], // Only render Point or MultiPoint in this layer.
});
map.layers.add(polygonLayer, 'poiPointLayer');

poiPointLayer = new atlas.layer.SymbolLayer(dataSource, 'poiPointLayer', {
    minZoom: 0,
    maxZoom: 10,
    filter: ['any', ['==', ['geometry-type'], 'Point'], ['==', ['geometry-type'], 'MultiPoint']], // Only render Point or MultiPoint in this layer.
});
map.layers.add(poiPointLayer, 'htmlMarkerLayer');

为清楚起见，以下是 minZoom/maxZoom 值的工作原理：

minZoom -> 出现在这个缩放级别。
maxZoom -> 在此级别消失（出现在 maxZoom - 1）

如何在地图缩放时交换图层可见性？

How can I swap layer visibilty on map zoom?

javascript

maps

zooming

azure-maps