OpenLayers (OSM) 中触发功能弹出窗口的正确方法是什么？

Question

我有功能 ID，我可以抓取 GeoRSS 负载端上的标记层，但我仍然不确定如何使弹出窗口以编程方式出现。

如果有必要，我将根据需要创建弹出窗口，但似乎我应该能够获取地图上绘制的标记的 id 并调用一些事件。我尝试使用 jQuery 并在地图元素上调用 $(marker-id).click() 事件，但这似乎不起作用。我缺少什么？

由于我被要求提供代码，而且我认为它是样板文件，所以到目前为止我的情况如下：

map = new OpenLayers.Map('myMap'); 
map.addLayer(new OpenLayers.Layer.OSM()); 
map.addLayer(new OpenLayers.Layer.GeoRSS(name,url));

//I've done some stuff as well in re: projections and centering and 
//setting extents, but those really don't pertain to this question.

在其他地方，我做了一些 jQuery 模板，并为我构建了地图上显示的所有点的漂亮列表。我知道如何从图层 loadend 执行回调并获取图层对象，我知道如何手动从地图中检索图层，我知道如何迭代图层集合并找到我的图层。因此，我可以获取有关弹出窗口的任何详细信息，但我仍然不知道如何使用 DOM 或此 API 的内置方法来使其像 element.click() 一样简单 这是我更愿意做的。

Answer 1

您不必单击该功能即可打开弹出窗口。

首先，您需要从功能 ID 中引用该功能。我将在 GeoRSS 图层的 loadend 事件中使用图层上的 markers 属性来执行此操作。

假设您引用了您的功能，我会编写一个处理自动弹出窗口的方法：

var popups = {}; // to be able to handle them later 

function addPopup(feature) {

var text = getHtmlContent(feature); // handle the content in a separate function.

var popupId = evt.xy.x + "," + evt.xy.y; 
var popup = popups[popupId];
if (!popup || !popup.map) {
    popup = new OpenLayers.Popup.Anchored(
        popupId,
        feature.lonlat,
        null,
        " ",
        null,
        true,
        function(evt) {
            delete popups[this.id];
            this.hide();
            OpenLayers.Event.stop(evt);
        }
    );
    popup.autoSize = true;
    popup.useInlineStyles = false;
    popups[popupId] = popup;
    feature.layer.map.addPopup(popup, true);
}
popup.setContentHTML(popup.contentHTML + text);
popup.show();

}

Answer 2

fwiw我终于回到了这个并做了一些完全不同的事情，但他的答案是一个很好的答案。

//I have a list of boxes that contain the information on the map (think google maps)
$('.paginatedItem').live('mouseenter', onFeatureSelected).live('mouseleave',onFeatureUnselected);

function onFeatureSelected(event) {
    // I stuff the lookup attribute (I'm lazy) into a global
    // a global, because there can be only one
    hoveredItem = $(this).attr('lookup');

    /* Do something here to indicate the onhover */
    // find the layer pagination id
    var feature = findFeatureById(hoveredItem);

    if (feature) {

        // use the pagination id to find the event, and then trigger the click for that event to show the popup
        // also, pass a null event, since we don't necessarily have one. 
        feature.marker.events.listeners.click[0].func.call(feature, event)
    }
}
function onFeatureUnselected(event) {
    /* Do something here to indicate the onhover */
    // find the layer pagination id
    var feature = findFeatureById(hoveredItem);

    if (feature) {

        // use the pagination id to find the event, and then trigger the click for that event to show the popup
        // also, pass a null event, since we don't necessarily have one. 
        feature.marker.events.listeners.click[0].func.call(feature, event)
    }

    /* Do something here to stop the indication of the onhover */

    hoveredItem = null;
}

function findFeatureById(featureId) {
    for (var key in map.layers) {
        var layer = map.layers[key];
        if (layer.hasOwnProperty('features')) {
            for (var key1 in layer.features) {
                var feature = layer.features[key1];
                if (feature.hasOwnProperty('id') && feature.id == featureId) {
                    return feature;
                }
            }
        }
    }
    return null;
}

另请注意，我将 map 保留为全局变量，这样我就不必每次想使用它时都重新获取它