openlayers - 如何独立于缩放级别移动弹出位置？

Question

假设您有一个带有标记的图层和一个事件侦听器，在鼠标悬停时会显示一个弹出窗口，例如

var hints = new OpenLayers.Control.SelectFeature(wplayer, {
  hover: true,
  eventListeners: {
    featurehighlighted: function(event) {
      var feature = event.feature;
      popup = new OpenLayers.Popup(null,
        feature.geometry.getBounds().getCenterLonLat().add(3000, 3000),
        new OpenLayers.Size(200,10),
        feature.attributes.name, false, null);
      ...

到目前为止，这很有效-并且add(3000, 3000)可以很好地转移位置。但我想独立于当前缩放级别将其移动相同数量的像素。这样实际标记不会被弹出窗口阻止。

这意味着我必须将 (+15px, +15px) 之类的平移转换为当前显示的 openlayers 坐标系。在伪代码中：

feature.geometry.getBounds().getCenterLonLat().add(Pixels(15,15).toMap())

任何想法如何使用 openlayers 方法完成此操作？

Answer 1

有：

• getViewPortPxFromLonLat()
• getLonLatFromViewPortPx()

使用这些函数，可以像这样计算翻译：

var ll = feature.geometry.getBounds().getCenterLonLat();
var px = map.getViewPortPxFromLonLat(ll, 72);
px = px.add(15, -15);
ll = map.getLonLatFromViewPortPx(px);
...
popup = new OpenLayers.Popup(null, ll, ...);

可能还有一种查询当前视口/屏幕分辨率的方法（上面我只用72）。