Virtual Earth
Virtual Earthはオンラインの地図サービスを提供するプラットフォームです。これによりユーザへ住所や店名による検索,
開発者向けにはVirtual Earth Map Control SDKというAPI群が提供されており,
開発環境
Virtual Earth Map ControlはJavaScriptのライブラリとして提供されています。そのためメモ帳さえあればコードの記述は可能です。ですが,
JScriptのインテリセンス機能はJscriptのコードをある程度理解してくれますが,
Virtual Earth JavaScript Intellisense HelperのReleasesページよりダウンロードできます。ダウンロードしたファイル内のVEJSフォルダ以下のファイルが使用するjsファイル群になります。インテリセンス機能のみに使用するファイルですので,
/// <reference path="VEJS/VeJavaScriptIntellisenseHelper.js" />
ダウンロードしたファイルにあるDefault.
マップの表示
まずは基本となるマップの表示からです。HTMLファイルを作成し,
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
次にheadタグ内に使用する文字セットを指定します。Virtual EarthではUTF-8を使用する必要があります。また,
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="http://dev.virtualearth.net/mapcontrol/mapcontrol.ashx?v=6&mkt=ja-jp"></script>
マップを表示するためのdivタグをbodyタグ内に追加します。正しく表示するためにはstyle属性のpositionを
<div id='myMap' style="position:absolute; width:400px; height:400px;"></div>
マップを表示するにはVEMapクラスのインスタンスを生成しLoadMapメソッドを呼びます。以下のように関数を作り,
var map = null;
function pageLoaded() {
map = new VEMap("myMap");
map.LoadMap();
}
<body onload="pageLoaded();">
作成したHTMLファイルを開いてみましょう。図2のようにマップが表示されると思います。
- ※1
- 執筆時点のMap Control SDKのバージョンは6.
0です。また利用規約を確認してください。 - ※2
- 詳しくはJScript IntelliSenseの概要を参照してください。