5

Openlayers 3 中有没有办法获取附加到特定 html 元素的地图？

就像是： 

var map = new ol.Map({
  view: new ol.View({
    center: [0, 0],
    zoom: 1
  }),
  layers: [
    new ol.layer.Tile({
      source: new ol.source.MapQuest({layer: 'osm'})
    })
  ],
  target: 'map'
});

//Later on, in a different file
var myMap = $("#map").ol.Map()
4

2 回答 2

7

地图对象具有对 HTML 元素的引用，但 HTML 元素没有对地图对象的引用。HTML 元素根本不知道地图对象。

如果您使用 jQuery，您可以使用data 方法在 jQuery 对象中存储对地图的引用。例如：

var map = new ol.Map({
  target: 'map', 
  //... 
});
$('#map').data('map', map);

然后，从元素中获取对地图的引用：

var map = $('#map').data('map');
于 2015-04-28T19:15:24.307 回答
3

为清楚起见，这是另一个示例，演示了 erilem 的答案，其中包含未命名为“map”的 map var 和 map div。

mapElement = '#mapDiv'
mymap = new ol.Map({        
  target: mapDiv,
  view: new ol.View({
     ...
  })
});
$(mapElement).data('map', mymap);

然后，您可以使用带有 data 方法的数据使用 jquery 引用该地图。就我而言，然后我想使用 ol updateSize() 来更新 mymap。

thisMap = $(mapElement).data('map')
thisMap.updateSize();

当我在一页上有多个地图时，这很有用。我在哪里使用：

mapDiv = id +'-map'      
mapElement = '#' + mapDiv
maps[i] = new ol.Map({        
    target: mapDiv,
    view: new ol.View({
        ...
    })
});
$(mapElement).data('map', maps[i])

接着：

thisMapId = activeDataset + '-map'
thisMapElement = '#' + thisMapId
thisMap = $(thisMapElement).data('map')
thisMap.updateSize()

其中 id = activeDataset

于 2017-07-16T03:04:19.693 回答