logo标签列表

基于GPS坐标将Google地图嵌入HTML页面

phpgoogle-maps
23

我有一个 PHP 照片库，可以读取照片中的 GPS 坐标。我想修改它，使用这些坐标在照片页面上包含 Google 地图。有没有一种简单的方法，只提供这对信息就可以在 HTML 页面上显示 Google 地图呢？

谢谢。

3个回答
43
以下是一些可能帮助您入门的示例：

使用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>

您只需在 GMap2.setCenter() 方法中更改纬度和经度，最后一个参数是缩放级别。

使用 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>

在使用地图API的版本3时，您需要将参数作为选项传递给google.maps.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;" />
静态地图API，正如luca所建议的那样，可能是一个非常好的主意。
只需在图像标记中传递纬度和经度参数，就像上面的示例一样。它将直接从Google渲染并显示以下地图： 使用静态地图API
静态地图API已被弃用，不再可用。 - Cerbrus
Maps Static API正常运行，详情请见https://developers.google.com/maps/documentation/maps-static/overview - Herbert Van-Vliet
4
API链接已损坏。 - Ravi Mehta
静态地图API已被弃用，不再可用。 - Cerbrus
链接已更新，但是StaticMap似乎没有被弃用...您在哪里看到的？ - Luca Rocchi
1

由于您正在使用PHP，您还可以使用PHP Google Map API类，该类也已更新为使用Google Maps JS API的V3版本。

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接