Google Maps API version 3について

2009年 5月 27日、Google I/O イベントにてGoogle Maps API JavaScript版のversion 3が発表されました。 Google Maps API version3は、既にあるGoogle Maps API version 2によく似ています。 しかし、version3 の仕組みの下では多くの変更があり、特にAndoroidベースの携帯やiPhoneのようなブラウザ上で読み込みが早くなるように設計されています。

地図の初期化処理が version2 API より 短縮されました。 Google では version 2からの追加的な機能を version3 に移行するときに、JavaScript のサイズが小さく、そして読み込みが早くなるように最適化するようです。

Google Maps version3 は 改良されたMVCフレームワーク を採用しています。 MVCオブジェクト(例:mapオブジェクト)の多くの状態変化は、settersとgetters に詳しく決められた形式で渡されます。 さらにMVCオブジェクトの全ての状態変化は、そのオブジェクトのプロパティが保存され、さらにイベントハンドラは特定の書式も全ての変化を監視します。

フィードバック


Google は version 3について、あなたのフィードバックやコメントを求めています。 特に重要性のあるモバイルブラウザ上(Android携帯やiPhoneなど)では、このAPIを取り込んでいます。Google では、モバイルデバイス上であなたのテストと、不具合を見つけたら、下記のGoogleグループにご意見を投稿することをお勧めします。


対象の読者


この文書はJavaScript プログラミング、そしてオブジェクト指向プログラミングを使う方々に向けて書かれたものです。 また、あなたもユーザの観点からのGoogle Mapsに詳しいはずです。これらは、WebにあるたくさんのJavaScript チュートリアルから入手することができます。

You should also be familiar with Google Maps from a user's point of view.
There are many JavaScript tutorials available on the Web.

この概念の資料は、手っ取り早く理解し、Google Maps APIを使ったクールなアプリケーションを開発することができるようになっています。
Google Maps API リファレンスが用意されているので、こちらもご利用ください。

  • Google Maps の 基本的な使い方
  • マップ イベント
  • マップ コントロール
  • マップ オーバーレイ
  • マップ サービス
APIのこのバージョンとそのドキュメントについてのフィードバックをお寄せください。フィードバックはGoogle Mapis JavaScript API V3グループに投稿をお願いいたします。


Sensor パラメータについて


Google Maps API の使用時には、あなたのアプリケーションはセンサー(GPSのような位置を指示する機器)を使ってユーザーの位置を決めることを必要とします。 これはモバイルデバイスのときに特に重要です。アプリケーションは、Google Maps API javascript のコードを読み込むときに、<script>タグに必須のsensorパラメータで、あなたのアプリケーションはセンサーデバイスを使用するかどうかを必ず指定しなければなりません。アプリケーションがユーザーの位置をsensorによって決定するなら、Google Maps API JavaScriptを読み込むときに、sensor=trueを指定しなければなりません。
#
# Example using sensor when loading the Maps JavaScript API
#
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true">
※注:もしあなたのデバイスはセンサーを使わないデバイスでも、あなたはこのパラメータにfalseを設定して指定をしなければなりません。

モバイルデバイス向けの開発 (iPhone と Android device)


Google Maps API Version 3 はモバイルデバイス上で、読み込みが早く、うまく動作するように設計されています。その中でも特に、私たちはiPhoneとAndroidOSが動作するようなアドバンスド・モバイルデバイスに焦点を当てて開発を行いました。

モバイルデバイスは、デスクトップ上のブラウザと比べて、とても小さな画面サイズです。さらにデバイスによって固有の特定な機能があります。(例えばiPhoneの"ピッチズーム"のような機能)。もしあなたがモバイル上でうまく動作するアプリケーションを望むのなら、私たちは以下のことをお勧めします。

  • あなたの地図の<div>コンテナのwidthheight属性を100%にするべきです。
    しかしながら、いくつかの古いデスクトップブラウザでは、これらの値とともに上手に表示されないことを知っておいてください。
  • あなたはDOMの中で、iPhoneとAndroideデバイスをnavigator.userAgentプロパティを使って検出することができます。
    function detectBrowser() {
    var useragent = navigator.userAgent;
    var mapdiv = document.getElementById("map_canvas");

    if (useragent.indexOf('iPhone') != -1 || useragent.indexOf('Android') != -1 ) {
    mapdiv.style.width = '100%';
    mapdiv.style.height = '100%';
    } else {
    mapdiv.style.width = '600px';
    mapdiv.style.height = '800px';
    }
    }
    これであなたは特定のデバイス向きにレイアウトを変更することができます。
  • iPhoneデバイスでは、以下の<meta>タグが重要です。
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
    このセッティングの指定は、フルスクリーンで表示され、ユーザーによるリサイズを行わないようにするはずです。Androidデバイス OS1.5(Cupcake)はこれらのパラメータをサポートします。

    ※注:iPhoneSafariブラウザはこの<meta>タグを必ず必要とし、ページの<head>要素に含まれなければなりません。

    iPhoneの開発には、Apple's Developer ドキュメント を参考にしてください。
    Andoroid
    デバイスの開発には、Androidドキュメントを参考にしてください。

バージョニング


現時点では、Google Maps JavaScript Version3 API の定着した1つバージョンしかないので、API JavaScriptを要求するときに、あなたはversinon パラメータを指定する必要がありません。私たちがAPIについて、さらに機能を追加したり、不具合を修正したら、APIバージョンを指定して要求するバージョニングの方法について告知するでしょう。それが起きたときは、このセクションで、APIバージョン指定の方法についての説明を、掲載します。


トラブルシューティング


もしあなたのコードが動かないように見えるときは、下記の打診をしてみると、あなたの問題の解決に役立つかもしれません。