C1Mapsコンポーネントの配置
ツールボックスからC1MapsコンポーネントをWPFウィンドウ上にドラッグ&ドロップします。これだけで必要な参照設定とライセンスファイルのプロジェクトファイルへの追加が行われます。
画面デザイン
サンプル画面の構成は、左に地図、右に一覧表の2カラム構成になっていて、検索ボタンをクリックすると特定市区町村のAED情報を検索表示します。
: (中略) : <Grid Grid.Row="1" Margin="15,0,0,0"> <Grid.ColumnDefinitions> <ColumnDefinition Width="Auto" /> <ColumnDefinition Width="*" /> </Grid.ColumnDefinitions> <StackPanel Grid.Column="0" Margin="20,0,20,0"> <Custom:C1Maps x:Name="C1Maps1" VerticalAlignment="Top" HorizontalAlignment="Left" Zoom="13" Width="480" Height="600"> <Custom:C1Maps.Resources> <DataTemplate x:Key="PinStyle"> …(2)' <Custom:C1VectorPlacemark Fill="Red" Stroke="Red" LabelPosition="Top" Foreground="Red" GeoPoint="{Binding LatLng}"> …(3) <Custom:C1VectorPlacemark.Geometry> …(4) <EllipseGeometry RadiusX="2" RadiusY="2" /> </Custom:C1VectorPlacemark.Geometry> </Custom:C1VectorPlacemark> </DataTemplate> </Custom:C1Maps.Resources> <Custom:C1Maps.Source> <Custom:VirtualEarthRoadSource ApplicationId="{x:Null}"/> </Custom:C1Maps.Source> <Custom:C1VectorLayer ItemsSource="{Binding City.Items}" …(1) ItemTemplate="{StaticResource PinStyle}"/> …(2) </Custom:C1Maps> </StackPanel> : (中略) :
C1Mapsコンポーネントで緯度経度に合わせてマークを描画するには、
- (1)緯度経度が含まれたコレクションをItemsSourceプロパティにBindingする
- (2)マーク描画用スタイルをItemTemplateに指定する
- (3)マーク描画用スタイルの中で、C1VectorPlacemarkのGeoPointに緯度経度をBindingする
- (4)マーク自体はC1VectorPlacemarkのGeometryで形を指定する
という手順で行います。今回はEllipseGeometryを指定しているので●を描画します。
コードビハインド側でループを回して1点1点位置を指定して描画する必要はありません。
検索イベント時のコードの記述
MainWindow.xamlのコードビハインド側に検索用のロジックを一部記載してますが、検索ボタンのCommandプロパティにViewModelのメソッドをBindingする方法の方がより結合度が疎になります。
Imports C1.WPF.Maps.ImageryService Namespace Views Public Class MainWindow Public Sub New() ' この呼び出しはデザイナーで必要です。 InitializeComponent() ' InitializeComponent() 呼び出しの後で初期化を追加します。 Me.DataContext = Application.MainVM End Sub Private Async Sub Search_Click(sender As Object, e As RoutedEventArgs) Await Application.MainVM.GetItems("愛知県", "豊田市") SetCenterPos() End Sub Private Sub SetCenterPos() Try Dim centerLoc = New Point(0, 0) Dim counter = 0 Dim items = Application.MainVM.City.Items '/* 地図の中心位置表示 */ For Each item In items Dim loc = New Point(item.Longitude, item.Latitude) centerLoc.Y = Math.Abs(centerLoc.Y * counter + loc.Y) / (counter + 1) centerLoc.X = Math.Abs(centerLoc.X * counter + loc.X) / (counter + 1) counter += 1 Next Me.C1Maps1.Center = centerLoc Catch ex As Exception End Try End Sub End Class End Namespace
あとはMainViewModelクラスを記述すれば出来上がりです。
サンプル実行
なお、ライセンス認証しているのにもかかわらず実行時にトライアル版の表示が出る場合は、Propertiesフォルダがプロジェクトに自動追加されていない可能性があります。その場合は、ソリューションエクスプローラーですべてのファイルを表示してPropertiesフォルダごとライセンスファイルをプロジェクトに追加すれば表示が消えますので、もし、トライアル版表示に悩まされている方は一度確認してみるとよいでしょう。