如何在任何HTML頁面中顯示bing地圖？

Bing有一些他們稱之爲「AJAX控件」，可以動態地將生成的地圖嵌入到任何網頁中。有an online interactive demo for the control。如何在任何HTML頁面中顯示bing地圖？

如何使用此控件？

來源

2011-08-17 Cheeso

您的意思是「我如何在任何html頁面顯示bing *地圖？」？ –

http://msdn.microsoft.com/en-us/library/gg427610.aspx –

@nadir，是的，我有。排字錯誤 – Cheeso

請參閱the demonstration。

enter image description here

有可在
http://ecn.dev.virtualearth.net/mapcontrol/mapcontrol.ashx?v=7.0

一個JavaScript類庫，你需要把它列入到您的網頁是這樣的：

<script type="text/javascript" 
      src="http://ecn.dev.virtualearth.net/mapcontrol/mapcontrol.ashx?v=7.0"></script>

再從這樣的JavaScript中調用它：

var map = new Microsoft.Maps.Map(document.getElementById('SDKmap'), 
           {credentials: 'Your Bing Maps Key'});

要獲取bing地圖密鑰，請轉至this page。

您需要與ID的DIV在你的HTML頁面，它應該具有一定尺寸和樣式的位置是：相對：

<div id="SDKmap" style="position:relative; height:400px; width:400px">

然後，您可以添加信息框和圖釘到該地圖。

我還內置一個JavaScript幫手，可以提取自定義屬性形成的div元素，並生成地圖給你，完整的圖釘和InfoBoxes到。像這樣：

<div id='map3' 
     class='map' 
     data-mapdata='center: 42.3 -78.0; zoom:7;pushpin:42.323 -78.80; pushpin:42.93 -77.189; pushpin: 41.13 -78.389'></div>

然後的JavaScript：

 bingMap.displayMap("map3");

包含輔助類的JS模塊是最的jsfiddle鏈接。

來源

2011-08-18 00:01:35 Cheeso

您提到的鏈接本身有一個查看HTML按鈕，您可以點擊它並抓取代碼以顯示在任何網頁上。像下面一樣（我從你的鏈接中獲得）：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html> 
    <head> 
     <title>Map with valid credentials</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=7.0"></script> 
     <script type="text/javascript"> 
     var map = null; 

     function getMap() 
     { 
      map = new Microsoft.Maps.Map(document.getElementById('myMap'), {credentials: 'Your Bing Maps Key'}); 
     } 
     </script> 
    </head> 
    <body onload="getMap();"> 
     <div id='myMap' style="position:relative; width:400px; height:400px;"></div> 
    </body> 
</html>

來源

2011-08-18 00:03:10 Zubair1

有很多JavaScript？看看有充足文件的http://www.bingmapsportal.com/網站。

還有很多其他方法可以在網站中嵌入動態地圖 - 請參閱GIS.stackexchange.com的comparison of JavaScript mapping libraries。如果您有更具體的問題，我們很樂意在GIS.se幫助。

來源

2011-08-18 00:04:55 Patrick

如何在任何HTML頁面中顯示bing地圖？

回答

相關問題