Bing地圖中信息框的多個圖釘

我正在嘗試添加多個圖釘與單獨的信息框。這意味着每個圖釘將擁有自己的信息框和自己的信息。有一個loop.inside是Bing地圖中信息框的多個圖釘

latlng = new Microsoft.Maps.Location(latitude[pointerCount], longtitue[pointerCount]); 
MarkingLocation[pointerCount] = new Microsoft.Maps.Pushpin(latlng, {icon:"marker2.ico", height:50, width:50, anchor:new Microsoft.Maps.Point(0,50)}); 

myInfobox = new Microsoft.Maps.Infobox(latlng, myinfoboxOption); 

Microsoft.Maps.Events.addHandler(MarkingLocation[pointerCount], 'click', function() {myInfobox.setOptions({ visible:true });});   
map.entities.push(MarkingLocation[pointerCount]); 
map.entities.push(myInfobox);

問題是，它僅顯示爲每個圖釘的最後一個信息框。假設我在法國，德國，美國的Londom有4個圖釘。現在無論我點擊了哪個針，它只是顯示美國信息框在美國圖釘。請問任何人都可以幫助，我已經失蹤.........

還有一件事，可以任何人都應該展示如何在信息框中使用htmlContent。我試着將它設置thrugh選項，但它不是迴環......

myinfoboxoption = {width:300, 
           height: 100, 
           title: str_loc, 
           htmlContent: htmlc, 
           showPointer: false, 

           offset: new Microsoft.Maps.Point(-100,0)};

請幫助........

來源

2011-10-05 AtanuCSE

我這是怎麼實現的多個信息框：

<html> 
<head> 
<script charset="UTF-8" type="text/javascript" src="http://ecn.dev.virtualearth.net/mapcontrol/mapcontrol.ashx?v=7.0"></script> 
<script> 
    var pinInfoBox; //the pop up info box 
    var infoboxLayer = new Microsoft.Maps.EntityCollection(); 
    var pinLayer = new Microsoft.Maps.EntityCollection(); 
    var apiKey = "YourKey"; 

    function GetMap() { 

     map = new Microsoft.Maps.Map(document.getElementById("map"), {credentials: apiKey}); 

     // Create the info box for the pushpin 
     pinInfobox = new Microsoft.Maps.Infobox(new Microsoft.Maps.Location(0, 0), { visible: false }); 
     infoboxLayer.push(pinInfobox); 


     for (var i = 0 ; i < 10; i++){ 
      //add pushpins 
      var latLon = new Microsoft.Maps.Location(Math.random()*180-90, Math.random()*360-180); 
      var pin = new Microsoft.Maps.Pushpin(latLon); 
      pin.Title = name;//usually title of the infobox 
      pin.Description = "blahblahblah, "+ i; //information you want to display in the infobox 
      pinLayer.push(pin); //add pushpin to pinLayer 
      Microsoft.Maps.Events.addHandler(pin, 'click', displayInfobox); 
     } 

     map.entities.push(pinLayer); 
     map.entities.push(infoboxLayer); 

    } 

    function displayInfobox(e) { 
     pinInfobox.setOptions({title: e.target.Title, description: e.target.Description, visible:true, offset: new Microsoft.Maps.Point(0,25)}); 
     pinInfobox.setLocation(e.target.getLocation()); 
    } 

    function hideInfobox(e) { 
     pinInfobox.setOptions({ visible: false }); 
    } 
</script> 

<style> 
    #map { position: absolute; top: 20; left: 10; width: 700px; height: 500px; border:#555555 2px solid;} 
</style> 
</head> 
<body onload="GetMap()"> 
    <div id="map"> 
    </div> 
</body>

最後，你會得到這樣的事情： enter image description here

來源

2011-10-25 20:53:36 YoYoMyo

糾錯： pin.Title =「TITLE：」+ i; //通常信息框的標題

來源

2014-07-02 21:06:30

Bing地圖中信息框的多個圖釘

回答

相關問題