How to remove markers cluster from google map(Ionic4) - ionic-framework

Question

How to remove markers cluster from google map(Ionic4)
part codes flow:
import * as MarkerClusterer from 'node-js-marker-clusterer';
markerCluster: MarkerClusterer;
if (this.markerCluster) {
this.markerCluster.clearMarkers();
}
this.markerCluster = this.map.addMarkerClusterSync({
markers: this.locations,
boundsDraw: false,
icons: [
{min: 2, max: 100, url: "./assets/icon/favicon.ico", anchor:
{x: 16, y: 16}}
]
});
this.markerCluster.clearMarkers(); ←this code not work

Answer 1

this is the simple way to remove all marker on google map,
this.map.clear();
this simple example found in githup
import { Component, OnInit } from '#angular/core';
import {
ToastController,
Platform,
LoadingController
} from '#ionic/angular';
import {
GoogleMaps,
GoogleMap,
GoogleMapsEvent,
Marker,
GoogleMapsAnimation,
MyLocation
} from '#ionic-native/google-maps';
#Component({
selector: 'app-home',
templateUrl: 'home.page.html',
styleUrls: ['home.page.scss'],
})
export class HomePage implements OnInit {
map: GoogleMap;
loading: any;
constructor(
public loadingCtrl: LoadingController,
public toastCtrl: ToastController,
private platform: Platform) { }
async ngOnInit() {
// Since ngOnInit() is executed before `deviceready` event,
// you have to wait the event.
await this.platform.ready();
await this.loadMap();
}
loadMap() {
this.map = GoogleMaps.create('map_canvas', {
camera: {
target: {
lat: 43.0741704,
lng: -89.3809802
},
zoom: 18,
tilt: 30
}
});
}
async onButtonClick() {
this.map.clear();
this.loading = await this.loadingCtrl.create({
message: 'Please wait...'
});
await this.loading.present();
// Get the location of you
this.map.getMyLocation().then((location: MyLocation) => {
this.loading.dismiss();
console.log(JSON.stringify(location, null ,2));
// Move the map camera to the location with animation
this.map.animateCamera({
target: location.latLng,
zoom: 17,
tilt: 30
});
// add a marker
let marker: Marker = this.map.addMarkerSync({
title: '#ionic-native/google-maps plugin!',
snippet: 'This plugin is awesome!',
position: location.latLng,
animation: GoogleMapsAnimation.BOUNCE
});
// show the infoWindow
marker.showInfoWindow();
// If clicked it, display the alert
marker.on(GoogleMapsEvent.MARKER_CLICK).subscribe(() => {
this.showToast('clicked!');
});
})
.catch(err => {
this.loading.dismiss();
this.showToast(err.error_message);
});
}
async showToast(message: string) {
let toast = await this.toastCtrl.create({
message: message,
duration: 2000,
position: 'middle'
});
toast.present();
}
}