天天看點

Google Maps JSAPI V3入門

在V3中,做了不少改進,下面對将做簡單扼要地介紹。

V3的特性:

    1. 不再需要API Key

    2. 指定sensor傳感器參數,檢測到使用者目前位置

    3. 針對移動裝置(IPhone裝置和Android系統)的開發

    4. 支援本地化

    5. 版本管理

<a target="_blank" href="http://code.google.com/intl/zh-CN/apis/maps/documentation/javascript/basics.html">Google Maps JSAPI V3 - 基礎知識</a>

<a target="_blank" href="http://code.google.com/intl/zh-CN/apis/maps/documentation/javascript/reference.html">Google Maps JavaScript API V3 - 參考</a>

示例程式:

<a href="http://blog.51cto.com/attachment/201107/221937148.png" target="_blank"></a>

&lt;html&gt; 

&lt;head&gt; 

&lt;title&gt;我的Google Maps入門程式&lt;/title&gt; 

&lt;META  charset="utf-8"&gt; 

&lt;script src="http://maps.google.com/maps/api/js?sensor=false" &gt;&lt;/script&gt; 

&lt;script type=text/javascript&gt; 

(function(){ 

    var map = null; 

    var level = 10; 

    var options; 

    window.init=function(){ 

/* 

    options.mapTypeId的值有 

        MapTypeId.ROADMAP:用于顯示預設的道路地圖視圖 

        MapTypeId.SATELLITE:用于顯示 Google 地球衛星圖像 

        MapTypeId.HYBRID:用于同時顯示普通視圖和衛星視圖 

        MapTypeId.TERRAIN:用于根據地形資訊顯示實際地圖 

*/ 

        options = {   

            zoom: level, 

            center: new google.maps.LatLng(39.89911190624382, 116.35516015625), 

            mapTypeId: google.maps.MapTypeId.ROADMAP, 

            mapTypeControl: true 

        }; 

        map = new google.maps.Map(document.getElementById("divMap"), options); 

    }; 

})(); 

&lt;/script&gt; 

&lt;/head&gt; 

&lt;body onload="init()"&gt; 

  &lt;div id="divMap" style="height: 400px; width:600px; border:solid 1px gray"&gt;&lt;/div&gt; 

&lt;/body&gt; 

&lt;/html&gt; 

P.S. V3讓人感覺Google徹底開放了,而且API的設計也改善了,在移動方面還需要改進,期待!

本文轉自 彭金華  51CTO部落格,原文連結:http://blog.51cto.com/pengjh/620946

繼續閱讀