Silverlight - Adding Text to Pushpin in Bing Maps via C#

Question

I was able to make my silverlight Bing map accepts Mousclicks and converts them to Pushpins in C#. Now I want to show a text next to the PushPin as a description that appears when the mouse goes over the pin , I have no clue how to do that. What are the methods that enable me to do this thing?

This is the C# code :

public partial class MainPage : UserControl

{ private MapLayer m_PushpinLayer;

public MainPage()
{
    InitializeComponent();
    base.Loaded += OnLoaded;
}

private void OnLoaded(object sender, RoutedEventArgs e)
{
    base.Loaded -= OnLoaded;

m_PushpinLayer = new MapLayer();
x_Map.Children.Add(m_PushpinLayer);
    x_Map.MouseClick += OnMouseClick;
}

private void AddPushpin(double latitude, double longitude)
{
    Pushpin pushpin = new Pushpin();
    pushpin.MouseEnter += OnMouseEnter;
    pushpin.MouseLeave += OnMouseLeave;
    m_PushpinLayer.AddChild(pushpin, new Location(latitude, longitude), PositionOrigin.BottomCenter);
}

private void OnMouseClick(object sender, MapMouseEventArgs e)
{
    Point clickLocation = e.ViewportPoint;
    Location location = x_Map.ViewportPointToLocation(clickLocation);
    AddPushpin(location.Latitude, location.Longitude);
}

private void OnMouseLeave(object sender, MouseEventArgs e)
{
    Pushpin pushpin = sender as Pushpin;

    // remove the pushpin transform when mouse leaves
    pushpin.RenderTransform = null;
}

private void OnMouseEnter(object sender, MouseEventArgs e)
{
    Pushpin pushpin = sender as Pushpin;

    // scaling will shrink (less than 1) or enlarge (greater than 1) source element
    ScaleTransform st = new ScaleTransform();
    st.ScaleX = 1.4;
    st.ScaleY = 1.4;

    // set center of scaling to center of pushpin
    st.CenterX = (pushpin as FrameworkElement).Height / 2;
    st.CenterY = (pushpin as FrameworkElement).Height / 2;

    pushpin.RenderTransform = st;
}

}

Answer 1

You have 2 ways to go:

(1) Create any UIElement to pass into PushPinLayer.AddChild. The AddChild method will accept and any UIElement, such as this Grid containing an Image and a TextBlock:

MapLayer m_PushpinLayer = new MapLayer(); 
Your_Map.Children.Add(m_PushpinLayer);
Image image = new Image(); 
image.Source = ResourceFile.GetBitmap("Images/Pushpin.png", From.This); 
TextBlock textBlock = new TextBlock();
textBlock.Text = "My Pushpin";
Grid grid = new Grid();
grid.Children.Add(image);
grid.Children.Add(textBlock);

m_PushpinLayer.AddChild(grid, 
    new Microsoft.Maps.MapControl.Location(42.658, -71.137),   
        PositionOrigin.Center);

(2) Create a native PushPin object to pass into PushpinLayer.AddChild, but first set it's Template property. Note that PushPin's are ContentControls, and have a Template property that can be set from a Resource defined in XAML:

MapLayer m_PushpinLayer = new MapLayer(); 
Your_Map.Children.Add(m_PushpinLayer); 
Pushpin pushpin = new Pushpin(); 
pushpin.Template = Application.Current.Resources["PushPinTemplate"]   
    as (ControlTemplate); 
m_PushpinLayer.AddChild(pushpin, 
    new Microsoft.Maps.MapControl.Location(42.658, -71.137),   
        PositionOrigin.Center);

...

<ResourceDictionary 
    xmlns="http://schemas.microsoft.com/client/2007" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
> 
    <ControlTemplate x:Key="PushPinTemplate"> 
        <Grid> 
            <Image Source="Images/Pushpin.png" /> 
            <TextBlock Text="My Pushpin" /> 
        </Grid> 
    </ControlTemplate> 
</ResourceDictionary>

Good luck, Jim McCurdy

Face To Face Software, and YinYangMoney