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);
Related
I'm trying to put an image according to its geopoints. However, the image does not show up on the map. I want to make sure that when we zoom in/out the map, the image will stay in place and adjust its size based on its fixed coordinate. Do i have to insert the image in the xaml page also? Currently I'm only adding image on the cs page.
can someone tell me how to fix this? MapView is MapControl in this code.
namespace HelpMe
{
public sealed partial class MainPage : Page
{
public MainPage()
{
this.InitializeComponent();
addImage();
}
//adding image
public void addImage()
{
Image img = new Image();
img.Height = 100;
img.Width = 100;
img.Source = new BitmapImage(new Uri("ms-appx:///Assets/Unknown.jpg"));
img.RenderTransform = new CompositeTransform() { Rotation = 0 };
MapControl.SetNormalizedAnchorPoint(img, new Point(0.5, 0.5));
MapControl.SetLocation(img, new Geopoint(new BasicGeoposition() { Latitude = 0, Longitude = 0, Altitude = 0 }));
MapView.Children.Add(img);
}
}
}
What you have looks correct - you just need to add it to the .Children of the map control instance, not the page. You don't need to set a render transform. You might check that your bitmap asset is loading correctly and the BasicGeoposition you've chosen is where you want it.
Image img = new Image();
img.Height = 100;
img.Width = 100;
img.Source = new BitmapImage(new Uri("ms-appx:///Assets/YourBitmapName.jpg"));
MapControl.SetNormalizedAnchorPoint(img, new Point(0.5, 0.5));
MapControl.SetLocation(img, new Geopoint(new BasicGeoposition() { Latitude = 47, Longitude = -122, Altitude = 0 }, AltitudeReferenceSystem.Terrain));
yourMapControlInstanceName.Children.Add(img);
Note that for a simple image like this it's better to use a MapIcon. This will be higher performance and synchronize better with map movement than pinned XAML elements.
If you want an image to automatically scale as you zoom in/out, a MapBillboard is appropriate.
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.
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.
On my windows store app, im using a bings maps, and im trying to add a pushpin with an image
to do so , im doing this piece of code
Bing.Maps.Location center = new Bing.Maps.Location();
center.Latitude = 40.130066068147585;
center.Longitude = -8.338623046875;
Map.Center = center;
Map.ZoomLevel = 12D;
var pushpinLayer = new MapLayer();
pushpinLayer.Name = "PushPinLayer";
Map.Children.Add(pushpinLayer);
var location = new Location(40.130066068147585D, -8.338623046875D);
Image pinImage = new Image();
BitmapImage bitmapImage = new BitmapImage();
bitmapImage.UriSource = new Uri("ms-appx:///Assets/POI_Red_Ipad#2x.png", UriKind.RelativeOrAbsolute);
pinImage.Width = 20;
pinImage.Height = 30;
pinImage.Source = bitmapImage;
pushpinLayer.Children.Add(pinImage);
it adds the pushpin image but it appears on the top left corner of the map, i dont know how to set its position to use the localtion variable :\
Ok so you just have things a little out of order. The first part is correct:
Bing.Maps.Location center = new Bing.Maps.Location();
center.Latitude = 40.130066068147585;
center.Longitude = -8.338623046875;
Map.Center = center;
Map.ZoomLevel = 12D;
Next, instead of creating a maplayer you would instead create your pushpin image:
Image pinImage = new Image();
BitmapImage bitmapImage = new BitmapImage();
bitmapImage.UriSource = new Uri("ms-appx:///Assets/POI_Red_Ipad#2x.png", UriKind.RelativeOrAbsolute);
pinImage.Width = 20;
pinImage.Height = 30;
pinImage.Source = bitmapImage;
Then you can create your location:
var location = new Location(40.130066068147585D, -8.338623046875D);
Here is where it is different. You do not need to create an instance of the MapLayer class, instead assign the element (image in your case) and location - then add it to to the map.
MapLayer.SetPosition(pinImage, location);
Map.Children.Add(pinImage);
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);
}