fix(google-maps): convert JS classes to Ionic Native (#1956)

* Update index.ts

* Update index.ts

* Add missing features, and bug fix of methods

* update: classname must be in pascal case

* remove: duplicated class definition

* export encode and spherical static classes

* Add comma

* Fix Encoding and Spherical

* Add convenience methods

* Fix decorators for Encoding and Spherical

* Update: getMap() methods return the instance of the wrapper plugin

* Update: getMap() methods return the instance of the wrapper plugin

* Remove `@CordovaInstance` decorators from getMap()

* Update: GoogleMapOptions (all fields are not optional).

* Follow up:  version `2.0.0-beta2-20170719-2226` of cordova-plugin-googlemaps

* Fix: tslint error

* Fix: tslint error

* No more isAvailable() method.

* Bug fix: description is incorrect

* Bug fix: example code was wrong.

* Bug fix: HtmlInfoWindow does not work
https://github.com/ionic-team/ionic-native/pull/1815#issuecomment-318909795

* Bug fix: HtmlInfoWindow does not work

* Bug fix: HtmlInfoWindow does not work

* Bug fix: HtmlInfoWindow does not work

* Bug fix: HtmlInfoWindow does not work

* It seems the ionViewDidLoad() is enough delayed after platform.ready()

* Bug fix: map.setDiv()

* Bug fix: HtmlInfoWindow does not work

* Bug fix: BaseArrayClass definition is incorrect

* Bug fix: BaseArrayClass constructor is wrong

* Bug fix: Geocoder class does not work

* Bug fix: LatLngBounds constructor is wrong

* update: noNotify option is not declared

* Bug fix: Geocoder.geocode() returns array of GeocoderResult

* Update: clarify acceptable parameters of BaseArrayClass

* Add: AnimateCameraOption.padding is missing

* Revert: BaseClass.empty() method does not have the noNotify option

* Add `destruct` option to the CordovaOption.

- This allows BaseClass.on() is able to pass multiple retuned values from the cordova plugin side to the event lister.

* A semicolon is mixing

* update: event names

* Update: BaseClass.addEventListener(), addEventListenerOnce(), on(), and one()

* Add: destruct option for otherPromise
Change: inside event names (must use the version 2.0.0-beta3-20170808-1950 or higher)

* Build for working group

* Bug fix: map.getCameraTarget() definition is incorrect

* Bug fix: The definition of VisibleRegion interface is incorrect

* Fix: LatLng, LatLngBounds, and PolylineOptions classes
Update: map.getVisibleRegion()

Add: VisibleRegion class

* Bug fix: the definition of map.clear() method is incorrect

* Fix: map.fromLatLngToPoint()

* Ignore the dist directory on the master branch

* Remove the dist folder on the master branch

* fixes and tweaks

* use union types for CameraPosition

fixes issue mentioned on slack by @wf9a5m75

* fix types

* update AnimateCameraOptions interface

* remove AnimateCameraOptions interface

* add MarkerCluster class

* Bug fix: Can not create an instance of BaseArrayClass

* Bug fix: the icons property of MarkerClusterOptions

* Bug fix: the zoom option is missing

https://github.com/mapsplugin/cordova-plugin-googlemaps/issues/1712

* Update index.ts

* fix: need to convert instance type from the JS class to the wrapper class

https://github.com/mapsplugin/cordova-plugin-googlemaps/issues/1706

* remove test file

* fix: Error: Illegal use of "@private" tag.

* fix: The Environment, Encode, and Spherical  are static class

* fix:  convert JS instance to the ionic instance
add: BaseClass.destroy()
add: getId() method for all instance classes

src/@ionic-native/plugins/google-maps/index.ts

@@ -1,5 +1,5 @@
 import { Injectable } from '@angular/core';
-import { Cordova, CordovaInstance, Plugin, InstanceProperty, InstanceCheck, checkAvailability, IonicNativePlugin } from '@ionic-native/core';
+import { Cordova, CordovaCheck, CordovaInstance, Plugin, InstanceProperty, InstanceCheck, checkAvailability, IonicNativePlugin } from '@ionic-native/core';
 import { Observable } from 'rxjs/Observable';
 import 'rxjs/add/observable/fromEvent';
 
@@ -224,7 +224,7 @@ export interface GeocoderResult {
   };
   locale?: string;
   locality?: string;
-  position?: { lat: number; lng: number };
+  position?: ILatLng;
   postalCode?: string;
   subAdminArea?: string;
   subLocality?: string;
@@ -374,7 +374,7 @@ export interface PolygonOptions {
   fillColor?: string;
   visible?: boolean;
   zIndex?: number;
-  addHole?: Array<Array<LatLng>>;
+  addHole?: Array<Array<ILatLng>>;
 }
 
 export interface PolylineOptions {
@@ -609,30 +609,14 @@ export const GoogleMapsMapTypeId: { [mapType: string]: MapType; } = {
   pluginName: 'GoogleMaps',
   pluginRef: 'plugin.google.maps',
   plugin: 'cordova-plugin-googlemaps',
-  repo: 'https://github.com/mapsplugin/cordova-plugin-googlemaps#multiple_maps',
+  repo: 'https://github.com/mapsplugin/cordova-plugin-googlemaps',
-  install: 'ionic cordova plugin add https://github.com/mapsplugin/cordova-plugin-googlemaps#multiple_maps --variable API_KEY_FOR_ANDROID="YOUR_ANDROID_API_KEY_IS_HERE" --variable API_KEY_FOR_IOS="YOUR_IOS_API_KEY_IS_HERE"',
+  install: 'ionic cordova plugin add https://github.com/mapsplugin/cordova-plugin-googlemaps --variable API_KEY_FOR_ANDROID="YOUR_ANDROID_API_KEY_IS_HERE" --variable API_KEY_FOR_IOS="YOUR_IOS_API_KEY_IS_HERE"',
   installVariables: ['API_KEY_FOR_ANDROID', 'API_KEY_FOR_IOS'],
   platforms: ['Android', 'iOS']
 })
 @Injectable()
 export class GoogleMaps extends IonicNativePlugin {
 
-  /**
-   * Keep a single instance of Environment in memory
-   * @hidden
-   */
-  _environment: Environment = new Environment();
-
-  /**
-   * @hidden
-   */
-  _spherical: Spherical = new Spherical();
-
-  /**
-   * @hidden
-   */
-  _encoding: Encoding = new Encoding();
-
   /**
    * Creates a new GoogleMap instance
    * @param element {string | HTMLElement} Element ID or reference to attach the map to
@@ -640,31 +624,9 @@ export class GoogleMaps extends IonicNativePlugin {
    * @return {GoogleMap}
    */
   create(element: string | HTMLElement, options?: GoogleMapOptions): GoogleMap {
-    return new GoogleMap(element, options);
+    let googleMap: GoogleMap = new GoogleMap(element, options);
-  }
+    googleMap.set('_overlays', new BaseArrayClass());
-
+    return googleMap;
-  /**
-   * Method that returns an instance of Environment class
-   * @return {Environment}
-   */
-  environment(): Environment {
-    return this._environment;
-  }
-
-  /**
-   * Method that returns an instance of Spherical class
-   * @returns {Spherical}
-   */
-  spherical(): Spherical {
-    return this._spherical;
-  }
-
-  /**
-   * Method that returns an instance of Encoding class
-   * @returns {Encoding}
-   */
-  encoding(): Encoding {
-    return this._encoding;
   }
 
 }
@@ -687,21 +649,55 @@ export class BaseClass {
    *
    * @return {Observable<any>}
    */
-  @CordovaInstance({
+  @CordovaCheck({ observable: true })
-    destruct: true,
+  addEventListener(eventName: string): Observable<any> {
-    observable: true,
+    if (!this._objectInstance) {
-    clearFunction: 'removeEventListener',
+      return new Observable((observer) => {
-    clearWithArgs: true
+        observer.error({ error: 'plugin_not_installed' });
-  })
+      });
-  addEventListener(eventName: string): Observable<any> { return; }
+    }
+
+    return new Observable((observer) => {
+       var self = this;
+       this._objectInstance.on(eventName, function() {
+          var args = Array.prototype.slice.call(arguments, 0);
+          if (args[args.length - 1] instanceof GoogleMaps.getPlugin().BaseClass) {
+            if (args[args.length - 1].type === 'Map') {
+              args[args.length - 1] = self;
+            } else {
+              args[args.length - 1] = self._objectInstance.getMap().get(args[args.length - 1].getId());
+            }
+          }
+          observer.next.call(observer, args);
+       });
+    });
+  }
 
   /**
    * Adds an event listener that works once.
    *
    * @return {Promise<any>}
    */
-  @CordovaInstance({ destruct: true })
+  @CordovaCheck()
-  addListenerOnce(eventName: string): Promise<any> { return; }
+  addListenerOnce(eventName: string): Promise<any> {
+    if (!this._objectInstance) {
+       return Promise.reject({ error: 'plugin_not_installed' });
+    }
+    var self = this;
+    return new Promise<any>((resolve) => {
+        this._objectInstance.one(eventName, function() {
+          var args = Array.prototype.slice.call(arguments, 0);
+          if (args[args.length - 1] instanceof GoogleMaps.getPlugin().BaseClass) {
+            if (args[args.length - 1].type === 'Map') {
+              args[args.length - 1] = self;
+            } else {
+              args[args.length - 1] = self._objectInstance.getMap().get(args[args.length - 1].getId());
+            }
+          }
+          resolve.call(self, args);
+      });
+    });
+  }
 
   /**
    * Gets a value
@@ -733,21 +729,55 @@ export class BaseClass {
    *
    * @return {Observable<any>}
    */
-  @CordovaInstance({
+  @CordovaCheck({ observable: true })
-    observable: true,
+  on(eventName: string): Observable<any> {
-    destruct: true,
+     if (!this._objectInstance) {
-    clearFunction: 'off',
+       return new Observable((observer) => {
-    clearWithArgs: true
+         observer.error({ error: 'plugin_not_installed' });
-  })
+       });
-  on(eventName: string): Observable<any> { return; }
+     }
+
+     return new Observable((observer) => {
+        var self = this;
+        this._objectInstance.on(eventName, function() {
+          var args = Array.prototype.slice.call(arguments, 0);
+          if (args[args.length - 1] instanceof GoogleMaps.getPlugin().BaseClass) {
+            if (args[args.length - 1].type === 'Map') {
+              args[args.length - 1] = self;
+            } else {
+              args[args.length - 1] = self._objectInstance.getMap().get(args[args.length - 1].getId());
+            }
+          }
+          observer.next.call(observer, args);
+        });
+     });
+  }
 
   /**
    * Listen to a map event only once.
    *
    * @return {Promise<any>}
    */
-  @CordovaInstance({ destruct: true })
+  @CordovaCheck()
-  one(eventName: string): Promise<any> { return; };
+  one(eventName: string): Promise<any> {
+    if (!this._objectInstance) {
+       return Promise.reject({ error: 'plugin_not_installed' });
+    }
+    var self = this;
+    return new Promise<any>((resolve) => {
+        this._objectInstance.one(eventName, function() {
+          var args = Array.prototype.slice.call(arguments, 0);
+          if (args[args.length - 1] instanceof GoogleMaps.getPlugin().BaseClass) {
+            if (args[args.length - 1].type === 'Map') {
+              args[args.length - 1] = self;
+            } else {
+              args[args.length - 1] = self._objectInstance.getMap().get(args[args.length - 1].getId());
+            }
+          }
+          resolve.call(self, args);
+      });
+    });
+  }
 
   /**
    * Clears all stored values
@@ -760,6 +790,19 @@ export class BaseClass {
    */
   @CordovaInstance({ sync: true })
   trigger(eventName: string, ...parameters: any[]): void {}
+
+
+  /**
+   * Executes off() and empty()
+   */
+  @CordovaCheck({ sync: true })
+  destroy(): void {
+    let map: GoogleMap = this._objectInstance.getMap();
+    if (map) {
+      map.get('_overlays').set(this._objectInstance.getId(), undefined);
+    }
+    this._objectInstance.remove();
+  }
 }
 
 /**
@@ -917,6 +960,13 @@ export class Circle extends BaseClass {
     this._objectInstance = _objectInstance;
   }
 
+  /**
+   * Return the ID of instance.
+   * @return {string}
+   */
+  @CordovaInstance({ sync: true })
+  getId(): string { return; }
+
   /**
    * Return the map instance.
    * @return {GoogleMap}
@@ -1058,21 +1108,28 @@ export class Circle extends BaseClass {
   pluginRef: 'plugin.google.maps.environment',
   repo: ''
 })
-export class Environment extends IonicNativePlugin {
+export class Environment {
 
   /**
-   * Get the open source software license information for Google Maps Android API v2 and Google Maps SDK for iOS.
+   * Get the open source software license information for Google Maps SDK for iOS.
    * @return {Promise<any>}
    */
-  @Cordova()
+  getLicenseInfo(): Promise<any> {
-  getLicenseInfo(): Promise<any> { return; }
+    var self = this;
+    return new Promise<any>((resolve, reject) => {
+      GoogleMaps.getPlugin().environment.getLicenseInfo((text: string) => {
+        resolve.call(self, text);
+      });
+    });
+  }
 
   /**
    * Specifies the background color of the app.
    * @param color
    */
-  @Cordova({ sync: true })
+  setBackgroundColor(color: string): void {
-  setBackgroundColor(color: string): void {}
+    GoogleMaps.getPlugin().environment.setBackgroundColor(color);
+  }
 
 }
 
