Google Places API のオートコンプリートを日本国内限定のWebアプリに組み込む場合の設定

Google Places API を使うと住所の入力欄に オートコンプリート機能 を追加できますが、日本国内限定のWebアプリに組み込む場合の設定方法についてメモしておきます。 以下の設定を行います。 候補選択後に住所の先頭の「日本」を表示させない 表示させる候補を日本国内の住所に限定する これがサンプルコードです。1 <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <title>Google Places API のオートコンプリートを日本国内限定のWebアプリに組み込む場合の設定例</title> <!-- 1. region=jpを指定すると、候補選択後の「日本」が表示されなくなる --> <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?libraries=places&sensor=false&language=jp&region=jp"></script> <script> (function(window, document)) { google.maps.event.addDomListener(window, 'load', function() { var input = document.getElementById('address'); var options = { componentRestrictions: {country: 'jp'} // 2. これで日本国内の住所しか表示されなくなる }; autocomplete = new google.maps.places.Autocomplete(input, options); }); })(window, document)); </script> </head> <body> <input style="width: 300px;" id="address" type="text" placeholder="場所を入力" autocomplete="off"> </body> </html> 「region=jp」の設定は以下のURL「When invoking Google API, specify attribute “region”:…」を参考にしました...

3月 27, 2014 · Ryuji Tsutsui