17
Views
3
Comments
Need Help in adding an overlay button on maps.

Hi,

I want to add an overlay button on map, so how can I achieve that.

Thanks, in advance!

2024-11-05 11-28-22
Sunil Rajput

Hii 

   

 you can use javascript in your maps

Replace "your-google-maps-api-key" with your actual Google Maps API key.This example assumes you have the Google Maps API loaded with the  tag in the HTML file. Adjust the code as needed if you're using a different mapping library. Also, customize the map center and zoom level based on your requirements.This is a basic example, and you can further enhance it by customizing the button style, adding more interactivity, or integrating additional features based on your project's needs.



let map; function initMap() {  // Initialize the map  map = new google.maps.Map(document.getElementById('map'), {    center: { lat: 37.7749, lng: -122.4194 }, // Set your initial map center    zoom: 12, // Set your initial zoom level  });   // Add a marker for reference (optional)  const marker = new google.maps.Marker({    position: { lat: 37.7749, lng: -122.4194 },    map: map,    title: 'Marker Title',  });   // Add a click event listener to the overlay button  const overlayButton = document.getElementById('overlayButton');  overlayButton.addEventListener('click', function() {    // Handle button click, you can perform any action here    alert('Overlay button clicked!');  }); } 




    

UserImage.jpg
saikiran kasam

Hi, thank you for response @Sunil Rajput Can I also drop down on maps, Is it possible.

UserImage.jpg
Nikhil Aggarwal

@Sunil Rajput can you please share a sample oml with an overlay button on map for more clarity.

Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.