An Interest In:
Web News this Week
- March 21, 2024
- March 20, 2024
- March 19, 2024
- March 18, 2024
- March 17, 2024
- March 16, 2024
- March 15, 2024
September 20, 2021 06:58 pm GMT
Original Link: https://dev.to/usaidpeerzada/adding-a-button-with-onclick-on-infowindow-google-maps-api-1ne6
Adding a button with onclick on InfoWindow - Google Maps API
InfoWindow in google maps is a type of toast div or should I say a popover that appears when we hover over the map marker, it contains information about a specific place anything you want to show in it.
Let me show you the easiest way to add a button with onclick function inside the infoWindow content string if nothing else is working or if you are trying to click on the button before the DOM is ready.
Content String:
let buttonName = "any name"; let contentString = "<div>" + // other divs .... "<button id='btn-click'>" + buttonName + "</button>" // other divs .... +"</div>";
- Adding click event on your function:
google.maps.event.addListener(infoWindow, 'domready' () => { const someButton = document.getElementById('btn-click'); if (someButton) { google.maps.listener.addDomListener(someButton, 'click', () => { // show something. // add something. }) }});
- Marker Code:
google.maps.event.addListener(marker, 'mouseover', function(){ // some code about setting content inside info window or showing up the info window however you want to show it.});
That's it, let me know if it worked :).
Original Link: https://dev.to/usaidpeerzada/adding-a-button-with-onclick-on-infowindow-google-maps-api-1ne6
Share this article:
Tweet
View Full Article
Dev To
An online community for sharing and discovering great ideas, having debates, and making friendsMore About this Source Visit Dev To