Currently, I am trying to implement zoom-in and zoom-out buttons on an OpenLayers map. I attempted to use the overlay method but encountered an error. Here is the code snippet for reference:
zoom_button = document.getElementById('zoom')
zoom_overlay = new Overlay({
element: this.zoom_button,
positioning: 'bottom-left'
});
Map.addOverlay(zoom_overlay);
<aol-control>
<aol-content>
<div id="zoom" class="zoom">
<button (click)="increaseZoom()">+</button><br>
<button (click)="decreaseZoom()">-</button><br>
</div>
</aol-content>
</aol-control>
I'm still learning about Angular and OpenLayers, could someone provide me with guidance on how to access the map property? This will allow the addOverlay method to function correctly.
Thank you!