I'd like to add a Pushpin to a MapControl in a Windows 10 app, but it seems the control is gone since Windows 8.1.
It was as simple as that:
Pushpin locationPushpin = new Pushpin();
locationPushpin.Background = new SolidColorBrush(Colors.Purple);
locationPushpin.Content = "You are here";
locationPushpin.Tag = "locationPushpin";
locationPushpin.Location = watcher.Position.Location;
this.map.Children.Add(locationPushpin);
this.map.SetView(watcher.Position.Location, 18.0);
But Pushpin type is not recognized anymore...
Map control has changed little in UWP - take a look at Windows.UI.Xaml.Controls.Maps namespace.
As for adding Pushpins (POIs), you can do it in couple of ways. For example:
// get position
Geopoint myPoint = new Geopoint(new BasicGeoposition() { Latitude = 51, Longitude = 0 });
//create POI
MapIcon myPOI = new MapIcon { Location = myPoint, NormalizedAnchorPoint = new Point(0.5, 1.0), Title = "My position", ZIndex = 0 };
// add to map and center it
myMap.MapElements.Add(myPOI);
myMap.Center = myPoint;
myMap.ZoomLevel = 10;
For more guidelines visit MSDN.
Related
I am aware of technique to draw a circle by generating points by basic math and then use the points to create a MapPolygon.
Is there another way?
For example, I see there is a class for circles:
public sealed class Geocircle : IGeocircle, IGeoshape
But I don't know how to use it, there doesn't seem to be any MapLayer for it.
Geocircle is used to create a geographic circle object for the given position and radius. It often use to make map Geofence, but not to display the cycle on the map.
There many way that draw a circle on the map
generating points by basic math
for (var i = 0; i < 360; i++)
{
//draw a cycle
BasicGeoposition point = new BasicGeoposition()
{ Latitude = centerLatitude + ri * Math.Cos(3.6 * i * 3.14 / 180), Longitude = centerLongitude + ri * Math.Sin(3.6 * i * 3.14 / 180) };
list.Add(point);
}
Add Ellipse to map
private void MyMap_Loaded(object sender, RoutedEventArgs e)
{
// Specify a known location.
BasicGeoposition snPosition = new BasicGeoposition { Latitude = 47.620, Longitude = -122.349 };
Geopoint snPoint = new Geopoint(snPosition);
// Create a XAML border.
var ellipse1 = new Ellipse();
ellipse1.Fill = new SolidColorBrush(Windows.UI.Colors.Coral);
ellipse1.Width = 200;
ellipse1.Height = 200;
// Center the map over the POI.
MyMap.Center = snPoint;
MyMap.ZoomLevel = 14;
// Add XAML to the map.
MyMap.Children.Add(ellipse1);
MapControl.SetLocation(ellipse1, snPoint);
MapControl.SetNormalizedAnchorPoint(ellipse1, new Point(0.5, 0.5));
}
You can create XAML shapes and add them as a child to the MapControl. Then you set their location using SetLocation:
var circle = new Ellipse() {
Height = 20,
Width = 20,
Fill = new SolidColorBrush(Colors.Blue)
};
map.Children.Add(circle);
var location = new Geopoint(new BasicGeoposition()
{
Latitude = 51.1789,
Longitude = -1.8261
});
map.SetLocation(circle, location);
The Geocircle class is used for geofencing, so it is not applicable here.
I am trying to add a polygon to my map by using the following code example (retrieved from https://learn.microsoft.com/en-us/windows/uwp/maps-and-location/display-poi#add-a-shape):
public void HighlightArea() {
double centerLatitude = myMap.Center.Position.Latitude;
double centerLongitude = myMap.Center.Position.Longitude;
var mapPolygon = new MapPolygon
{
Path = new Geopath(new List<BasicGeoposition> {
new BasicGeoposition() {Latitude=centerLatitude+0.0005, Longitude=centerLongitude-0.001 },
new BasicGeoposition() {Latitude=centerLatitude-0.0005, Longitude=centerLongitude-0.001 },
new BasicGeoposition() {Latitude=centerLatitude-0.0005, Longitude=centerLongitude+0.001 },
new BasicGeoposition() {Latitude=centerLatitude+0.0005, Longitude=centerLongitude+0.001 },
}),
ZIndex = 1,
FillColor = Colors.Red,
StrokeColor = Colors.Blue,
StrokeThickness = 3,
StrokeDashed = false,
};
// Add MapPolygon to a layer on the map control.
var MyHighlights = new List<MapElement>();
MyHighlights.Add(mapPolygon);
var HighlightsLayer = new MapElementsLayer
{
ZIndex = 1,
MapElements = MyHighlights
};
myMap.Layers.Add(HighlightsLayer);
}
The polygon is shown on the map initially, but it disappears within 2 seconds from when it appeared (it fades away). I have successfully added a MapPolyline that sticks to the map by using an example I retrieved from the same link, which is why I cannot understand why the MapPolygon will not stick.
What may cause the polygon to fade away?
I'm playing with this library because it seems quite useful for app developing that involves locations.
Q1: I was able to implement this in code-behind but I'm not able to transfer this to MVVM architecture. How can I do it?
Q2: if you see my code you can notice that I'm trying to use markers but for some reason I am only able to use marker.Shape (rectangle, ellipse, wtv). I want to use the standard ones from the GoogleMaps. Gmarkergoogle doesn't seems to exists anymore in GMap API. How can I do it? There is some other library to use? Need a little help over here as well.
OverviewView CODE
public partial class OverviewView : UserControl
{
public OverviewView()
{
InitializeComponent();
// Initialize map:
myMap.MapProvider = GoogleMapProvider.Instance;
GMaps.Instance.Mode = AccessMode.ServerOnly; // get tiles from server only
PointLatLng point = new PointLatLng(42.742826, -77.030212);
PointLatLng point1 = new PointLatLng(41.742826, -77.030212);
//Not use proxy
//Center map on a point
//GMapMarker marker = new GMapMarker(point);
var marker = new GMapMarker(point);
var marker1 = new GMapMarker(point1);
marker.Shape = new Rectangle
{
Width = 1,
Height = 100,
Stroke = Brushes.Black,
StrokeThickness = 1.5
};
marker1.Shape = new Rectangle
{
Width = 1,
Height = 100,
Stroke = Brushes.Black,
StrokeThickness = 1.5
};
myMap.Markers.Add(marker);
myMap.Markers.Add(marker1);
myMap.ZoomAndCenterMarkers(5);
myMap.Position = point;
/* GMapOverlay markersOverlay = new GMapOverlay("markers");
GMarkerGoogle marker = new GMarkerGoogle(new PointLatLng(-25.966688, 32.580528),
GMarkerGoogleType.green);
markersOverlay.Markers.Add(marker);
gmap.Overlays.Add(markersOverlay);*/
}
}
Best regards and thanks in advance for the time,
Antoine
I want to add a pin on a certain location on a map for a windows phone 8.0 app.
My code so far is the following:
private async void Button_Click(object sender, RoutedEventArgs e)
{
BasicGeoposition bGeo = new BasicGeoposition();
bGeo.Latitude = 37.4333;
bGeo.Longitude = 24.9167;
Geopoint geoPoint = new Geopoint(bGeo,0);
myMap.ZoomLevel = 13;
myMap.Center = geoPoint;
}
private void AddMapIcon()
{
MapIcon MapIcon1 = new MapIcon();
MapIcon1.Location = new Geopoint(new BasicGeoposition()
{
Latitude = 37.4333,
Longitude = 24.9167
});
MapIcon1.NormalizedAnchorPoint = new Point(2.0, 2.0);
myMap.MapElements.Add(MapIcon1);
}
The map is loading properly, but the pin won't appear. Any ideas on this? Is there any way to do it without using xaml controls for the pin?
This is a general way of adding any UI on map control in windows phone:
We need to create "map layers" and "map overlays" and specify the coordinates where we want to place it. Sample code:
Read the tutorial here
You can add an Image control in the overlay and point its source to the pin image you want to plot. Hope this help
You can try..
BitmapImage myImage1;
myImage1 = new BitmapImage(new Uri("/Assets/Images/pushpin-google-hi.png", UriKind.RelativeOrAbsolute));
var image = new Image();
image.Width = 50;
image.Height = 50;
image.Opacity = 100;
image.Source = myImage1;
var mapOverlay = new MapOverlay();
mapOverlay.Content = image;
mapOverlay.GeoCoordinate = new GeoCoordinate(lats, lons);
var mapLayer = new MapLayer();
mapLayer.Add(mapOverlay);
MyMap.Layers.Add(mapLayer);
MyMap.SetView(new GeoCoordinate(lats, lons), 16);
I need to draw a driving route between two points on my MapControl (I'm doing this for Windows Phone 8.1). I did everything with the MSDN's tutorial but it doesn't work - the route is empty. What am I doing wrong? Here's the code.
BasicGeoposition startLocation = new BasicGeoposition();
startLocation.Latitude = 40.7517;
startLocation.Longitude = -073.9766;
Geopoint startPoint = new Geopoint(startLocation);
// End at Central Park in New York City.
BasicGeoposition endLocation = new BasicGeoposition();
endLocation.Latitude = 40.7669;
endLocation.Longitude = -073.9790;
Geopoint endPoint = new Geopoint(endLocation);
// Get the route between the points.
MapRouteFinderResult routeResult =
await MapRouteFinder.GetDrivingRouteAsync(
startPoint,
endPoint,
MapRouteOptimization.Time,
MapRouteRestrictions.None,
290
);
MapRouteView viewOfRoute = new MapRouteView(routeResult.Route);
viewOfRoute.RouteColor = Colors.Blue;
viewOfRoute.OutlineColor = Colors.Blue;
// Add the new MapRouteView to the Routes collection
// of the MapControl.
mapeczka.Routes.Add(viewOfRoute);
// Fit the MapControl to the route.
await mapeczka.TrySetViewBoundsAsync(
routeResult.Route.BoundingBox,
null,
Windows.UI.Xaml.Controls.Maps.MapAnimationKind.Bow);
if (routeResult.Status == MapRouteFinderStatus.Success)
{
// Use the route to initialize a MapRouteView.
viewOfRoute = new MapRouteView(routeResult.Route);
viewOfRoute.RouteColor = Colors.Yellow;
viewOfRoute.OutlineColor = Colors.Black;
// Add the new MapRouteView to the Routes collection
// of the MapControl.
}
mapeczka.Routes.Add(viewOfRoute);
// Fit the MapControl to the route.
await mapeczka.TrySetViewBoundsAsync(
routeResult.Route.BoundingBox,
null,
Windows.UI.Xaml.Controls.Maps.MapAnimationKind.None);