@@ -1175,8 +1232,9 @@ export class Spherical {
    * @param locationB {ILatLng}
    * @return {number}
    */
-  @Cordova({ sync: true })
+  computeDistanceBetween(from: ILatLng, to: ILatLng): number {
-  computeDistanceBetween(from: ILatLng, to: ILatLng): number { return; }
+    return GoogleMaps.getPlugin().geometry.spherical.computeDistanceBetween(from, to);
+  }
 
   /**
    * Returns the LatLng resulting from moving a distance from an origin in the specified heading (expressed in degrees clockwise from north)
@@ -1185,8 +1243,9 @@ export class Spherical {
    * @param heading {number}
    * @return {LatLng}
    */
-  @Cordova({ sync: true })
+  computeOffset(from: ILatLng, distance: number, heading: number): LatLng {
-  computeOffset(from: ILatLng, distance: number, heading: number): LatLng { return; }
+    return GoogleMaps.getPlugin().geometry.spherical.computeOffset(from, distance, heading);
+  }
 
   /**
    * Returns the location of origin when provided with a LatLng destination, meters travelled and original heading. Headings are expressed in degrees clockwise from North. This function returns null when no solution is available.
@@ -1195,32 +1254,36 @@ export class Spherical {
    * @param heading {number} The heading in degrees clockwise from north.
    * @return {LatLng}
    */
-  @Cordova({ sync: true })
+  computeOffsetOrigin(to: ILatLng, distance: number, heading: number): LatLng {
-  computeOffsetOrigin(to: ILatLng, distance: number, heading: number): LatLng { return; }
+    return GoogleMaps.getPlugin().geometry.spherical.computeOffsetOrigin(to, distance, heading);
+  }
 
   /**
    * Returns the length of the given path.
    * @param path {Array<ILatLng> | BaseArrayClass<ILatLng>}
    * @return {number}
    */
-  @Cordova({ sync: true })
+  computeLength(path: Array<ILatLng> | BaseArrayClass<ILatLng>): number {
-  computeLength(path: Array<ILatLng> | BaseArrayClass<ILatLng>): number { return; }
+    return GoogleMaps.getPlugin().geometry.spherical.computeLength(path);
+  }
 
   /**
    * Returns the area of a closed path. The computed area uses the same units as the radius.
    * @param path {Array<ILatLng> | BaseArrayClass<ILatLng>}.
    * @return {number}
    */
-  @Cordova({ sync: true })
+  computeArea(path: Array<ILatLng> | BaseArrayClass<ILatLng>): number {
-  computeArea(path: Array<ILatLng> | BaseArrayClass<ILatLng>): number { return; }
+    return GoogleMaps.getPlugin().geometry.spherical.computeArea(path);
+  }
 
   /**
    * Returns the signed area of a closed path. The signed area may be used to determine the orientation of the path.
    * @param path {Array<ILatLng> | BaseArrayClass<ILatLng>}.
    * @return {number}
    */
-  @Cordova({ sync: true })
+  computeSignedArea(path: Array<ILatLng> | BaseArrayClass<ILatLng>): number {
-  computeSignedArea(path: Array<ILatLng> | BaseArrayClass<ILatLng>): number { return; }
+    return GoogleMaps.getPlugin().geometry.spherical.computeSignedArea(path);
+  }
 
   /**
    * Returns the heading from one LatLng to another LatLng. Headings are expressed in degrees clockwise from North within the range (-180,180).
@@ -1228,8 +1291,9 @@ export class Spherical {
    * @param to {ILatLng}
    * @return {number}
    */
-  @Cordova({ sync: true })
+  computeHeading(from: ILatLng, to: ILatLng): number {
-  computeHeading(from: ILatLng, to: ILatLng): number { return; }
+    return GoogleMaps.getPlugin().geometry.spherical.computeHeading(from, to);
+  }
 
   /**
    * Returns the LatLng which lies the given fraction of the way between the origin LatLng and the destination LatLng.
@@ -1238,8 +1302,9 @@ export class Spherical {
    * @param fraction {number}  A fraction of the distance to travel from 0.0 to 1.0 .
    * @return {LatLng}
    */
-  @Cordova({ sync: true })
+  interpolate(from: ILatLng, to: ILatLng, fraction: number): LatLng {
-  interpolate(from: ILatLng, to: ILatLng, fraction: number): LatLng { return; }
+    return GoogleMaps.getPlugin().geometry.spherical.interpolate(from, to, fraction);
+  }
 }
 
 /**
@@ -1417,16 +1482,40 @@ export class GoogleMap extends BaseClass {
 
   /**
    * Destroy a map completely
+   * @return {Promise<any>}
    */
