19日の Google and Bing Maps Hackathon in Japan に向けて、Bing Maps Silverlight Control を使用したアプリケーション作成に必要な環境の構築方法を紹介します。
開発環境の準備
まず Silverlight の開発環境です。無償で環境を用意する場合、次のツールをインストールします。
- Visual Web Developer 2010 Express
- Silverlight 4 Tools for Visual Studio 2010
Visual Web Developer 2010 Express は Download the Microsoft Web Platform (Web PI)に含まれているので、Web PI をインストールして、Visual Web Developer 2010 Express を選択してインストールします。
続いて、Silverlight 4 Tools for Visual Studio 2010 もインストールしましょう。
Bing Maps Silverlight Control SDK のインストール
地図コントロールを使用するために、Bing Maps Silverlight Control SDK もダウンロードし、インストールします。通常は、C:Program FilesBing Maps Silverlight Control 以下にインストールされます。
Bing Maps Key の取得
Bing Maps Silverlight Control を使用するため、Bing Maps Key を取得する必要があります。Bing Maps Account Center でユーザーを新規に登録します(Windows Live ID アカウントが必要です)。
アカウント登録後、左のメニュー「Create or view keys」から新しく Bing Maps Key を作成します。
必要な情報を登録後、Bing Maps Key が作成されます。この文字列が Bing Maps Silverlight Control 使用時に必要になります。
Silverlight プロジェクトの作成
Bing Maps Silverlight Control を使用した Silverlight アプリケーションを作成します。Silverlight のプロジェクトを作成するには、Visual Web Developer 2010 Express を起動して「新しいプロジェクト」をクリックします。新しいプロジェクトウィンドウのテンプレートから、Visual C# → Silverlight を選択、表示された項目の中から Silverlight アプリケーションを選択します(Visual C# のプロジェクトを作成する場合)。プロジェクトの名前を入力して、OK ボタンをクリックします。
次のようなウィンドウが表示されますが、このまま OK ボタンをクリックします。
Bing Maps Silverlight Control ライブラリーの参照
Bing Maps Silverlight Control を使用するには、インストールした SDK に含まれているライブラリーの参照を追加する必要があります。Visual Web Developer 2010 Express の「プロジェクト」メニューの「参照の追加」を選択(または、ソリューションエクスプローラーのプロジェクト名を右クリックして「参照の追加」を選択)します。
開いたウィンドウの「ファイル」タブから Bing Maps Silverlight Control のライブラリーを参照します。インストールフォルダー、Bing Maps Silverlight ControlV1Libraries の中にある Microsoft.Maps.MapControl.Common.dll と Microsoft.Maps.MapControl.dll を選択して OK ボタンをクリックします。
Map Control の表示
アプリケーションに地図コントロールを追加します。ソリューションエクスプローラ―から MainPage.xaml を選択(ダブルクリック)して、デザイナ画面を表示します。すでに最低限の XAML が記述されています。ここに下図のように2行追加します。
名前空間の宣言
xmlns:m="clr-namespace:Microsoft.Maps.MapControl;assembly=Microsoft.Maps.MapControl"
Map Control の追加
<m:Map CredentialsProvider="BingMapsKey" />
BingMapsKey の部分は、先ほど取得した Bing Maps Key の文字列に置き換えます。
F5キーを押して(またはメニューの「デバッグ」「デバッグの開始」を選択)、実行してみましょう。以上で、地図アプリケーションができました。