Skip to main content Skip to footer

How to Draw a Route on C1Maps with Google API Encoded Poly

First we will create a City class, for example:

public class City
{
    public float longitude { get; set; }
    public float latitude { get; set; }     
    public string Title { get; set; }

    public override string ToString()
    {
        return $"{Title}, {latitude}X{longitude}";
    }
}

We will then create two methods, a CreateTarget method and a Create Route:

private KeyValuePair<C1.Win.Map.VectorPlacemark, C1.Win.Map.VectorPlacemark> CreateTarget(City sourceCity)
{
    // Create target point
    var place = new C1.Win.Map.VectorPlacemark
    {
        Tag = sourceCity.Title,
        Geometry = new GeoPoint(sourceCity.longitude, sourceCity.latitude),
        Marker = { Shape = MarkerShape.Custom }
    };

    var shape = new MarkerImageShape();
    shape.Image = Properties.Resources.Target;
    place.Marker.Size = new SizeF(20, 20);
    place.Marker.CustomShape = shape;

    // Create target point
    var label = new C1.Win.Map.VectorPlacemark
    {
        Geometry = new GeoPoint(sourceCity.longitude - 0.1F, sourceCity.latitude + 0.16F),
    };
    label.Marker.Caption = sourceCity.Title;
    label.Marker.LabelAngle = -90F;
    label.LabelStyle.ForeColor = Color.Yellow;

    return 
        new KeyValuePair<C1.Win.Map.VectorPlacemark, C1.Win.Map.VectorPlacemark>(place, label);
}


private C1.Win.Map.VectorPolyline CreateRoute(City startCity, City stopCity)
{
    var line = new C1.Win.Map.VectorPolyline
    {
        Geometry = new GeoLineString(new[]
        {
            new GeoPoint(startCity.longitude, startCity.latitude),
            new GeoPoint(stopCity.longitude, stopCity.latitude)
        })
    };
    return line;
}

Then finally, we will put it all together and create the map with a route to the selected target:

private void CreateRoutes()
{
    var cities = new List<City>()
    {
        new City(){ latitude = 34.87F, longitude = 137.06F, Title = "Nishio" },      //Japan
        new City(){ latitude  = 34.87F, longitude = 138.3F, Title = "Yaizu" },       //Japan
        new City(){ latitude  = 34.97F, longitude = 136.64F, Title = "Yokkaichi" },  //Japan
        new City(){ latitude  = 34.82F, longitude = 137.39F, Title = "Toyokawa" },   //Japan
        new City(){ latitude  = 35.6F, longitude = 139.7F, Title = "Tokyo" }         //Japan
    };

    // Create points for each city
    cities.ForEach(x =>
    {
        var point = CreateTarget(x);
        _cityLayer.Items.Add(point.Key);
        _cityLayer.Items.Add(point.Value);
    });

    // Create route from Toyokawa to Tokyo
    var list = cities.OrderByDescending(x => x.longitude).ToList();
    for(int index = 1; index <= list.Count() - 1; index++)
    {
        var last = list[index - 1];
        var current = list[index];

        var route = CreateRoute(last, current);
        _routeLayer.Items.Add(route);
    }

    // Zoom in items
    var items = _cityLayer.Items.Cast<C1.Win.Map.VectorItem>().ToArray();
    _mapControl.Map.ZoomToItems(items);
}