2011-12-06 5 views
0

こんにちは、国のリストを含むドロップダウンメニューを使用しようとしています - 一度選択すると自動的にgooglemapが更新され、Googleマップv3 API - 選択/ドロップダウンに基づいて地図の場所を更新する

ユーザーがドロップダウンから 'ブラジル'を選択すると、マップはブラジルにズームインする必要があります。これについての説明やこれを説明する簡単なチュートリアルです。

geocoder = new google.maps.Geocoder(); 
    console.log(geocoder);   
    geocoder.getLatLng(
     'Brazil', 
     function(point) { 
      if (point !== null) { 
       console.log(point); 
       centre = point; 
      } 
     } 
    ); 
+0

あなたは' panToのを試したことがありますか? – minboost

答えて

2

geocoordinateの値を持つドロップダウンメニューが必要です。ドロップダウンが変更されると、Googleマップ機能が呼び出されます。マップの:(緯度経度緯度経度) `関数

<form> 
    <select class="target">  
     <option value="2,3" selected="selected">Brazil</option> 
     <option value="4,3">China</option> 
    </select> 
</form> 

のjQuery

$('.target').change(function() { 
    var coordinate = $('select option:selected').val(); 
    google_map(coordinate); 
}); 


function google_map(coordinate) { 
    var latlng = new google.maps.LatLng(coordinate); 
    var myOptions = { 
     zoom: 8, 
     center: latlng, 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
    }; 
    var map = new google.maps.Map(document.getElementById("map_canvas"), 
     myOptions); 

} 
関連する問題