How do i add a pushpin to a Windows Phone 8.1 Map

Question

I've been looking for examples on how to perform this task however i haven't been able to find a clear one. Can someone please point me in the right direction. I'm lost...

Edit/Update:

Ive manage to add some markers following the following example: http://www.microsoftvirtualacademy.com/Content/ViewContent.aspx?et=8698&m=8686&ct=29035

However, as MSDN documentation states,

The MapIcon is not guaranteed to be shown. It may be hidden when it obscures other elements or labels on the map. The optional Title of the MapIcon is not guaranteed to be shown. If you don't see the text, zoom out by increasing the value of the ZoomLevel property of the MapControl.

I need something that its going to show no matter what, it has been almost impossible to find an simple example on how to perform this simple task! I must say im using the latest Maps sdk, not the previous 8.0.

Answer 1

What have you tried?

Have you read this article about Windows Phone 8.1 for Developers – Maps

Quote from the article:

Another thing that have changed is how objects like pushpins are added. The old MapLayer and MapOverlay is gone. Now you just add the controls to the MapControl.Children collection.

There's also a good article on MSDN with a code sample:

private void AddMapIcon()
{
    MapIcon MapIcon1 = new MapIcon();
    MapIcon1.Location = new Geopoint(new BasicGeoposition() { Latitude = 47.620,
      Longitude = -122.349 });
    MapIcon1.NormalizedAnchorPoint = new Point(0.5, 1.0);
    MapIcon1.Title = "Space Needle";
    MapControl1.MapElements.Add(MapIcon1);
}

Answer 2

Windows phone 8.1 has 2 different systems. One is Silverlight, the other is Win RT.

private void AddMapIcon()
{
    MapIcon MapIcon1 = new MapIcon();
    MapIcon1.Location = new Geopoint(new BasicGeoposition() { Latitude = 47.620,
     Longitude = -122.349 });
    MapIcon1.NormalizedAnchorPoint = new Point(0.5, 1.0);
    MapIcon1.Title = "Space Needle";>>
    MapControl1.MapElements.Add(MapIcon1);
}

This is the Win RT version, so if you use in Silverlight, it won't work.

Maybe you can specify more about your question and your Windows Phone 8.1 version.

Answer 3

I was able to do it using the following code

   public void AddPushpin(BasicGeoposition location, string text)
        {
            var pin = new Grid()
            {
                Width = 50,
                Height = 50,
                Margin = new Windows.UI.Xaml.Thickness(-12)
            };

            pin.Children.Add(new Ellipse()
            {
                Fill = new SolidColorBrush(Colors.DodgerBlue),
                Stroke = new SolidColorBrush(Colors.White),
                StrokeThickness = 3,
                Width = 50,
                Height = 50
            });

            pin.Children.Add(new TextBlock()
            {
                Text = text,
                FontSize = 12,
                Foreground = new SolidColorBrush(Colors.White),
                HorizontalAlignment = Windows.UI.Xaml.HorizontalAlignment.Center,
                VerticalAlignment = Windows.UI.Xaml.VerticalAlignment.Center
            });

            MapControl.SetLocation(pin, new Geopoint(location));
            Map_MainMap.Children.Add(pin);
        }

Answer 4

The XAML I use for the Universal Apps version of the maps to display databound pins:

The namespace:

xmlns:maps="using:Windows.UI.Xaml.Controls.Maps"

The XAML:

<maps:MapControl
     Height="800" Width="480" DesiredPitch="45" Center="{Binding MapCenter, Converter={StaticResource CoordinatesListToGeopointConverter}}">
    <maps:MapItemsControl x:Name="myMap" ItemsSource="{Binding Data.Features}">
        <maps:MapItemsControl.ItemTemplate>
            <DataTemplate>
                <userControls:CustomPushPin maps:MapControl.Location="{Binding Geometry.Coordinates, Converter={StaticResource CoordinatesListToGeopointConverter}}"
                    Fill="{Binding Properties.Mag, Converter={StaticResource MagnitudeToSolidColorBrushConverter} }"
                    BorderThickness="2"
                    Size="{Binding Properties.Mag, Converter={StaticResource MagnitudeToWidthConverter} }"
                    Magnitude="{Binding Properties.Mag}"
                    TapCommand="{Binding DataContext.PinTappedCommand, ElementName=Hub}" CommandParameter="{Binding }"/>

            </DataTemplate>
        </maps:MapItemsControl.ItemTemplate>
    </maps:MapItemsControl>
    <maps:MapControl.ColorScheme>
        <maps:MapColorScheme >Light</maps:MapColorScheme>
    </maps:MapControl.ColorScheme>
</maps:MapControl>

I use a custom pin (for this app, it varies in size and color depending on data bound to it) but they always appear on the map.

I hope this helps, please let me know if you need any specific details.