Maps for UWP
手順2:データソースへ連結する
クイックスタート > 手順2:データソースへ連結する
全て展開
すべて折りたたむ

この手順では、Name と LatLong の２つのプロパティを持つクラスを作成し、配列コレクションを使ってそれらのプロパティに値を入力します。また、C1VectorPlacemark を含む C1VectorLayer をコントロールに追加します。次に、Name プロパティを C1VectorPlacemark の Label プロパティに連結し、LatLong プロパティを C1VectorPlacemark の GeoPoint プロパティに連結します。

次の手順に従います。

  1. MainPage.xaml コードページ（MainPage.xaml.cs または MainPage.xaml.vb）を開きます。このページの拡張子は、プロジェクトに選択した言語によって異なります。
  2. 次のクラスをプロジェクト内の名前空間宣言の下に追加します。
    このクラスは、Name という名前の文字列プロパティおよび LongLat という名前の Point プロパティを含むクラスを作成します。

    Visual Basic コードの書き方

    Visual Basic
    コードのコピー 
    Public Class City
Private _LongLat As Point
    Public Property LongLat() As Point
        Get
            Return _LongLat
        End Get
        Set(ByVal value As Point)
            _LongLat = value
        End Set
    End Property
   
Private _Name As String
    Public Property Name() As String
        Get
            Return _Name
        End Get
        Set(ByVal value As String)
            _Name = value
        End Set
    End Property
   
    Public Sub New(ByVal location As Point, ByVal cityName As String)
        Me.LongLat = location
        Me.Name = cityName
    End Sub
End Class

    C# コードの書き方

    C#
    コードのコピー 
    public class City
   {
     public Point LongLat { get; set; }
     public string Name { get; set; }
     public City(Point location, string cityName)
        {
             this.LongLat = location;
             this.Name = cityName;
        }
   }
  3. 次のコードを InitializeComponent() メソッドの下に追加して、Name プロパティおよび LongLat プロパティに入力される配列コレクションを作成します。

    Visual Basic コードの書き方

    Visual Basic
    コードのコピー 
    Dim cities() As City =
New City() {
New City(New Point(-58.40, -34.36),  "Buenos Aires"),
New City(New Point(-47.92, -15.78), "Brasilia"),
New City(New Point(-70.39, -33.26), "Santiago"),
New City(New Point(-78.35, -0.15), "Quito"),
New City(New Point(-66.55, 10.30), "Caracas"),
New City(New Point(-77.03, -12.03), "Lima"),
New City(New Point(-57.40, -25.16), "Asuncion"),
New City(New Point(-74.05, 4.36), "Bogota"),
New City(New Point(-68.09, -16.30), "La Paz"),
New City(New Point(-58.10, 6.48), "Georgetown"),
New City(New Point(-55.10, 5.50), "Paramaribo"),
New City(New Point(-56.11, -34.53),"Montevideo")
}
maps.DataContext = cities

    C# コードの書き方

    C#
    コードのコピー 
    City[] cities = new City[]
{
   new City(){ LongLat= new Point(-58.40, -34.36), Name="Buenos Aires"},
   new City(){ LongLat= new Point(-47.92, -15.78), Name="Brasilia"},
   new City(){ LongLat= new Point(-70.39, -33.26), Name="Santiago"},
   new City(){ LongLat= new Point(-78.35, -0.15), Name="Quito"},
   new City(){ LongLat= new Point(-66.55, 10.30), Name="Caracas"},
   new City(){ LongLat= new Point(-56.11, -34.53), Name="Montevideo"},
   new City(){ LongLat= new Point(-77.03, -12.03), Name="Lima"},
   new City(){ LongLat= new Point(-57.40, -25.16), Name="Asuncion"},
   new City(){ LongLat= new Point(-74.05, 4.36), Name="Bogota"},
   new City(){ LongLat= new Point(-68.09, -16.30), Name="La Paz"},
   new City(){ LongLat= new Point(-58.10, 6.48), Name="Georgetown"},
   new City(){ LongLat= new Point(-55.10, 5.50), Name="Paramaribo"},
};
maps.DataContext = cities;
  4. XAML ビューに切り替えて、 <c1:C1Maps> タグと </c1:C1Maps> タグの間に次のような XAML マークアップを配置します。
    XAML マークアップ
    コードのコピー 
     <C1:C1Maps.Resources> 
 <!-- 項目テンプレート -->
     <DataTemplate x:Key="templPts">
      <C1:C1VectorPlacemark
        GeoPoint="{Binding Path=LongLat}" Fill="Aqua" Stroke="Aqua"
        Label="{Binding Path=Name}" LabelPosition="Top" >
       <C1:C1VectorPlacemark.Geometry>
          <EllipseGeometry RadiusX="2" RadiusY="2" />
        </C1:C1VectorPlacemark.Geometry>
      </C1:C1VectorPlacemark>
     </DataTemplate>
  </C1:C1Maps.Resources>
  <C1:C1VectorLayer ItemsSource="{Binding}"
ItemTemplate="{StaticResource templPts}" HorizontalAlignment="Right" Width="403" />

    この XAML は、データテンプレート、C1VectorPlacemark、および C1VectorLayer を作成します。C1VectorLayer のItemsSource プロパティがデータソース全体に連結されます。また、C1VectorPlacemark のGeoPoint プロパティは LongLat プロパティの値に連結され、Label プロパティは Name プロパティの値に設定されます。プロジェクトを実行すると、Label プロパティおよび Name プロパティにデータソースから値が入力されて、一連のラベル付きプレースマークがマップ上に作成されます。

この手順では、データソースを作成し、それを C1VectorPlacemark のプロパティに連結しました。次の手順では、プログラムを実行して、このクイックスタートガイドで作成したプロジェクトの結果を表示します。

 

 

Copyright © MESCIUS, Inc. All rights reserved.