Bing Maps - removing Itinery icons

Question

Hi

I'm tryng to create a route planner to track my running routes. Using Bing Maps, I am able to create the route, but I'm struggling to remove to default 'beginning', 'end' and 'red circle' itinery icons.

Below is my code so far (based on this link). All I basically want is my own start icon at the beginning of the route and my end icon at the end. I don't need anything else in between apart from the route line.

Any help (along with code improvement tips) gratefully received!

 jQuery(function() {

    GetMap();

    $("#btnStartRoute").click(function() {
      map.AttachEvent('onclick', StartRouting);
    });
  });

  var map = null;
  var myRoute = [];
  var noOfPushPins = 0;

  function GetMap() {
    map = new VEMap('mapContent');
    map.SetCredentials("xxxxxxxxxxxxxxxxxx");
    map.LoadMap();
  }

  function StartRouting(e) {
    var xPoint = e.mapX, yPoint = e.mapY;
    var pixel = new VEPixel(xPoint, yPoint);
    var LL = map.PixelToLatLong(pixel);
    cornerOne = LL; //cornerOne is a global level var
    var latitude = map.PixelToLatLong(pixel).Latitude;
    var longitiude = map.PixelToLatLong(pixel).Longitude;
    myRoute[noOfPushPins] = new VELatLong(latitude, longitiude);
    noOfPushPins++;
    GetRoute();
  }

  function GetRoute() {
    var myRouteOptions = new VERouteOptions();
    myRouteOptions.RouteMode = VERouteMode.Walking;
    myRouteOptions.RouteColor = new VEColor(0, 102, 51, .7);
    myRouteOptions.RouteCallback = RouteCallback;
    map.GetDirections(myRoute, myRouteOptions);
  }

  function RouteCallback(route) {
    var myRouteShapes = [];
    var myRoutePoints = [];
    var points = route.RouteLegs[0].Itinerary.Items;
    $.each(points, function(i) {
      var routePointCoordinates = new VELatLong(route.RouteLegs[0].Itinerary.Items[i].LatLong.Latitude, route.RouteLegs[0].Itinerary.Items[i].LatLong.Longitude);
      var routePointShape = new VEShape(VEShapeType.Pushpin, routePointCoordinates);
      if (i != 0) {
        routePointShape.SetCustomIcon("<img id='pushPin" + noOfPushPins + "' class='pushPin' src='/Content/Images/Maps/pushPinEnd.gif'><span class='pushPinText'>" + (noOfPushPins + 1) + "</span>");

      } else {
        routePointShape.SetCustomIcon("<img id='pushPin" + noOfPushPins + "' class='pushPin' src='/Content/Images/Maps/pushPinStart.gif'><span class='pushPinText'>" + (noOfPushPins + 1) + "</span>");
      }
      myRoutePoints.push(routePointShape);
      map.Clear();
      map.DeleteRoute();
      map.AddShape(myRoutePoints);
    });
  }

Answer 1

There's an un-documented property called "Shape" on the Itinerary object. You can hide it... More info here: http://social.msdn.microsoft.com/Forums/en/vemapcontroldev/thread/430449d0-fde4-4adb-9132-248fa6f9db65