了解如何將谷歌地圖添加到網頁。
基本網頁
所有的網頁都寫在HTML。
為了演示如何將谷歌地圖添加到網頁中,我們將使用一個簡單基本的網頁:
例
<!DOCTYPE html>
<html>
<body>
<h1>My First Google Map</h1>
<div id="map">My map will go here</div>
</body>
<html>
試一試» 設置地圖大小
設置地圖的大小:
添加谷歌API
地圖的功能是由位於谷歌一個JavaScript庫提供。
JavaScript庫可以在被加載<head> HTML頁的部分。
其實你可以刪除<head>和</head>標記。
創建地圖使用JavaScript
最後補充必要的JavaScript頁面:
例
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是地圖的選項。
該中心物業通過調用獲取(倫敦)的緯度和經度google.maps. LatLng() google.maps. LatLng()
Zoom屬性設置為10(嘗試變焦實驗)
所述google.maps.Map對象與mapCanvas和的MapOptions作為參數創建。
請訪問我們的谷歌地圖API教程 。 了解更多關於谷歌地圖。