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:
Specify the tile source (TileSource) of the overlay.
Define the area of coverage where the tile source is valid.
Create a tile map layer (MapTileLayer) in which to add the tile source.
Example
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.
.jpg "Ee681902.73b9498d-80f2-4036-be24-0f3906da1451(en-us,MSDN.10).jpg")
The terrain tile overlay added to the map
<UserControl x:Class="SilverlightTest1.TileOverlay"
xmlns="https://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="https://schemas.microsoft.com/winfx/2006/xaml"
xmlns:m="clr-namespace:Microsoft.Maps.MapControl;assembly=Microsoft.Maps.MapControl"
Width="1024" Height="768">
<Grid x:Name="LayoutRoot" Background="White">
<Grid.RowDefinitions>
<RowDefinition Height="35" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="100" />
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Button x:Name="btnAddTileLayer" Click="btnAddTileLayer_Click"
HorizontalAlignment="Left" Grid.Column="0" Grid.Row="0">
<TextBlock x:Name="txtButton">Add Tile Layer</TextBlock>
</Button>
<Button x:Name="btnRemoveTileLayer" Click="btnRemoveTileLayer_Click"
HorizontalAlignment="Left" Grid.Column="1" Grid.Row="0">
<TextBlock x:Name="txtButton2">Remove Tile Layer</TextBlock>
</Button>
<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" />
</Grid>
</UserControl>
using System.Windows;
using System.Windows.Controls;
using Microsoft.Maps.MapControl;
namespace SilverlightTest1
{
public partial class TileOverlay : UserControl
{
MapTileLayer tileLayer;
private double tileOpacity = 1.0;
public TileOverlay()
{
InitializeComponent();
}
private void AddTerrainTileOverlay()
{
// The bounding rectangle that the tile overlay can be placed within.
LocationRect boundingRect = 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.
LocationRectTileSource tileSource = new LocationRectTileSource();
tileSource.UriFormat = "https://www.microsoft.com/maps/isdk/ajax/layers/lidar/{quadkey}.png";
// The zoom range that the tile overlay is visibile within
tileSource.ZoomRange = new Range<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
tileLayer.TileSources.Add(tileSource);
// Adds the map layer to the map
if (!MapTileOverlay.Children.Contains(tileLayer))
{
MapTileOverlay.Children.Add(tileLayer);
}
tileLayer.Opacity = tileOpacity;
}
private void btnAddTileLayer_Click(object sender, RoutedEventArgs e)
{
// Adds the tile overlay on the map, if it doesn't already exist.
if (tileLayer != null)
{
if (!MapTileOverlay.Children.Contains(tileLayer))
{
MapTileOverlay.Children.Add(tileLayer);
}
}
else
{
AddTerrainTileOverlay();
}
}
private void btnRemoveTileLayer_Click(object sender, RoutedEventArgs e)
{
// Removes the tile overlay if it has been added to the map.
if (MapTileOverlay.Children.Contains(tileLayer))
{
MapTileOverlay.Children.Remove(tileLayer);
}
}
}
}
Imports Microsoft.Maps.MapControl
Partial Public Class TileOverlay
Inherits UserControl
Private tileLayer As MapTileLayer
Private tileOpacity As Double = 1.0
Public Sub New()
InitializeComponent()
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 = "https://www.microsoft.com/maps/isdk/ajax/layers/lidar/{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
tileLayer.TileSources.Add(tileSource)
' Adds the map layer to the map
If Not MapTileOverlay.Children.Contains(tileLayer) Then
MapTileOverlay.Children.Add(tileLayer)
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
MapTileOverlay.Children.Add(tileLayer)
End If
Else
AddTerrainTileOverlay()
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
MapTileOverlay.Children.Remove(tileLayer)
End If
End Sub
End Class