Showing/Hiding map content with Windows Phone maps API

Article Metadata

---

Article

Created: symbianyucca (08 Nov 2012)

Last edited: hamishwillee (13 Nov 2012)

The full example for this code can be found from Windows Phone 8 Maps examples project, the code used here is implemented for example in SimpleContent example inside that project.

The WP7 codes discussed here are implemented in examples made for WP7, and can be found from Maps Examples for Windows phone wiki page.

With WP7 Bing maps API you could simply use the Visibility variable of the map object class for setting it visible or hidden as shown with following code snipped:

if (poly.Visibility == System.Windows.Visibility.Visible){
    poly.Visibility = System.Windows.Visibility.Collapsed;
}
else
{
    poly.Visibility = System.Windows.Visibility.Visible;
}

However with WP8 Maps API this generally cannot be done, only exception being the markers which with WP8 are actually just MapOverlay objects inside MapLayer. With them you could use the Visibility variable, provided that it is available for the actual object set as content for the MapOverlay.

Following example shows how this could be done with Ellipse objects used as content for MapOverlay.

if (markerLayer != null)
{
    for (var i = 0; i < markerLayer.Count(); i++)
    {
        Ellipse markker = (markerLayer[i].Content as Ellipse);
        if (markker != null)
        {
            if (markker.Visibility == System.Windows.Visibility.Visible)
            {
                markker.Visibility = System.Windows.Visibility.Collapsed;
            }
            else
            {
                markker.Visibility = System.Windows.Visibility.Visible;
            }
        }
    }
}

With polygon and polyline you would still have one option, and this would be to use the alpha channel defining the transparency factor for the color used with the map object. Note that with polygon, you do need to set the transparency for both line and the filling as shown in here:

if (poly.StrokeColor == Color.FromArgb(0xFF, 0x00, 0x00, 0xFF))
{
    poly.FillColor = Color.FromArgb(0x00, 0x00, 0xFF, 0x00);
    poly.StrokeColor = Color.FromArgb(0x00, 0x00, 0x00, 0xFF);
}
else
{
    poly.FillColor = Color.FromArgb(0x55, 0x00, 0xFF, 0x00);
    poly.StrokeColor = Color.FromArgb(0xFF, 0x00, 0x00, 0xFF);
}