Rotate Point Images

[Esther]

Hello everybody,
I have a map with several Pinpoints on it. I want to rotate each pinpoint image acording to a variable value.
If I do a rotate tranform this way:
Me.pinPoint.RenderTransform = New RotateTransform(degrees,0,0)
the image is correctly rotated but I loose the position on the map. When I do zoom the center of the point is different for each level of zoom.
I´ve tried asociating a hotSpot but the problem persists.
Do you know a way to solve that??
Thank you very much,
Esther

[Andrey]

Hello Esther,

You can use RotateTransform, but you must perform some additional calculation to change hotspot correspondently to the rotation angle. Since X and Y axis of the rotated pushpin will be rotated as well, then using of the Fraction type of the hotspot will give wrong results. You should use Pixel type and calculate pixel shift depends on the rotation angle. For default pushpin template the calculations could looks like the following:

Partial Public Class MainPage
    Inherits UserControl

    Public Sub New()
        InitializeComponent()

        Dim pinHeight As Double = 40
        Dim pinWidth As Double = 25
        Dim angle As Double = 45

        Dim pin1 As Pushpin = New Pushpin()
        MapLayer.SetLocation(pin1, New Location(42.5, -99))
        Me.informationLayer.Items.Add(pin1)

        Dim pin2 As Pushpin = New Pushpin()
        Dim rotate As RotateTransform = New RotateTransform()
        rotate.Angle = angle
        pin2.RenderTransform = rotate
        Dim hotspot As HotSpot = Me.CalculatePushpinHotspot(pinHeight, pinWidth, angle)
        MapLayer.SetHotSpot(pin2, hotspot)
        MapLayer.SetLocation(pin2, New Location(42.5, -99))
        Me.informationLayer.Items.Add(pin2)

    End Sub


    ''' <summary>
    ''' Calculate hotspot for rotated pushpint.
    ''' </summary>
    ''' <param name="pinHeight">Height of the pushpint.</param>
    ''' <param name="pinWidth">Width of the pushpin.</param>
    ''' <param name="angle">Rotation angle in degrees.</param>
    ''' <returns>New hotspot.</returns>
    Private Function CalculatePushpinHotspot(ByVal pinHeight As Double, ByVal pinWidth As Double, ByVal angle As Double) As HotSpot
        Dim angleRad As Double = angle * Math.PI / 180D
        Dim halfWidth As Double = pinWidth / 2D
        Dim shiftX As Double = pinHeight * Math.Sin(angleRad) - halfWidth * Math.Cos(angleRad)
        Dim shiftY As Double = -(pinHeight * Math.Cos(angleRad) + halfWidth * Math.Sin(angleRad))

        Dim hotspot As HotSpot = New HotSpot()
        With hotspot
            .X = shiftX
            .XUnits = HotSpotUnit.Pixels
            .Y = shiftY
            .YUnits = HotSpotUnit.Pixels
        End With

        Return hotspot
    End Function
End Class

All the best,
Andrey Murzov
the Telerik team