Bing地图 - 如何从地图外的链接链接到推针

时间：2023-02-05 20:16:38

I have a Virtual Earth Maps (Bing Maps??) to which I have added a set of pushpins. Each pushpin is labelled 1 to n. In addition to adding pushpins to the map, I also add text to the web-page that contains the description to each pushpin.

我有一个虚拟地球地图(Bing Maps ??),我添加了一组图钉。每个图钉标记为1到n。除了向地图添加图钉外,我还在包含每个图钉描述的网页上添加文本。

I would like to add a link to the text outside the map, that when clicked will open the balloon associated with the corresponding pushpin.

我想添加一个指向地图外部文本的链接,单击此按钮将打开与相应图钉关联的气球。

How do I open the balloon associated with a pushpin, through a link that exists outside the map?

如何通过地图外部的链接打开与图钉关联的气球?

To get a better understanding, look at my map: link. When you click load, PushPins are added to the map. I would like to have a link from the list on the right of the map, that opens the corresponding PushPin.

为了更好地理解,请查看我的地图:链接。单击“加载”后,PushPins将添加到地图中。我想从地图右侧的列表中获得一个链接,打开相应的PushPin。

Thanks in advance!

提前致谢!

2 个解决方案

#1

Here's a simple example of adding some shapes to a Map using Bing Maps and showing the "Title" of each Shape in a list next to the Map. Then when the user hovers over each item in the list, it will open the InfoBox for that Shape on the Map.

这是一个使用Bing地图向Map添加一些形状并在Map旁边的列表中显示每个Shape的“Title”的简单示例。然后,当用户将鼠标悬停在列表中的每个项目上时,它将在地图上打开该Shape的InfoBox。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
   <head>
      <title></title>
      <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
      <script type="text/javascript" src="http://ecn.dev.virtualearth.net/mapcontrol/mapcontrol.ashx?v=6.2"></script>
      <style type="text/css">
        #ShapeList div
        {
            padding: 4px;
            border: solid 1px black;
        }
      </style>
      <script type="text/javascript">
      var map = null;

      function GetMap()
      {
         map = new VEMap('myMap');
         map.LoadMap();

         // Add some Shapes to the Map with item in list next to map
         var latlong = map.GetCenter();
         AddShape("Test Pushpin", latlong);
         AddShape("Another Pushpin", new VELatLong(latlong.Latitude + 2, latlong.Longitude));
         AddShape("Still Another Pushpin", new VELatLong(latlong.Latitude - 2, latlong.Longitude));
     }

     function AddShape(title, latlong) {
         // Create Pushpin Shape
         var s = new VEShape(VEShapeType.Pushpin, latlong);
         s.SetTitle(title);

         // Add Shape to Map
         map.AddShape(s);

         // Display Item in List Next to Map
         var elem = document.createElement("div");
         elem.innerHTML = title;
         document.getElementById("ShapeList").appendChild(elem);

         var shapeID = s.GetID();
         elem.attachEvent("onmouseover", function() { ShowInfoBoxByShapeID(shapeID); });
         elem.attachEvent("onmouseout", function() { map.HideInfoBox(); });
     }

     function ShowInfoBoxByShapeID(shapeID) {
         var shape = map.GetShapeByID(shapeID);
         map.ShowInfoBox(shape);
     }

      </script>
   </head>
   <body onload="GetMap();">
      <div id="ShapeList" style="float: left">
      </div>
      <div id='myMap' style="position:relative; width:400px; height:400px;"></div>
   </body>
</html>

#2

How about displaying informaion in popup using Silverlight bing maps ?

如何使用Silverlight bing贴图在弹出窗口中显示信息?

#1

Here's a simple example of adding some shapes to a Map using Bing Maps and showing the "Title" of each Shape in a list next to the Map. Then when the user hovers over each item in the list, it will open the InfoBox for that Shape on the Map.

这是一个使用Bing地图向Map添加一些形状并在Map旁边的列表中显示每个Shape的“Title”的简单示例。然后,当用户将鼠标悬停在列表中的每个项目上时,它将在地图上打开该Shape的InfoBox。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
   <head>
      <title></title>
      <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
      <script type="text/javascript" src="http://ecn.dev.virtualearth.net/mapcontrol/mapcontrol.ashx?v=6.2"></script>
      <style type="text/css">
        #ShapeList div
        {
            padding: 4px;
            border: solid 1px black;
        }
      </style>
      <script type="text/javascript">
      var map = null;

      function GetMap()
      {
         map = new VEMap('myMap');
         map.LoadMap();

         // Add some Shapes to the Map with item in list next to map
         var latlong = map.GetCenter();
         AddShape("Test Pushpin", latlong);
         AddShape("Another Pushpin", new VELatLong(latlong.Latitude + 2, latlong.Longitude));
         AddShape("Still Another Pushpin", new VELatLong(latlong.Latitude - 2, latlong.Longitude));
     }

     function AddShape(title, latlong) {
         // Create Pushpin Shape
         var s = new VEShape(VEShapeType.Pushpin, latlong);
         s.SetTitle(title);

         // Add Shape to Map
         map.AddShape(s);

         // Display Item in List Next to Map
         var elem = document.createElement("div");
         elem.innerHTML = title;
         document.getElementById("ShapeList").appendChild(elem);

         var shapeID = s.GetID();
         elem.attachEvent("onmouseover", function() { ShowInfoBoxByShapeID(shapeID); });
         elem.attachEvent("onmouseout", function() { map.HideInfoBox(); });
     }

     function ShowInfoBoxByShapeID(shapeID) {
         var shape = map.GetShapeByID(shapeID);
         map.ShowInfoBox(shape);
     }

      </script>
   </head>
   <body onload="GetMap();">
      <div id="ShapeList" style="float: left">
      </div>
      <div id='myMap' style="position:relative; width:400px; height:400px;"></div>
   </body>
</html>

#2

How about displaying informaion in popup using Silverlight bing maps ?

如何使用Silverlight bing贴图在弹出窗口中显示信息?

标签：

相关文章