是否可以使叠加层出现在地图控件下方？

Question

我有一张地图，上面有一系列叠加层，这些叠加层是根据显示信息的外部数据构建的。我想知道是否有一种方法可以设置叠加层，使其不会在地图控件之上绘制？

默认情况下，当位置恰好重叠时，它们会覆盖和隐藏控件。

Answer 1

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

要克服它，请在地图初始化期间禁用默认缩放控制，如下所示：

......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 文档 here

Answer 2

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

我的情况是 div 包含叠加数据的 z-index 样式迫使它高于控件。

是否可以使叠加层出现在地图控件下方？

Is it possibly to make overlays appear beneath the map controls?

openlayers-3