This project has moved. For the latest updates, please go here.

Drawing polyline route

Apr 21, 2015 at 9:38 AM

I'm trying to draw a route on the map by using polylines. I looked at the samples and tried to build it the same way. However the polyline isn't showing and I'm not getting any errors. I've tried many approaches but none seem to work. Here's my XAML:

        <map:Map x:Name="Map" Grid.RowSpan="2" Grid.Column="0" Grid.Row="0"
                     Canvas.ZIndex="-1" TileLayers="{StaticResource LocationTileLayers}"
                     ZoomLevel="7" Center="{StaticResource LocationBelgium}" IsDoubleTapEnabled="True"
                     ManipulationDelta="MapManipulationDelta" DoubleTapped="ZoomInDoubleTapped" MaxZoomLevel="18" MinZoomLevel="0">

            <map:MapItemsControl ItemsSource="{Binding}"
                                 ItemContainerStyle="{StaticResource PolylineItemStyle}"/>

    <Style x:Key="PolylineItemStyle" TargetType="map:MapItem">
        <Setter Property="Template">
                <ControlTemplate TargetType="map:MapItem">
                    <map:MapPolyline Locations="{Binding Locations}" Stroke="Red" StrokeThickness="3"/>
The viewmodel property:
        private LocationCollection _polylines;

        public LocationCollection Polylines
            get { return _polylines; }
            set { _polylines = value; RaisePropertyChanged(); }
The LocationCollection is instantiated by using the constructor that accepts a List<Location>. I'm sure the LocationCollection is not null and the count is larger than 0. In other words I have valid locations in the viewmodel. I'm probably missing something obvious, if I need to provide more details, feel free to ask!

Thanks for reading.
Apr 21, 2015 at 12:25 PM
Edited Apr 21, 2015 at 12:28 PM
You're apparently binding to a non-existing property Locations. Your view model property is named Polylines (which IMO is a strange name for the points (or locations) of a polyline).
Apr 21, 2015 at 12:50 PM
Right, I did bind to the wrong name (I forgot to refactor the name). However when correcting this I get an issue I've encountered many times when trying to draw the polylines. Perhaps this is the real issue I'm having:
Error: Converter failed to convert value of type 'MapControl.LocationCollection, MapControl.WinRT, Version=, Culture=neutral, PublicKeyToken=f26fcf0059638459' to type 'IEnumerable`1<MapControl.Location>'; BindingExpression: Path='Locations' DataItem='MobileNinja.ViewModel.RoutePageVM'; target element is 'MapControl.MapPolyline' (Name='null'); target property is 'Locations' (type 'IEnumerable`1<MapControl.Location>'). 
If I understand correctly the MapPolyline expects type IEnumerable<Location> but I'm binding to type LocationCollection. These both are collections (as LocationCollection inherits ObservableCollection<Location>) so I don't really see the problem. This is similar to the sample (except in the sample there is an extra wrapper class) so it should work.
Apr 21, 2015 at 2:22 PM
Edited Apr 21, 2015 at 2:26 PM
Does the Windows Store sample application run correctly on your system? Does it show the red polylines?
Apr 21, 2015 at 2:30 PM
Yes, I'm trying to implement it in Windows Phone 8.1, though. But I guess that doesn't matter because it's both WinRT. I also tried copying the part of the sample viewmodel with the hardcoded coordinates (parsed via LocationCollection.parse()) but the same error occurs.
Apr 21, 2015 at 3:04 PM
I get the same error on my phone. I'll investigate the issue.
Apr 21, 2015 at 5:36 PM
This was an issue with the declaration of the property type in the registration of the MapPolyline.Locations property, which I thought has been solved with Window 8.1 / Windows Phone 8.1. Unfortunately it still persists on Windows Phone. I've added a workaround in version 2.4.11.
Marked as answer by SolveSoul on 4/21/2015 at 11:36 PM
Apr 22, 2015 at 6:37 AM
Edited Apr 22, 2015 at 6:37 AM
Thanks for adding a workaround!