使ってみよう! Bing API/SDK

第1回 Hello, Bing Map App!──Silverlightで作るBing Mapsアプリケーション(1)

この記事を読むのに必要な時間:およそ 6.5 分

レイヤーの追加

Map Appで何かしらの情報を表示するためには,プラグインにレイヤーを追加する必要があります。レイヤーはLayerクラスで表します。そして,レイヤーを追加や表示などの管理を行うContract,LayerManagerContractを参照します。

Layerクラスは,abstractクラスのため継承したクラスを作成します。ここではMainLayer.csという名前のクラスファイルを新しくプロジェクトに追加し,下記のようにコードを記述します。

namespace HelloWorldBingMapApp
{
    using Microsoft.Maps.Core;
    using Microsoft.Maps.Plugins;

    public class MainLayer : Layer
    {
        public MainLayer(PluginToken pluginToken) : base(pluginToken)
        {
        }
    }
}

今回はレイヤーで何も処理しないため,これだけです。

HelloWorldPluginクラスに戻り,Activateメソッドを変更します。ActivateメソッドはMap Appが起動されたときなどMap Appのレイヤーを表示すべきタイミングに呼ばれます。

このメソッド内でプラグインに既にレイヤーが追加されていればレイヤーを表示,そうでなければレイヤーをプラグインに追加するように処理を記述しましょう。コードは次のようになります。

private MainLayer mainLayer;

[ImportSingle("Microsoft/LayerManagerContract", ImportLoadPolicy.Synchronous)]
public LayerManagerContract LayerManagerContract { get; set; }

public override void Activate(System.Collections.Generic.IDictionary<string, string> activationParameters)
{
    if (LayerManagerContract.ContainsLayer(this.mainLayer))
    {
        LayerManagerContract.BringToFront(this.mainLayer);
    }
    else
    {
        LayerManagerContract.AddLayer(this.mainLayer);
    }
}

上記コードでは,MainLayerクラスをprivateフィールドとして定義,ContractのImportもしています。フィールドのmainLayerのインスタンス化は,次のInitializeメソッド内で処理することにしましょう。

プッシュピンの追加

続いてレイヤーの中にプッシュピンを追加してみましょう。今回作成するMap Appではユーザーが表示している地図上にひとつのプッシュピンを表示します。また,プッシュピンをクリックしたときにメッセージを表示するようにします。

表示されている地図の操作,プッシュピンの作成,プッシュピンクリック時に表示するポップアップ,それぞれContractがあります。各プロパティを宣言します。

[ImportSingle("Microsoft/MapContract", ImportLoadPolicy.Synchronous)]
public MapContract DefaultMap { get; set; }

[ImportSingle("Microsoft/PushpinFactoryContract", ImportLoadPolicy.Synchronous)]
public PushpinFactoryContract PushpinFactoryContract { get; set; }

[ImportSingle("Microsoft/PopupContract", ImportLoadPolicy.Synchronous)]
public PopupContract PopupContract { get; set; }

プッシュピンを作成するには,まずPushpinFactoryContractCreateStandardPushpinメソッドを使います。メソッドの引数に経緯度を渡すと,その地点を指し示すプッシュピンが戻り値になります。経緯度は表示している地図の中心を今回は指定します。ここでMapContractCenterプロパティを使います。そして,レイヤーにプッシュピン エンティティを追加します。

Initializeメソッドの内容を変更したコードを示します。先ほどのレイヤーのインスタンス生成もここで行います。

public override void Initialize()
{
    base.Initialize();
    this.mainLayer = new MainLayer(this.Token);

    var pin = PushpinFactoryContract.CreateStandardPushpin(this.DefaultMap.Center);
    var entity = new Entity(pin);

    this.mainLayer.Entities.Add(entity);
}

CreateStandardPushpinメソッドによる戻り値はレイヤーに直接追加できる型でありません。そのためEntityオブジェクトを生成しPrimitiveプロパティに値を設定しています。エンティティは地図上に表示するアイテムで,Primitiveはエンティティの地理的な位置や形状を定義したものです。

最後にプッシュピンクリック時の処理です。PopupContractRegisterメソッドを用いて次のように記述できます。Initializeメソッド内のレイヤーに追加する前に追記します。

PopupContract.Register(
    entity,
    (PopupStateChangeContext context) =>
    {
        context.Title = "こんにちは!";
        if (context.State == PopupState.Normal)
        {
            context.Content = pin.Location.ToString();
        }
    });

ポップアップを表示するエンティティとポップアップの状態が変更されたときの処理を指定しています。

著者プロフィール

松江祐輔(まつえゆうすけ)

日本システムウエア株式会社 勤務。現在,ハードウェア設計・検証業務を担当。大学生・大学院生時代はベンチャー企業 有限会社ミレニアムシステムズにプログラマーとして従事。趣味はプログラミング。好きな言語はVisual Basic。Microsoft MVP for Windows Live Platform(Jul 2010 - Jun 2011),Windows Live(Jul 2011 - Jun 2013)。

URL:http://katamari.jp