-  @CordovaInstance({ sync: true })
+  @CordovaInstance()
-  remove(): void {}
+  remove(): Promise<any> {
+    let self: GoogleMap = this;
+    self.get('_overlays').forEach((overlayId: string) => {
+      self.set(overlayId, null);
+    });
+    self.get('_overlays').empty();
+    self.set('_overlays', undefined);
+    return new Promise<any>((resolve, reject) => {
+      self._objectInstance.remove(() => {
+        resolve();
+      });
+    });
+  }
 
   /**
    * Remove all overlays, such as marker
    * @return {Promise<any>}
    */
-  @CordovaInstance()
+  @CordovaCheck()
-  clear(): Promise<any> { return; }
+  clear(): Promise<any> {
+    let self: GoogleMap = this;
+    self.get('_overlays').forEach((overlayId: string) => {
+      self.set(overlayId, null);
+    });
+    self.get('_overlays').empty();
+    return new Promise<any>((resolve, reject) => {
+      self._objectInstance.clear(() => {
+        resolve();
+      });
+    });
+  }
 
   /**
    * Convert the unit from LatLng to the pixels from the left/top of the map div
@@ -1514,10 +1603,14 @@ export class GoogleMap extends BaseClass {
    */
   @InstanceCheck()
   addMarker(options: MarkerOptions): Promise<Marker | any> {
+    let self: GoogleMap = this;
     return new Promise<Marker>((resolve, reject) => {
-      this._objectInstance.addMarker(options, (marker: any) => {
+      self._objectInstance.addMarker(options, (marker: any) => {
         if (marker) {
-          resolve(new Marker(this, marker));
+          let overlay: Marker = new Marker(self, marker);
+          self.get('_overlays').push(marker.getId());
+          self.set(marker.getId(), overlay);
+          resolve(overlay);
         } else {
           reject();
         }
@@ -1527,10 +1620,14 @@ export class GoogleMap extends BaseClass {
 
   @InstanceCheck()
   addMarkerCluster(options: MarkerClusterOptions): Promise<MarkerCluster | any> {
+    let self: GoogleMap = this;
     return new Promise<MarkerCluster>((resolve, reject) => {
-      this._objectInstance.addMarkerCluster(options, (markerCluster: any) => {
+      self._objectInstance.addMarkerCluster(options, (markerCluster: any) => {
         if (markerCluster) {
-          resolve(new MarkerCluster(this, markerCluster));
+          let overlay = new MarkerCluster(self, markerCluster);
+          self.get('_overlays').push(markerCluster.getId());
+          self.set(markerCluster.getId(), overlay);
+          resolve(overlay);
         } else {
           reject();
         }
@@ -1544,10 +1641,14 @@ export class GoogleMap extends BaseClass {
    */
   @InstanceCheck()
   addCircle(options: CircleOptions): Promise<Circle | any> {
+    let self: GoogleMap = this;
     return new Promise<Circle>((resolve, reject) => {
-      this._objectInstance.addCircle(options, (circle: any) => {
+      self._objectInstance.addCircle(options, (circle: any) => {
         if (circle) {
-          resolve(new Circle(this, circle));
+          let overlay = new Circle(self, circle);
+          self.get('_overlays').push(circle.getId());
+          self.set(circle.getId(), overlay);
+          resolve(overlay);
         } else {
           reject();
         }
@@ -1561,10 +1662,14 @@ export class GoogleMap extends BaseClass {
    */
   @InstanceCheck()
   addPolygon(options: PolygonOptions): Promise<Polygon | any> {
+    let self: GoogleMap = this;
     return new Promise<Polygon>((resolve, reject) => {
-      this._objectInstance.addPolygon(options, (polygon: any) => {
+      self._objectInstance.addPolygon(options, (polygon: any) => {
         if (polygon) {
-          resolve(new Polygon(this, polygon));
+          let overlay = new Polygon(self, polygon);
+          self.get('_overlays').push(polygon.getId());
+          self.set(polygon.getId(), overlay);
+          resolve(polygon);
         } else {
           reject();
         }
@@ -1578,10 +1683,14 @@ export class GoogleMap extends BaseClass {
    */
   @InstanceCheck()
   addPolyline(options: PolylineOptions): Promise<Polyline | any> {
+    let self: GoogleMap = this;
     return new Promise<Polyline>((resolve, reject) => {
-      this._objectInstance.addPolyline(options, (polyline: any) => {
+      self._objectInstance.addPolyline(options, (polyline: any) => {
         if (polyline) {
-          resolve(new Polyline(this, polyline));
+          let overlay = new Polyline(self, polyline);
+          self.get('_overlays').push(polyline.getId());
+          self.set(polyline.getId(), overlay);
+          resolve(overlay);
         } else {
           reject();
         }
@@ -1594,10 +1703,14 @@ export class GoogleMap extends BaseClass {
    */
   @InstanceCheck()
   addTileOverlay(options: TileOverlayOptions): Promise<TileOverlay | any> {
+    let self: GoogleMap = this;
     return new Promise<TileOverlay>((resolve, reject) => {
-      this._objectInstance.addTileOverlay(options, (tileOverlay: any) => {
+      self._objectInstance.addTileOverlay(options, (tileOverlay: any) => {
         if (tileOverlay) {
-          resolve(new TileOverlay(this, tileOverlay));
+          let overlay = new TileOverlay(self, tileOverlay);
+          self.get('_overlays').push(tileOverlay.getId());
+          self.set(tileOverlay.getId(), overlay);
+          resolve(overlay);
         } else {
           reject();
         }
@@ -1610,10 +1723,14 @@ export class GoogleMap extends BaseClass {
    */
   @InstanceCheck()
   addGroundOverlay(options: GroundOverlayOptions): Promise<GroundOverlay | any> {
+    let self: GoogleMap = this;
     return new Promise<GroundOverlay>((resolve, reject) => {
-      this._objectInstance.addGroundOverlay(options, (groundOverlay: any) => {
+      self._objectInstance.addGroundOverlay(options, (groundOverlay: any) => {
         if (groundOverlay) {
-          resolve(new GroundOverlay(this, groundOverlay));
+          let overlay = new GroundOverlay(self, groundOverlay);
+          self.get('_overlays').push(groundOverlay.getId());
+          self.set(groundOverlay.getId(), overlay);
+          resolve(overlay);
         } else {
           reject();
         }
@@ -1664,6 +1781,13 @@ export class GroundOverlay extends BaseClass {
     this._objectInstance = _objectInstance;
   }
 
+  /**
+   * Return the ID of instance.
+   * @return {string}
+   */
+  @CordovaInstance({ sync: true })
+  getId(): string { return; }
+
   /**
    * Return the map instance.
    * @return {GoogleMap}
@@ -1756,9 +1880,12 @@ export class GroundOverlay extends BaseClass {
   /**
    * Remove the ground overlay
    */
-  @CordovaInstance({ sync: true })
+  @CordovaCheck()
-  remove(): void {}
+  remove(): void {
-
+    this._objectInstance.getMap().get('_overlays').set(this.getId(), undefined);
+    this._objectInstance.remove();
+    this.destroy();
+  }
 }
 
 /**
@@ -1773,10 +1900,14 @@ export class GroundOverlay extends BaseClass {
 export class HtmlInfoWindow<T> extends IonicNativePlugin {
   private _objectInstance: any;
 
-  constructor() {
+  constructor(initialData?: any) {
    super();
    if (checkAvailability(HtmlInfoWindow.getPluginRef(), null, HtmlInfoWindow.getPluginName()) === true) {
-     this._objectInstance = new (HtmlInfoWindow.getPlugin())();
+      if (initialData instanceof GoogleMaps.getPlugin().HtmlInfoWindow) {
+        this._objectInstance = initialData;
+      } else {
+        this._objectInstance = new (HtmlInfoWindow.getPlugin())();
+      }
    }
   }
 
@@ -1809,7 +1940,6 @@ export class HtmlInfoWindow<T> extends IonicNativePlugin {
 
 }
 
-
 /**
  * @hidden
  */
@@ -1828,7 +1958,7 @@ export class Marker extends BaseClass {
    * @return {string}
    */
   @CordovaInstance({ sync: true })
-  getId(): number { return; }
+  getId(): string { return; }
 
   /**
    * Return the map instance.
@@ -1934,8 +2064,12 @@ export class Marker extends BaseClass {
   /**
    * Remove the marker.
    */
-  @CordovaInstance({ sync: true })
+  @CordovaCheck()
-  remove(): void {}
+  remove(): void {
+    this._objectInstance.getMap().get('_overlays').set(this.getId(), undefined);
+    this._objectInstance.remove();
+    this.destroy();
+  }
 
   /**
    * Change the info window anchor. This defaults to 50% from the left of the image and at the bottom of the image.
@@ -2038,14 +2172,31 @@ export class MarkerCluster extends BaseClass {
     this._objectInstance = _objectInstance;
   }
 
+  /**
+   * Return the ID of instance.
+   * @return {string}
+   */
+  @CordovaInstance({ sync: true })
+  getId(): string { return; }
+
   @CordovaInstance({ sync: true })
   addMarker(marker: MarkerOptions): void {}
 
   @CordovaInstance({ sync: true })
   addMarkers(markers: MarkerOptions[]): void {}
 
-  @CordovaInstance({ sync: true })
+  @CordovaCheck()
-  remove(): void {}
+  remove(): void {
+   this._objectInstance.getMap().get('_overlays').set(this.getId(), undefined);
+   this._objectInstance.remove();
+   this.destroy();
+  }
+
+  /**
+   * Return the map instance.
+   * @return {GoogleMap}
+   */
+  getMap(): any { return this._map; }
 
 }
 
@@ -2062,6 +2213,13 @@ export class Polygon extends BaseClass {
     this._objectInstance = _objectInstance;
   }
 
+  /**
+   * Return the ID of instance.
+   * @return {string}
+   */
+  @CordovaInstance({ sync: true })
+  getId(): string { return; }
+
   /**
    * Return the map instance.
    * @return {GoogleMap}
@@ -2170,8 +2328,12 @@ export class Polygon extends BaseClass {
   /**
    * Remove the polygon.
    */
-  @CordovaInstance({ sync: true })
+  @CordovaCheck()
-  remove(): void {}
+  remove(): void {
+    this._objectInstance.getMap().get('_overlays').set(this.getId(), undefined);
+    this._objectInstance.remove();
+    this.destroy();
+  }
 
   /**
    * Change the polygon stroke width
@@ -2193,7 +2355,7 @@ export class Polygon extends BaseClass {
   setGeodesic(geodesic: boolean): void {}
 
   /**
-   * Return true if the polylgon is geodesic.
+   * Return true if the polygon is geodesic.
    * @return {boolean}
    */
   @CordovaInstance({ sync: true })
@@ -2214,6 +2376,13 @@ export class Polyline extends BaseClass {
     this._objectInstance = _objectInstance;
   }
 
+  /**
+   * Return the ID of instance.
+   * @return {string}
+   */
+  @CordovaInstance({ sync: true })
+  getId(): string { return; }
+
   /**
    * Return the map instance.
    * @return {GoogleMap}
@@ -2320,9 +2489,12 @@ export class Polyline extends BaseClass {
   /**
    * Remove the polyline
    */
-  @CordovaInstance({ sync: true })
+  @CordovaCheck()
-  remove(): void {}
+  remove(): void {
-
+    this._objectInstance.getMap().get('_overlays').set(this.getId(), undefined);
+    this._objectInstance.remove();
+    this.destroy();
+  }
 }
 
 /**
@@ -2338,6 +2510,13 @@ export class TileOverlay extends BaseClass {
     this._objectInstance = _objectInstance;
   }
 
+  /**
+   * Return the ID of instance.
+   * @return {string}
+   */
+  @CordovaInstance({ sync: true })
+  getId(): string { return; }
+
   /**
    * Return the map instance.
    * @return {GoogleMap}
@@ -2409,9 +2588,12 @@ export class TileOverlay extends BaseClass {
   /**
    * Remove the tile overlay
    */
-  @CordovaInstance({ sync: true })
+  @CordovaCheck()
-  remove(): void {}
+  remove(): void {
-
+    this._objectInstance.getMap().get('_overlays').set(this.getId(), undefined);
+    this._objectInstance.remove();
+    this.destroy();
+  }
 }
 
 // /**