This project has moved. For the latest updates, please go here.

Displaying a simple icon on the map

Nov 16, 2015 at 2:21 PM
Edited Nov 16, 2015 at 2:22 PM
Hi,

I'm trying to display a simple image on the map. I'm using this code:
<Style x:Key="IconItemStyle" TargetType="mapControl:Pushpin">
            <Setter Property="HorizontalAlignment" Value="Left"/>
            <Setter Property="VerticalAlignment" Value="Bottom"/>
            <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
            <Setter Property="VerticalContentAlignment" Value="Stretch"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="mapControl:Pushpin">
                        <Grid>
                            <ContentPresenter Content="{TemplateBinding Content}"
                                          ContentTemplate="{TemplateBinding ContentTemplate}"
                                          Margin="{TemplateBinding Padding}"
                                          HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                          VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>


.......


<mapControl:Pushpin  Style="{StaticResource IconItemStyle}"
                                     mapControl:MapPanel.Location="{x:Bind ViewModel.Route.StartLocation, Converter={StaticResource LocationConverter}, Mode=OneWay}">
                            <Image Source="ms-appx:///Assets/start.png" />
                        </mapControl:Pushpin>
The png is showing up on the map and everything is fine, except the behavior of the image when zooming in or out. It moves on the x axes from left to right when zooming out.

Image
Coordinator
Nov 16, 2015 at 6:32 PM
Apparently you want the Pushpin to be horizontally centered. So you should specify that in your Style:
<Setter Property="HorizontalAlignment" Value="Center"/>
Dec 4, 2015 at 10:30 AM
Works like a charm, thanks :D!