以下是一些可以帮助您入门的示例：
使用谷歌地图 API v2 http://code.google.com/apis/maps/:
<!DOCTYPE html>
<html>
<head>
<script src="http://maps.google.com/maps?file=api&v=2&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()方法。最后一个参数是缩放级别。
使用谷歌地图 API v3 http://code.google.com/apis/maps/documentation/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>
使用 Maps API 版本 3 时，您需要将参数作为选项传递给google.maps.Map()构造函数。上面的例子应该是不言自明的。
使用静态地图API http://code.google.com/apis/maps/documentation/staticmaps/:
<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 静态地图API http://code.google.com/apis/maps/documentation/staticmaps/, as 卢卡建议 https://stackoverflow.com/questions/2517736/embed-google-map-into-html-page-based-on-gps-coordinates/2517785#2517785可能是个好主意。
只需在图像标签中传递纬度和经度参数，如上例所示。它将显示下面的地图，直接从 Google 渲染：
