How to open google maps using simple html

All I want is simple, but I cannot find a solution. Basically, I have a list of images displayed using the ul li tag. When a user clicks on one of the elements, I want the browser to open a new tab or window and pass a specific zip code to display on the Google Maps website. How can i achieve this. I read about the Google Map API, but I think this is too much for what I want.

here is an example of my code:

 <ul> <li><a href=""><img src="image1.jpg" id="SE325JP"></a></li> <li><a href=""><img src="image1.jpg" id="NP125JL"></a></li> </ul> 
+4
source share
1 answer

You can simply send the Latitude and Longitude query string to Google Map in your href as follows:

  <!-- https://maps.google.com/?q=<lat>,<lng> --> <a href="https://maps.google.com/?q=46.860191,3.779297"> <img src="PATH TO YOUR IMAGE"/> </a> 

Or send address :

 <!-- https://maps.google.com/?q=<address> --> <a href="https://maps.google.com/?q=58250 Montaron, France"> <img src="PATH TO YOUR IMAGE"/> </a> 

There are many parameters that you can set when sending a request. For example, if you add &t=m at the end of the href link, a normal map will be displayed instead of the satellite map. Like this:

 <!-- https://maps.google.com/?q=<address> --> <a href="https://maps.google.com/?q=58250 Montaron, France&t=m"> <img src="PATH TO YOUR IMAGE"/> </a> 

For a complete list of options, see Everything you never wanted to know about Google Maps options or Query string options in Google Maps .

See jsFiddle Demo

+11
source

Source: https://habr.com/ru/post/1480144/


All Articles