Question: remove the polyline #47

README.md

@@ -134,7 +134,7 @@ exports.onMapReady = onMapReady;
 
 Other methods you can invoke like this from an XML-declared map are:
 `removeMarkers`, `setCenter`, `setZoomLevel`, `setViewport`, `setTilt`,
-`animateCamera`, `addPolygon` and `addPolyline`.
+`animateCamera`, `addPolygon`, `addPolyline` and `removePolylines`.
 
 Check out the usage details on the functions below.
 
@@ -401,6 +401,18 @@ Draw a polyline. Connect the points given as parameters.
   });
 ```
 
+### removePolylines (Android)
+You can either remove all polylines by not passing in an argument,
+or remove specific polyline id's (which you specified previously). 
+
+```js
+  // remove all polylines
+  mapbox.removePolylines();
+
+  // remove specific polylines by id
+  mapbox.removePolylines([1, 2]);
+```
+
 ## Offline maps
 For situations where you want the user to pre-load certain regions you can use these methods to create and remove offline regions.
 

mapbox-common.js

@@ -115,6 +115,10 @@ var Mapbox = (function (_super) {
     mapbox.addPolyline(args, this.native);
 	};
 
+	Mapbox.prototype.removePolylines = function (args) {
+    mapbox.removePolylines(args, this.native);
+	};
+
   // properties that can be set from XML
 	Object.defineProperty(Mapbox.prototype, "accessToken", {
 			set: function (value) {

mapbox.android.js

@@ -4,6 +4,7 @@ var frame = require("ui/frame");
 var fs = require("file-system");
 var mapbox = require("./mapbox-common");
 mapbox._markers = [];
+mapbox._polylines = [];
 var ACCESS_FINE_LOCATION_PERMISSION_REQUEST_CODE = 111;
 
 mapbox.locationServices = null;
@@ -174,6 +175,7 @@ mapbox.show = function(arg) {
                 // mapbox.mapboxMap.setStyleUrl(mapbox._getMapStyle(settings.style));
                 // mapbox.mapboxMap.setStyleUrl(com.mapbox.mapboxsdk.constants.Style.DARK);
 
+                mapbox._polylines = [];
                 mapbox._markers = [];
                 mapbox._addMarkers(settings.markers);
 
@@ -344,7 +346,6 @@ mapbox.removeMarkers = function (ids, nativeMap) {
 
 mapbox._removeMarkers = function (ids, nativeMap) {
   var theMap = nativeMap || mapbox;
-  var markersToRemove = [];
   for (var m in mapbox._markers) {
     var marker = mapbox._markers[m];
     if (!ids || (marker.id && ids.indexOf(marker.id) > -1)) {
@@ -412,7 +413,6 @@ mapbox._addMarkers = function(markers, nativeMap) {
         console.log("Marker icon not found, using the default instead. Requested full path: " + iconFullPath);
       }
     }
-    // marker.android = markerOptions;
     marker.android = theMap.mapboxMap.addMarker(markerOptions);
   }
 };
@@ -603,13 +603,14 @@ mapbox.addPolyline = function (arg, nativeMap) {
       }
 
       var polylineOptions = new com.mapbox.mapboxsdk.annotations.PolylineOptions();
-      polylineOptions.width(arg.width || 5); //Default width 5
-      polylineOptions.color(arg.color || 0xff000000); //Default color black
+      polylineOptions.width(arg.width || 5); // default 5
+      polylineOptions.color(arg.color || 0xff000000); // default black
       for (var p in points) {
         var point = points[p];
         polylineOptions.add(new com.mapbox.mapboxsdk.geometry.LatLng(point.lat, point.lng));
       }
-      theMap.mapboxMap.addPolyline(polylineOptions);
+      arg.android = theMap.mapboxMap.addPolyline(polylineOptions);
+      mapbox._polylines.push(arg);
       resolve();
     } catch (ex) {
       console.log("Error in mapbox.addPolyline: " + ex);
@@ -618,6 +619,24 @@ mapbox.addPolyline = function (arg, nativeMap) {
   });
 };
 
+mapbox.removePolylines = function (ids, nativeMap) {
+  return new Promise(function (resolve, reject) {
+    try {
+      var theMap = nativeMap || mapbox;
+      for (var p in mapbox._polylines) {
+        var polyline = mapbox._polylines[p];
+        if (!ids || (polyline.id && ids.indexOf(polyline.id) > -1)) {
+          theMap.mapboxMap.removePolyline(polyline.android);
+        }
+      }
+      resolve();
+    } catch (ex) {
+      console.log("Error in mapbox.removePolylines: " + ex);
+      reject(ex);
+    }
+  });
+};
+
 mapbox.getViewport = function (arg) {
   return new Promise(function (resolve, reject) {
     try {

mapbox.d.ts

@@ -22,6 +22,22 @@ declare module "nativescript-mapbox" {
       points: LatLng[];
     }
 
+    export interface AddPolylineOptions {
+      /**
+       * Set this in case you want to later pass it to 'removePolylines'.
+       */
+      id?: any;
+      /**
+       * Width of the line, default 5.
+       */
+      width?: number;
+      /**
+       * Color of the lone, default black (0xff000000).
+       */
+      color?: any;
+      points: LatLng[];
+    }
+
     export interface AddMarkersOption extends LatLng {
       /**
        * Set this in case you want to later pass it to 'removeMarker'.
@@ -217,6 +233,8 @@ declare module "nativescript-mapbox" {
     export function getTilt(): Promise<number>;
 
     export function addPolygon(arg: AddPolygonOptions): Promise<any>;
+    export function addPolyline(arg: AddPolylineOptions): Promise<any>;
+    export function removePolylines(arg?: any): Promise<any>;
 
     export function animateCamera(arg: AnimateCameraOptions): Promise<any>;
 

mapbox.ios.js

@@ -392,6 +392,20 @@ mapbox.addPolyline = function (arg, nativeMap) {
   });
 };
 
+mapbox.removePolylines = function (arg, nativeMap) {
+  return new Promise(function (resolve, reject) {
+    try {
+      // TODO
+      // var theMap = nativeMap || mapbox.mapView;
+
+      reject("not implemented for iOS (yet)");
+    } catch (ex) {
+      console.log("Error in mapbox.removePolylines: " + ex);
+      reject(ex);
+    }
+  });
+};
+
 mapbox.addPolygon = function (arg, nativeMap) {
   return new Promise(function (resolve, reject) {
     try {