I am facing an issue with my custom map where the markers are not aligning properly when zoomed in. Currently, I am using an overlayview as a marker and setting the center point of the marker in the file google-maps-types.ts. What I need is a way to retrieve the current zoom level and adjust the center point of the marker accordingly.
You can view a demonstration on PLUNKER. Essentially, I am looking for a solution to obtain the current zoom level in google-map-types.ts so I can dynamically change the position of the marker. Alternatively, I would like to access the position of the marker in directives/google-map.ts.
I have attempted to retrieve the zoom level in google-map-types but without success. The code snippet below demonstrates my unsuccessful attempt:
this.overlayView.getZoom = function () {
console.log(this._mapsWrapper);
google.maps.event.addDomListener(this._mapsWrapper,'zoom_changed', function(event: any) {
google.maps.event.trigger(this._mapsWrapper, "zoom_changed");
console.log(this._mapsWrapper);
var zoom = this._mapsWrapper.getZoom();
console.log(zoom);
});
}
Additionally, I am considering adjusting the top position of the overlay by adding ...px. Is there a better approach to achieve this in google-map.ts?
If anyone has insights or solutions regarding this issue, your assistance would be greatly appreciated!