Ionic Google Maps

Ionic Native
1

Hi Everybody,

i am using ion native google maps in my application. i have added a marker and a custom info window and custom events to close shown info window.

my problem is once info window is opened, i can close it but it is not shown for the second time. i have to click and move on map then marker can be shown again.

what am i doing wrong here ?

here is my method:

private addMarker(camping: any): void {
let htmlInfoWindow = new HtmlInfoWindow();
htmlInfoWindow.setBackgroundColor(’#0C0C0C’);

	let infoWindow: HTMLElement = document.createElement('div');
	htmlInfoWindow.setContent(infoWindow, { width: "160px", height: "120px" });

	infoWindow.innerHTML = '' +
		'<div class="info-box-text">' +
			'<div class="close-button">' +
				'<img src="assets/img/app/closeButton.png">' +
			'</div>' +
			'<div>' +
				'<b>' + camping.name + '</b>' +
			'</div>' +
			'<div class="buttons">' +
				'<div class="call-button action-button">' +
				(camping.contact.phone.length > 0 ? '<img src="assets/img/app/call.png">' : '') +
				'</div>' +
				'<div class="navigation-button action-button">' +
					'<img src="assets/img/app/navigation.png">' +
				'</div>' +
				'<div class="details-button action-button ">' +
				(this.fromCamping === true ? '' : '<img src="assets/img/app/details.png">') +
				'</div>' +
			'</div>' +
		'</div>' +
		'';

	infoWindow.getElementsByClassName("close-button")[0].addEventListener("click", () => {
		htmlInfoWindow.close();
	});

	infoWindow.getElementsByClassName("call-button")[0].addEventListener("click", () => {
		this.call(camping.contact.phone[0]);
	});

	infoWindow.getElementsByClassName("navigation-button")[0].addEventListener("click", () => {
		this.startNavigation(camping.address.coordinates.latitude + ',' + camping.address.coordinates.longitude);
	});

	infoWindow.getElementsByClassName("details-button")[0].addEventListener("click", () => {
		this.navController.push(CampingDetailComponent, {
			camping: camping,
			fromMap: true
		});
	});

	this.map.addMarker({
		icon: 'blue',
		position: {
			lat: camping.address.coordinates.latitude,
			lng: camping.address.coordinates.longitude
		}
	}).then((marker: Marker) => {
		marker.on(GoogleMapsEvent.MARKER_CLICK).subscribe(() => {
			htmlInfoWindow.open(marker);
		});
	});
}
2