什么是谷歌地图?
Google 地图是一种 Google API
Google 字体是一种 Google API
Google Charts 是一个 Google API
了解如何将 Google 地图添加到您的网页。
我的第一个谷歌地图
从一个简单的网页开始。
在您希望地图显示的位置添加 <div> 元素,并设置地图的大小:
实例
<!DOCTYPE html>
<html>
<body>
<h1>My First Google Map</h1>
<div id="map" style="width:100%;height:400px;">My map will go here</div>
</body>
<html>
添加一个JavaScript函数来显示地图:
实例
function myMap() {
var mapCanvas =
document.getElementById("map");
var mapOptions = {
center: new google.maps.LatLng(51.5, -0.2),
zoom:
10
};
var map = new google.maps.Map(mapCanvas,
mapOptions);
}
mapCanvas 变量是地图的 HTML 元素。
mapOptions 变量定义地图的属性。
center 属性指定地图的中心位置(使用纬度和经度坐标)。
zoom 属性指定地图的缩放级别(尝试使用缩放级别)。
google.maps.Map 对象是使用 mapCanvas 和 mapOptions 作为参数创建的。
最后添加 Google API
地图的功能由位于 Google 的 JavaScript 库提供:
实例
<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_KEY&callback=myMap"></script>
亲自试一试 »
谷歌地图教程
在我们的 Google 地图教程中了解有关 Google 地图的更多信息。