The process of converting a geographical locaton to a textual address is known as 'reverse geocoding'. This tutorial demonstrates how to resolve and display the street address beneath the mouse cursor.

This tutorial will walk you through the creation of a simple reverse geocoding application, which will display the latitude, longitude, and physical address pointed to by the mouse cursor.

This tutorial is broken into the following steps:

  1. Create a Visual Studio project
  2. Configure a GeoStream server using C# code
  3. Add a map, and three textboxes using XAML code
  4. Perform a reverse geocode (translate map coordinates to an address) using C# code

Create a Silverlight project and configure a GeoStream server

Make sure that the file clientaccesspolicy.xml exists in your Inetpub\wwwroot directory. Create a new Silverlight project named ''ReverseGeoCodeTutorial' and add a reference to Telogis.GeoBase.Silverlight.dll. Be sure to configure a GeoStream server.

See the Create a Silverlight-Specific GeoBase project using Visual Studio tutorial for an illustrated walk-through.

Adding user controls

Open MainPage.xaml and add the following attributes to the UserControl tag. These attributes allow your XAML code to access the Telogis.GeoBase namespace.

xmlns:GeoBase="clr-namespace:Telogis.GeoBase;assembly=Telogis.GeoBase.Silverlight"

Modify the code between the Grid tags to match the code snippet below. This code creates a 3-row layout containing a map, and three text boxes (latitude, longitude, and address). The code MouseMove="MainMap_MouseMove" refers to a C# method, which we'll describe and use later.

<Grid x:Name="LayoutRoot" Background="White">

  <Grid.RowDefinitions>
    <RowDefinition Height="400" />
    <RowDefinition Height="30" />
    <RowDefinition Height="50" />
    <RowDefinition Height="*" />
  </Grid.RowDefinitions>

  <Border BorderBrush="Black" Grid.Row="0" BorderThickness="2">
    <GeoBase:Map x:Name="MainMap"
                 Center="34,-118"
                 Zoom="6"
                 MouseMove="MainMap_MouseMove">
    </GeoBase:Map>
  </Border>

  <StackPanel Grid.Row="1" Orientation="Horizontal">
    <TextBlock VerticalAlignment="Center">Lat:</TextBlock>
    <TextBox x:Name="tbLat"
             Width="125"
             Height="25"
             Text="33.581353"></TextBox>
    <TextBlock VerticalAlignment="Center">Lon:</TextBlock>
    <TextBox x:Name="tbLon"
             Width="125"
             Height="25"
             Text="-117.726979"></TextBox>
  </StackPanel>

  <TextBox x:Name="AddressResults"
           Grid.Row="2"
           Margin="0,2,0,2"
           ScrollViewer.VerticalScrollBarVisibility="Auto" />

</Grid>

In the code above, the map control is added to the first row (Grid.Row="0") and the MouseMove event is assigned to the C# method MainMap_MouseMove. In the second row, the two text boxes are added for the latitude and longitude values. Finally, the address text box is added to the third row.

Performing a reverse geocode

Open "MainPage.xaml.cs" and add the following using statements:

using Telogis.GeoBase;
using Telogis.GeoBase.GeoStream;

Add the following property to the MainPage class. This property will be used to hold the result of the reverse geocode:

private Address result = null;

Finally, add the following methods to the MainPage class:

  1. MainMap_MouseMove - invoke a reverse geocode whenever the mouse is moved to a new location
  2. FindAddress - perform a reverse geocode of the mouse coordinates
  3. ReceiveAddress - a callback function that receives the results of the reverse geocode operation from the GeoStream server
  4. SetAddress - update the address field on the page
private void MainMap_MouseMove(object sender, System.Windows.Input.MouseEventArgs e) {
  LatLon ll = MainMap.XYOverlaytoLatLon(e.GetPosition(MainMap));
  tbLat.Text = ll.Lat.ToString();
  tbLon.Text = ll.Lon.ToString();

  FindAddress(ll);
}

private void FindAddress(LatLon ll) {
  AddressResults.Text = String.Empty;
  GeoCoder.ReverseGeoCode(ll, this.ReceiveAddress);
}

private void ReceiveAddress(object geoAddress, JSONRequestEventArgs e) {
  this.result = (Address)geoAddress;
  Dispatcher.BeginInvoke(this.SetAddress);
}

private void SetAddress() {
  if (this.result != null) {
    this.AddressResults.Text = this.result.ToString();
  }
}

The MainMap_MouseMove method is the event handler which instigates the reverse geocode. The position of the mouse pointer over the map is converted to a LatLon using the XYOverlaytoLatLon() method. The LatLon is displayed in the text boxes, and also used as a parameter to the FindAddress method.

Testing

Press F5 to build and run your application. Your default web browser will load a web page displaying a map. Pan and zoom around the map - as the mouse pointer moves over the map the corresponding latitude, longitude and address will be displayed in the text boxes.

Next step

The next tutorial, Creating Silverlight tooltips, demonstrates how to display contextual information for individual map objects. Alternatively you can skip ahead to another Telogis Silverlight API tutorial.

Published, Apr 6th 2011, 03:18

Tagged under: silverlight reverse geocoding