Embed Google Map into HTML page based on GPS coordinates

后端未结

关注

 3  1484

I have a PHP photo gallery that reads the GPS coordinates from images. I\'d like to modify it to use the coordinates and include a google map on the photo page. Is there a sim

相关标签:

3条回答

一向

2021-01-30 12:02

Since you're using PHP, you could also use the PHP Google Map API class, which has also just been updated to use V3 of the Google Maps JS APIs.

0 讨论(0)
发布评论:

提交评论
- 加载中...
一个人的身影

2021-01-30 12:13

use static google map you have to supply just some other addition info

http://maps.google.com/maps/api/staticmap?center=51.477222,0&zoom=14&size=400x400&sensor=false

it only show an image of the map

here is a link to the API

https://developers.google.com/maps/documentation/maps-static/intro

there is a lot of other options if needed

0 讨论(0)
发布评论:

提交评论
- 加载中...

醉酒成梦

2021-01-30 12:16

The following are a few examples that you may help you getting started:

Using the Google Maps API v2:

<!DOCTYPE html>
<html> 
<head>
   <script src="http://maps.google.com/maps?file=api&amp;v=2&amp;sensor=false" 
           type="text/javascript"></script>
</head> 
<body onunload="GUnload()">
   <div id="map" style="width: 400px; height: 300px"></div> 

   <script type="text/javascript"> 
      var map = new GMap2(document.getElementById("map"));
      map.setCenter(new GLatLng(51.49, -0.12), 8);
   </script> 
</body> 
</html>

You simply need to change the latitude and longitude in the GMap2.setCenter() method. The last paramater is the zoom level.

Using the Google Maps API v3:

<!DOCTYPE html>
<html> 
<head>
   <script type="text/javascript" 
           src="http://maps.google.com/maps/api/js?sensor=false"></script>
</head> 
<body>
   <div id="map" style="width: 400px; height: 300px"></div> 

   <script type="text/javascript"> 
      var myOptions = {
         zoom: 8,
         center: new google.maps.LatLng(51.49, -0.12),
         mapTypeId: google.maps.MapTypeId.ROADMAP
      };

      var map = new google.maps.Map(document.getElementById("map"), myOptions);
   </script> 
</body> 
</html>

When using version 3 of the Maps API, you would need to pass your parameters as options to the google.maps.Map() constructor. The above example should be self explanatory.

Using the Static Map API:

<img src="https://maps.google.com/maps/api/staticmap?center=51.49,-0.12&zoom=8&size=400x300&sensor=false" style="width: 400px; height: 400px;" />

The Static Map API, as luca suggested might be a very good idea.

Simply pass the the latitude and longitude paramaters in an image tag, as in the example above. It would display the map below, directly rendered from Google:

Using the Static Maps API

0 讨论(0)