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

Aligning MapShapeData

4 Answers 72 Views
Map
This is a migrated thread and some comments may be shown as answers.
Jason D
Top achievements
Rank 1
Veteran
Jason D asked on 26 Aug 2014, 08:27 PM
I've transitioned all my geometry to MapShapeData objects, with the exception of MapPinPoint. I am still using those because they allow positioning over the center instead of the upper left corner. How can I create an EllipseData (for example) so that its center is at 30,-90 instead of its upper left corner at that coordinate?

4 Answers, 1 is accepted

Sort by
0
Jason D
Top achievements
Rank 1
Veteran
answered on 26 Aug 2014, 08:40 PM
FYI, one of the reasons I need this is that I am using the ZIndex for the other shapes to ensure they are drawn in the correct order. But when using the ZIndex, the MapPinPoint is underneath the other shapes. If I don't use ZIndex at all, the shapes are occasionally drawn in random order, ignoring the order they were added.
0
Accepted
Ludmila
Top achievements
Rank 1
answered on 27 Aug 2014, 05:46 AM
Hello Jason,

There are 2 ways to do it:

1. You can calculate top-left corner of the EllipseData using its center and size (Width and Height):

Location center = new Location(30, -90);
double width = 0.5; // degrees
double height = 0.5; // degrees
 
EllipseData ellipse = new EllipseData()
{
    Location = new Location(center.Latitude + height / 2.0d, center.Longitude - width / 2.0d),
    Height = height,
    Width = width,
    ShapeFill = new MapShapeFill()
    {
        Fill = new SolidColorBrush(Color.FromArgb(127, 0, 240, 255)),
        Stroke = new SolidColorBrush(Colors.Red),
        StrokeThickness = 2
    }
};


2. You can use PathData and EllipseGeometryData. The EllipseGeometryData allows you use center of the ellipse to position it:

PathData path = new PathData()
{
    Data = new EllipseGeometryData()
    {
        Center = new Location(30, -90),
        RadiusX = 0.25, // degrees
        RadiusY = 0.25  // degrees
    },
    ShapeFill = new MapShapeFill()
    {
        Fill = new SolidColorBrush(Color.FromArgb(127, 0, 240, 255)),
        Stroke = new SolidColorBrush(Colors.Red),
        StrokeThickness = 2
    }
};


Best Regards
Ludmila Murzova
0
Jason D
Top achievements
Rank 1
Veteran
answered on 27 Aug 2014, 03:23 PM
Not what I was expecting, but it works. Thanks.

However, the Ellipse and other shapes will not work for me after all. Because of the projection (I guess), they are not perfectly square or round. Also, because of the dimensions are specified in degrees, the shape is invisible when zoomed out, and huge when zoomed in.

For anyone who has the same problem, I got around this by using a Line with the same start and end point. Using a Round cap allows it to simulate being a circle.

Dim loCenter As Location
 
loCenter = New Location(30, -90)
 
Dim loShape As LineData
loShape = New LineData
 
loShape.Point1 = loCenter
loShape.Point2 = loCenter
loShape.ShapeFill = New MapShapeFill
loShape.ShapeFill.Stroke = New Windows.Media.SolidColorBrush(Windows.Media.Color.FromArgb(255, 255, 95, 90))
loShape.ShapeFill.StrokeEndLineCap = Windows.Media.PenLineCap.Round
loShape.ShapeFill.StrokeStartLineCap = Windows.Media.PenLineCap.Round
loShape.ShapeFill.StrokeThickness = 12

0
Accepted
Ludmila
Top achievements
Rank 1
answered on 27 Aug 2014, 03:53 PM
Hello Jason,

It looks like I didn't get your question right. You told about MapShapeData objects which all have the coordinates given as latitude and longitude and size in degrees. So I supposed that you need resizable shapes on the map. But if you need a simple Ellipse shape which don't change its size when zooming and have size given in pixels then the solution is ever so much easier:

Location center = new Location(30, -90);
Ellipse ellipse = new Ellipse()
{
    Height = 30, // pixels
    Width = 30, // pixels,
    HorizontalAlignment = HorizontalAlignment.Center,
    VerticalAlignment = VerticalAlignment.Center,
    Fill = new SolidColorBrush(Colors.Red)
};
Canvas.SetZIndex(ellipse, 2);
MapLayer.SetLocation(ellipse, center);


Pay attention, I set HorizontalAlignment and VerticalAlignment to the Center value. It makes framework element centered around the location.

Best Regards
Ludmila Murzova
Tags
Map
Asked by
Jason D
Top achievements
Rank 1
Veteran
Answers by
Jason D
Top achievements
Rank 1
Veteran
Ludmila
Top achievements
Rank 1
Share this question
or