I want to add a tapped event which open information (in textbox or popup or whatever it's possible) about the tapped pin on my map
I've a map and a method to add pins (mapicon) on it, my problem is that i don't know how to use a pin as a button to open something to show information about the pin tapped, close/clean it in order to open a new one up to the user.
here is the method:
private void addgreenpin(double latitude, double longitude, string nom){
BasicGeoposition lugar = new BasicGeoposition()
{
Latitude = latitude,
Longitude = longitude
};
var places = new Geopoint(lugar);
MapIcon mapIcon1 = new MapIcon();
mapIcon1.Location = places;
mapIcon1.NormalizedAnchorPoint = new Point(0.1, 0.2);
mapIcon1.Title = nom;
mapIcon1.Image = mapIcon2StreamReference;
mapIcon1.ZIndex = 4;
MapControl1.MapElements.Add(mapIcon1);}
i've been trying this :
MapControl1.MapElementClick += new TappedEventHandler(Info);
In place of MapIcon you can add XAML content to your map, something like this:
var pin = new Grid();
pin.Tapped += Pin_Tapped; //Binding tap event for current pin.
pin.Children.Add(new Ellipse()
{
Fill = new SolidColorBrush(Colors.DodgerBlue),
Stroke = new SolidColorBrush(Colors.White),
StrokeThickness = 1,
Width = 20,
Height = 20,
});
MapControl.SetLocation(pin, <GeoPoint_Where_You_Need_The_Pin>);
mapControlName.Children.Add(pin);
and then handle the tap event something like this:
private async void Pin_Tapped(object sender, TappedRoutedEventArgs e)
{
// DO YOUR STUFF HERE
}
Hope this helps.
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 creating some shapes from code behind dynamically and adding them to a Grid and further add the Grid to Canvas.
So when I double click on a shape I should be able to add some text which works fine. Now lets say I have two shapes on the Canvas and when I try to draw a line between these shapes for some reason the first shape gets pulled away to the bottom and the line starts from the middle of first shape.
I want the shape not to change the position and the line should start from the bottom of first shape. Please see the image for my problem.
Please help with your thoughts. Here is my code. Also I tried numerous posts eg: Getting the top left coordinates of a WPF UIElement.
But none of them seem to help.
private void CvsSurface_OnDrop(object sender, DragEventArgs e) //In this event I am creating a shape dynamically and adding to a grid which is then added to a canvas.
{
Shape result = null;
Object droppedData = e.Data; //This part is not important
/*Translate Drop Point in reference to Stack Panel*/
Point dropPoint = e.GetPosition(this.cvsSurface);
//Console.WriteLine(dropPoint);
//Label lbl = new Label();
//lbl.Content = draggedItem.Content;
UIElement element = draggedItem.Content as UIElement;
Shape s = element as Shape;
if (s is Ellipse)
{
Ellipse ellipse = new Ellipse()
{
Height = s.Height,
Width = s.Width,
Fill = s.Fill
};
result = ellipse;
}
else if (s is Rectangle)
{
Rectangle rectangle = new Rectangle()
{
Height = s.Height,
Width = s.Width,
Fill = s.Fill
};
result = rectangle;
}
Grid sp = new Grid();
sp.Children.Add(result);
sp.MouseLeftButtonDown += Sp_MouseLeftButtonDown;
sp.MouseLeftButtonUp += Sp_MouseLeftButtonUp;
//sp.PreviewMouseLeftButtonUp += Sp_PreviewMouseLeftButtonUp;
//sp.MouseLeftButtonUp += Sp_MouseLeftButtonUp;
cvsSurface.Children.Add(sp);
Canvas.SetLeft(sp, dropPoint.X);
Canvas.SetTop(sp, dropPoint.Y);
}
private void Sp_MouseLeftButtonUp(object sender, MouseButtonEventArgs e) // The purpose of this event lets say when some one clicks on a shape and drags the mouse to the other shape and when mouse up I want to draw a line between the shapes.
{
bool mouserelease = System.Windows.Input.Mouse.LeftButton == MouseButtonState.Pressed;
if (!mouserelease)
{
x2 = e.GetPosition(stackpanel).X;
y2 = e.GetPosition(stackpanel).Y;
Line l = new Line();
l.X1 = x1;
l.Y1 = y1;
l.X2 = x2;
l.Y2 = y2;
l.Margin = new Thickness(0, 19, 0, 0);
l.Stroke = new SolidColorBrush(Colors.Black);
l.StrokeThickness = 2;
stackpanel.Children.Add(l);
}
}
private void Sp_MouseLeftButtonDown(object sender, MouseButtonEventArgs e) //This method lets say if user clicks twice then he wants to add some text or if he single clicks then I am assuming he is trying to a drag and draw a line
{
stackpanel = sender as Grid; //Sorry, the stackpanel is a global variable name of type Grid. Its actually Grid stackpanel;
if (e.ClickCount == 2)
{
dialog = new UserDialog()
{
DataContext = this,
Height = 180,
Width = 400,
MaxHeight = 180,
MaxWidth = 400
};
dialog.ShowDialog();
}
else
{
x1 = e.GetPosition(stackpanel).X + 18;
y1 = e.GetPosition(stackpanel).Y + 18;
//x1 = GetPosition(stackpanel, cvsSurface).X;
//y1 = GetPosition(stackpanel, cvsSurface).Y;
}
}
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 have a figure in Canvas in WPF application. This figure is generated by program (I click a button and then a figure appears). How to order the Figure_MouseLeftButtonDown function to change some properties of THIS figure? Also I want to move this figure by dragging. Now I have something like this:
var ell = new Ellipse() {
Name = "FirstEllipse",
Width = 150,
Height = 100,
Margin = new Thickness(200, 150, 0, 0),
Fill = Brushes.Red
};
ell.MouseLeftButtonDown += Ellipse_MouseLeftButtonDown;
canvas.Children.Add(ell);
private void Figure_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
{
sender.SetValue(Ellipse.FillProperty, Brushes.Aquamarine);
}
I made it, maybe this answer will help somebody else. Ellipse ellip = new Ellipse();
ellip = (Ellipse)sender;
ellip.SetValue(Ellipse.FillProperty, Brushes.Aquamarine);
When I try to zoom in (Button_Click_1 event) I'm getting an error as I try to add images/layers back to a map.
I should note: I've simplified the code substantially so that it would be easier to pick out the error (that I can't seem to figure out).
Each zoom level has a different set of images which are attached to it in case you're wondering why I need to continually clear the layers/images.
Each of the Images/Layers/Overlays is defined globally (so that I can use them in several methods
Image img1 = new Image();
Image img2 = new Image();
MapLayer lyr1 = new MapLayer();
MapLayer lyr2 = new MapLayer();
MapOverlay ovrly1 = new MapOverlay();
MapOverlay ovrly2 = new MapOverlay();
Each of these is initialized when the page loads in a separate method:
private void initializeImages()
{
ovrly1.GeoCoordinate = new GeoCoordinate(49.33783000, -0.45215600);
img1.Source = new BitmapImage(new Uri("images/push-pin.png", UriKind.Relative));
ovrly1.Content = img1;
ovrly1.PositionOrigin = new Point(0.0, 0.0);
img1.Opacity = 0.8;
img1.Height = 30;
img1.Width = 30;
img1.Tap += img1_Tap;
ovrly2.GeoCoordinate = new GeoCoordinate(49.35783000, -0.45425600);
img2.Source = new BitmapImage(new Uri("images/push-pin.png", UriKind.Relative));
ovrly2.Content = img2;
ovrly2.PositionOrigin = new Point(0.0, 0.0);
img2.Opacity = 0.8;
img2.Height = 30;
img2.Width = 30;
img2.Tap += img2_Tap;
}
When I try to zoom on the Button_Click the first time it works fine. But any other time I try to zoom I get an error:
private void Button_Click_1(object sender, RoutedEventArgs e)
{
map1.ZoomLevel += 1;
map1.Layers.Clear();
lyr1.Add(ovrly1); // ERROR OCCURS HERE
map1.Layers.Add(lyr1);
lyr2.Add(ovrly2);
map1.Layers.Add(lyr2);
}
This error disappears when I declare all of the images/overlays/layers 'locally' inside the Button_Click event. But I can't do that, otherwise I won't be able to access the Images outside of the method.
Any help would be greatly appreciated.
I think the problem is that you are adding many overlays on exactly same position.
Additionaly, in the Button Click event you clear the Layers element of the map, but you don't do the same with each layer, adding new elements to to the layer which already have one, each time. Since you add the elements in the same position, you get the error.
Following code should work if both elements have different GeoCoordinate values:
private void Botoia_Click(object sender, RoutedEventArgs e)
{
map1.ZoomLevel += 1;
map1.Layers.Clear();
lyr1.Clear();
lyr2.Clear();
lyr1.Add(ovrly1);
map1.Layers.Add(lyr1);
lyr2.Add(ovrly2);
map1.Layers.Add(lyr2);
}