The Virtual Earth Interactive SDKとVirtual Earth Map Control 5.0の紹介


現在取り組んでいるSilverlightのプロジェクトでVirtual Earthとの連携を組み込もうと考えて、資料を探していたところ、なんとも便利なサイトがあることに気がついて、やりたいことはあっという間に片付いてしまいました。



Virtual Earth Interactive SDK
http://dev.live.com/virtualearth/sdk/


 このサイトを見ると、Virtual Earthを使ったWebアプリケーションを作る上での基礎的なことが実際の動きとコード、詳細なリファレンスとともに確認できます。英語のドキュメントですが、コードは簡単なので、すぐに学べると思います。


たとえば、マイクロソフト株式会社の本社近くの地図は、次のようなHTMLとJavaScriptで表示できます。


<!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 src="http://dev.virtualearth.net/mapcontrol/mapcontrol.ashx?v=5"></script>
      <script>
         var map = null;
        
         function GetMap()
         {
            map = new VEMap('myMap');
            map.LoadMap(new VELatLong(35.68658, 139.700827), 15 ,'h' ,true);
         }  
      </script>
   </head>
   <body onload="GetMap();">
      <div id='myMap' style="position:relative; width:640px; height:480px;"></div>
   </body>
</html>


地図を表示するためのコントロールは、Virtual Earth Map Controlとよばれ、現在バージョン5.0が提供されています。


コントロールを利用するために、HTML文書に下記の内容を加えれば、準備が整います。


      <script src="http://dev.virtualearth.net/mapcontrol/mapcontrol.ashx?v=5"></script>


このコントロールに関するドキュメントは、すでに日本語化されており、下記のURLからご覧いただけます。



http://msdn2.microsoft.com/ja-jp/library/bb429619.aspx


上述のHTMLを実行すると動かせない地図が表示されますが、それは、 下記のLoadMapメソッド呼び出しの最後のパラメータで指定しています。




map.LoadMap(new VELatLong(35.68658, 139.700827), 15 ,'h' ,true);


VELatLongクラスは、緯度(Latitude)と経度(Longitude)をひとまとめにするためのものです。この指定で表示位置を変えられます。
上記のHTMLには記載していませんが、PanToLatLong()メソッドSetCenterAndZoom()メソッドなどを利用することで、何らかのイベントに応じて、地図の表示を変えられます。


皆さんもお試しください。

Skip to main content