koda-album

育児プログラマーの日々のざれごと

Windowsストアアプリで地図を使ってみました

Windowsストアアプリに地図を使いたくて、親和性が高いであろうということで Bing Mapsを採用してみました。メモを残しておきます。

準備1: Bing Maps Account Center

まずは、Bing Maps利用に必要なアカウントを作りましょう。 アカウント登録に必要な情報はメールアドレスくらいだったと思います。

Home - Bing Maps Account Center

登録後、利用予定のアプリ名を入力することで、利用キーを払いだします。

キーは、アプリ毎に払いだす必要があります。

準備2: Bing Maps SDK for Windows 8.1 Store apps

VisualStudioに Bing Maps SDKをインストールします。 これをインストールすると、Bing Mapsを使ったプロジェクトテンプレートが使えるようになります。

Bing Maps SDK for Windows 8.1 Store apps extension

試してみましょう

準備OKです。プロジェクトを作って動かしてみましょう。

Visual Studioで、新しいプロジェクトを作成します。選択するテンプレートは、Bing Maps Applicationです。

プロジェクト作成後、MainPage.xamlを開いて、INSERT_YOUR_BING_MAPS_KEYの部分に 先ほど払いだしたBingMapsの利用キーを入力します。 これでBingMapsが使えるようになります。

    <Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}">
        <bm:Map x:Name="map" Credentials="INSERT_YOUR_BING_MAPS_KEY">
        </bm:Map>
    </Grid>

次に、Package.appxmanifestを開いて、機能タブで「場所」にチェックを入れておきます。これで位置情報を使うことができます。

このままの状態で、デバッグ実行してみましょう。 プラットフォームは、x86x64を選んでください。

アプリケーション内にBingMapが組み込まれた状態でアプリ起動することが確認できたと思います。あとは、自分のコンセプトに従って必要なコーディングを行っていくだけです。

補足

説明上、Bing Maps Applicationテンプレートから作成する方法を記載しましたが、通常のテンプレートからプロジェクト作成して必要なコードを記載することでBingMapsを利用することもできます。

今回ご紹介したテンプレートを見て頂ければ、必要箇所が分かると思います。

参考にさせて頂いた記事、書籍

Amazon.co.jp: Windows8ストアアプリ開発入門: 大田 一希, 和田 健司: 本

「Windows 8 ストア アプリ開発 tips」 hokuriku.net vol.11 (2013年1月26日)