Bing Maps v8 - 在PushPin上調用點擊事件

一旦我加載與信息框的多個圖釘的Bing地圖。我已經添加單擊這裏在特定的圖釘索引HTML上錨定標籤顯示javascript單擊事件的信息框。不知何故，它不適合我。Bing Maps v8 - 在PushPin上調用點擊事件

我看到在V8

這裏所支持Invoke事件小提琴https://jsfiddle.net/pakpatel/9dc4oxfk/2/

var map, infobox; 
 
    map = new Microsoft.Maps.Map('#myMap', { 
 
    credentials: '' 
 
    }); 
 

 
    //Create an infobox at the center of the map but don't show it. 
 
    infobox = new Microsoft.Maps.Infobox(map.getCenter(), { 
 
    visible: false 
 
    }); 
 

 
    //Assign the infobox to a map instance. 
 
    infobox.setMap(map); 
 

 
    //Create random locations in the map bounds. 
 
    var randomLocations = Microsoft.Maps.TestDataGenerator.getLocations(5, map.getBounds()); 
 

 
    for (var i = 0; i < randomLocations.length; i++) { 
 
    var pin = new Microsoft.Maps.Pushpin(randomLocations[i]); 
 

 
    //Store some metadata with the pushpin. 
 
    pin.metadata = { 
 
     title: 'Pin ' + i, 
 
     description: 'Discription for pin' + i 
 
    }; 
 

 
    //Add a click event handler to the pushpin. 
 
    Microsoft.Maps.Events.addHandler(pin, 'click', pushpinClicked); 
 

 
    //Add pushpin to the map. 
 
    map.entities.push(pin); 
 
    } 
 

 

 
function pushpinClicked(e) { 
 
    //Make sure the infobox has metadata to display. 
 
    if (e.target.metadata) { 
 
    //Set the infobox options with the metadata of the pushpin. 
 
    infobox.setOptions({ 
 
     location: e.target.getLocation(), 
 
     title: e.target.metadata.title, 
 
     description: e.target.metadata.description, 
 
     visible: true 
 
    }); 
 
    } 
 
} 
 

 
function showInfoboxByKey(Key) { 
 

 
    //Look up the pushpin by gridKey. 
 
    var selectedPin = map.entities.get(gridKey); 
 
    //Show an infobox for the cluster or pushpin. 
 
    Microsoft.Maps.Events.invoke(selectedPin, "click"); 
 
}

<script type='text/javascript' 
 
     src='http://www.bing.com/api/maps/mapcontrol?callback=GetMap' 
 
     async defer></script> 
 
<div id="myMap" style="position:relative;width:600px;height:400px;"></div> 
 
<a href='javascript:void(0);' onclick='showInfoboxByKey(3);'> Click Here </a>

來源

2017-06-07 dev

的問題是你有沒有在任何情況下參數傳遞當你調用該事件。因爲這樣的事件處理程序不會超過你的if語句，因此不會做任何事情。看到這裏的文檔，你會發現你需要提供事件參數：https://msdn.microsoft.com/en-us/library/mt750279.aspx

這就是說，我不是在你的應用程序在這裏採取的方法的粉絲。如果你只是想獲得這個工作快速容易，這種替換的代碼你調用行：

pushpinClicked({e:{target: selectedPin }});

我強烈建議將您的圖釘層，並添加點擊事件的層。這大大降低了事件系統的複雜性，並且性能誇張。

來源

2017-06-09 06:43:21 rbrundritt

感謝您的回答。我已經更新了我的代碼，按照您的建議使用。這裏是小提琴https://jsfiddle.net/pakpatel/9dc4oxfk/4/ – dev

我問過另一個問題，如果你知道答案？https：//stackoverflow.com/questions/44461347/bing-maps-v8-svg -inline - 圖釘 - 不觸發正確，信息框 – dev

Bing Maps v8 - 在PushPin上調用點擊事件

回答

相關問題