This is a migrated thread and some comments may be shown as answers.

Error PinPointTemplate with ImageSource goes big

1 Answer 66 Views
Map
This is a migrated thread and some comments may be shown as answers.
Luis
Top achievements
Rank 2
Luis asked on 27 Mar 2017, 05:20 PM

Hello,

I'm trying to put png icons on the PinPointTemplate and I achieved it but it goes big enough as the half of my screen, I tried to do ImageScale but it only fits the image (16x16 png) but the square around is still big, when I put Width and Height the point loses the location on different zooms. Please help, leave you part of my code.

 

<DataTemplate x:Key="PinPointTemplate">
            <telerik:MapPinPoint telerik:MapLayer.Location="{Binding Path=Location}" 
                                 Background="{Binding Background}"
                                 BorderBrush="Black"
                                 BorderThickness="1" 
                                 ImageSource="{Binding Icon}"
                                 ImageScale = "0.1"
                                 Width="20" Height="20">
                <ToolTipService.ToolTip>
                    <ToolTip Content="{Binding Path=Caption}"/>
                </ToolTipService.ToolTip>
            </telerik:MapPinPoint>
           
        </DataTemplate>

1 Answer, 1 is accepted

Sort by
0
Martin Ivanov
Telerik team
answered on 30 Mar 2017, 10:58 AM
Hello Luis,

This behavior is observed because the map measures the MapPinPoint based on its desired size which could be quite big if the Image is big. On the other hand the ImageScale uses a transformation to scale only the image element but the size of the parent pin point is modified.

In order to restrict the size of the image you can set the MapPinPoint width and height. However. this will position the image on a bit wrong coordinates. To change this you can extract the ControlTemplate of MapPinPoint, find the Image element that shows the icon and set its Stretch property to a value different than None. For example, Fill. Also, you can change the StackPanel in the template with a Grid. You can check the attached project that demonstrates this approach. I hope it helps.

Regards,
Martin
Telerik by Progress
Want to extend the target reach of your WPF applications, leveraging iOS, Android, and UWP? Try UI for Xamarin, a suite of polished and feature-rich components for the Xamarin framework, which allow you to write beautiful native mobile apps using a single shared C# codebase.
Tags
Map
Asked by
Luis
Top achievements
Rank 2
Answers by
Martin Ivanov
Telerik team
Share this question
or