是否可能在地图控件下方显示叠加层？

Question

我有一张地图，其中包含一系列由外部数据显示信息构成的叠加层。我想知道是否有一种方法来设置叠加层，以便它不会在地图控件上绘制？

默认情况下，当位置碰巧重叠时，它们会覆盖并隐藏控件。

Answer 1

默认情况下，叠加层会在控件下方按预期显示。

在我的案例中发生的事情是包含覆盖数据的div已经收到了z-index样式，这种样式强制它高于控件。

Answer 2

它与控件添加到地图的方式有关。 放大和缩小按钮是默认的ol.control.Zoom，因此它是地图上添加的第一个控件。然后添加自定义控件，因此与缩放控件重叠。

要克服它，请在map init期间禁用默认缩放控件，如下所示：

......new ol.Map({
  controls: ol.control.defaults({
     zoom:false//here is the disable
    ........

然后添加自定义控件，然后在顶部添加缩放控件。 一起应该是：

var map = new ol.Map({
  controls: ol.control.defaults({
     zoom:false
  }).extend([
    new app.CustomControl(),
    new ol.control.Zoom()
  ]),
  layers: [
    new ol.layer.Tile({
      source: new ol.source.OSM()
    })
  ],
  target: 'map',
  view: new ol.View({
    center: [0, 0],
    zoom: 2,
    rotation: 1
  })
});

这是一个fiddle，可以看到它的实际效果

<强>更新

要处理叠加层，请在叠加初始化设置insertFirst:true期间，以便在控件下方显示叠加层。查看api doc here