在 Bing 地图中触发点击事件

Question

Bing 地图上的点击事件有点麻烦。 我有很多商店，我可以毫无问题地放置所有 pin 和 click 事件（打开信息框）

var STORES = [
    {
        id: 123,
        lat: 1.23456789,
        lng: -1.23456789,
        name: 'AEVA'
    },
    ...
]

for (var i = 0; i < STORES.length; i++) {
    var pinOptions: {icon: 'map-pin.png?id'+STORES[i].id, width: 29, height: 52},
        LatLng = new Microsoft.Maps.Location(STORES[i].lat, STORES[i].lng),
        pin = new Microsoft.Maps.Pushpin(LatLng, pinOptions);

    pin.content = '<p>'+STORES[i].name+'</p>';

    Microsoft.Maps.Events.addHandler(pin, 'click', displayInfobox);

    bing.pinLayer.push(pin);
}

现在的问题是，当用户通过搜索页面到达该页面时，基本上会添加一个带有 id 的标签，例如 /stores#id123

我希望地图自动打开带有该 ID 的框，所以我添加了此代码

var hash = window.location.hash;
hash = hash.replace("#", "");
if(hash.length>0){
    var pin = $('img[src*="?'+hash+'"]').parent();
    pin.trigger('click');
}

但它只是行不通。我也试过了

Microsoft.Maps.Events.invoke(a, 'click');

但是什么都没发生，有没有人有什么解决方法，触发点击事件？

谢谢

Answer 1

Microsoft.Maps.Events.invoke 函数需要 实体对象 而不是 Html 元素。实体可以是以下任何一种类型：Infobox、Polygon、Polyline、Pushpin、TileLayer 或 EntityCollection。

话虽如此，您可以考虑以下方法来查找Pushpin：

function findPin(map,storeId)
{
    for(var i = 0; i < map.entities.getLength();i++){
        var entity = map.entities.get(i);
        if(entity.getIcon === undefined) continue;
        var icon = entity.getIcon();  
        if(entity.getIcon() === "map-pin.png?id" + storeId) return entity;
    }
    return null;
}

用法

var storeId = window.location.hash.replace("#id", "");
if(storeId.length > 0){
    var selectedPin = findPin(bing,storeId);
    Microsoft.Maps.Events.invoke(selectedPin, 'click');
}

在哪里

function displayInfobox(e) {
    infobox.setLocation(this.target.getLocation());
    infobox.setOptions({ visible: true });
}