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地图中信息框的多个图钉

回答

相关问题