Adding Tile Overlays to the Map

This documentation is no longer available on MSDN, however it is available as a CHM download.

This topic describes how to add image overlays from existing tile sources using the Bing Maps Silverlight Control. It does not describe how to create your own overlays using tools such as MapCruncher. In order to add a tile overlay to a location on your map, you need to:

  1. Specify the tile source (TileSource) of the overlay.

  2. Define the area of coverage where the tile source is valid.

  3. Create a tile map layer (MapTileLayer) in which to add the tile source.

The following example retrieves image data from the specified tile source, and displays images from the tile source that fall within the specified LocationRect. The LocationRectTileSource object defines the bounding rectangle as well as the valid zoom levels for the tile overlays. Tile overlays that fall outside the bounding rectangle or zoom range do not show up on the map.

After you define the valid coverage area for the tile overlays, add the tile source to a MapTileLayer. The map tile layer is then added to a MapLayer and the tile overlay shows up on the map. This particular example retrieves a terrain overlay for the specified area on the map.


The terrain tile overlay added to the map

<UserControl x:Class="SilverlightTest1.TileOverlay"
    Width="1024" Height="768">
    <Grid x:Name="LayoutRoot" Background="White">
            <RowDefinition Height="35" />
            <RowDefinition Height="*" />
            <ColumnDefinition Width="100" />
            <ColumnDefinition Width="*"/>
        <Button x:Name="btnAddTileLayer" Click="btnAddTileLayer_Click" 
                HorizontalAlignment="Left" Grid.Column="0" Grid.Row="0">
            <TextBlock x:Name="txtButton">Add Tile Layer</TextBlock>
        <Button x:Name="btnRemoveTileLayer" Click="btnRemoveTileLayer_Click"
                HorizontalAlignment="Left" Grid.Column="1" Grid.Row="0">
            <TextBlock x:Name="txtButton2">Remove Tile Layer</TextBlock>
        <m:Map x:Name="MapTileOverlay" CredentialsProvider="your key" Mode="Road" Center="48.03,-122.4" ZoomLevel="10" 
               Grid.ColumnSpan="2" Grid.Column="0" Grid.Row="1" />

Imports Microsoft.Maps.MapControl

	Partial Public Class TileOverlay
		Inherits UserControl
		Private tileLayer As MapTileLayer
		Private tileOpacity As Double = 1.0

		Public Sub New()
		End Sub

		Private Sub AddTerrainTileOverlay()
			' The bounding rectangle that the tile overlay can be placed within.
			Dim boundingRect As New LocationRect(New Location(48.06282, -122.43773), _
			                                     New Location(47.999973, -122.37490))

			' Creates a new map layer to add the tile overlay to.
			tileLayer = New MapTileLayer()

			' The source of the overlay.
			Dim tileSource As New LocationRectTileSource() With _
			{ .UriFormat = "{quadkey}.png"}
	  	    ' The zoom range that the tile overlay is visibile within
			tileSource.ZoomRange = New Range(Of Double)(10,18)
			' The bounding rectangle area that the tile overaly is valid in.
			tileSource.BoundingRectangle = boundingRect

			' Adds the tile overlay to the map layer

			' Adds the map layer to the map
			If Not MapTileOverlay.Children.Contains(tileLayer) Then
			End If
			tileLayer.Opacity = tileOpacity
		End Sub

		Private Sub btnAddTileLayer_Click(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs)
			' Adds the tile overlay on the map, if it doesn't already exist.
			If tileLayer IsNot Nothing Then
				If Not MapTileOverlay.Children.Contains(tileLayer) Then
				End If
			End If
		End Sub

		Private Sub btnRemoveTileLayer_Click(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs)
			' Removes the tile overlay if it has been added to the map.
			If MapTileOverlay.Children.Contains(tileLayer) Then
			End If
		End Sub

	End Class