動的フォームによる逆ジオコーディング

Question

私は、HTMLフォームの2つのテキストボックスから来る緯度と経度の座標を使用して '逆ジオコーディング'サービスを使用する方法を見つけようとしています。私が何をする必要があるかわからない。

私は「Geocode」サービス（以下のコードを参照）でこれを行うことができましたが、私はちょうど誰かが、私が持っている「ジオコード」のJavaScriptをどのように適応させることができるか、 「逆ジオコーディング」サービスに転送します。

(function Geocode() { 

    // This is defining the global variables 
    var map, geocoder, myMarker; 

    window.onload = function() { 

     //This is creating the map with the desired options 
     var myOptions = { 
      zoom: 5, 
      center: new google.maps.LatLng(55.378051,-3.435973), 
      mapTypeId: google.maps.MapTypeId.ROADMAP, 
      mapTypeControl: true, 
      mapTypeControlOptions: { 
       style: google.maps.MapTypeControlStyle.HORIZONTAL_BAR, 
       position: google.maps.ControlPosition.BOTTOM 
      }, 
      navigationControl: true, 
      navigationControlOptions: { 
       style: google.maps.NavigationControlStyle.ZOOM_PAN, 
       position: google.maps.ControlPosition.TOP_RIGHT 
      }, 
      scaleControl: true, 
      scaleControlOptions: { 
       position: google.maps.ControlPosition.BOTTOM_LEFT 
      } 
     }; 

     map = new google.maps.Map(document.getElementById('map'), myOptions); 

     // This is making the link with the 'Search For Location' HTML form 
     var form = document.getElementById('SearchForLocationForm'); 

     // This is catching the forms submit event 
     form.onsubmit = function() { 

      // This is getting the Address from the HTML forms 'Address' text box 
      var address = document.getElementById('GeocodeAddress').value; 

      // This is making the Geocoder call 
      getCoordinates(address); 

      // This is preventing the form from doing a page submit 
      return false; 
     } 
    } 

    // This creates the function that will return the coordinates for the address 
    function getCoordinates(address) { 

     // This checks to see if there is already a geocoded object. If not, it creates one 
     if(!geocoder) { 
      geocoder = new google.maps.Geocoder(); 
     } 

     // This is creating a GeocoderRequest object 
     var geocoderRequest = { 
      address: address 
     } 

     // This is making the Geocode request 
     geocoder.geocode(geocoderRequest, function(results, status) { 

      // This checks to see if the Status is 'OK 'before proceeding 
      if (status == google.maps.GeocoderStatus.OK) { 

       // This centres the map on the returned location 
       map.setCenter(results[0].geometry.location); 

       // This creates a new marker and adds it to the map 
       var myMarker = new google.maps.Marker({ 
        map: map, 
        zoom: 12, 
        position: results[0].geometry.location, 
        draggable:true 
       }); 

       //This fills out the 'Latitude' and 'Longitude' text boxes on the HTML form 
       document.getElementById('Latitude').value= results[0].geometry.location.lat(); 
       document.getElementById('Longitude').value= results[0].geometry.location.lng(); 

       //This allows the marker to be draggable and tells the 'Latitude' and 'Longitude' text boxes on the HTML form to update with the new co-ordinates as the marker is dragged 
       google.maps.event.addListener(  
        myMarker,  
        'dragend',  
        function() {   
         document.getElementById('Latitude').value = myMarker.position.lat();   
         document.getElementById('Longitude').value = myMarker.position.lng(); 

         var point = myMarker.getPosition(); 
         map.panTo(point); 
        } 
       ); 
      } 
     } 
     ) 
    } 
})(); 

UPDATE

まず、あなたは親切に掲示コードと行くとGoogleドキュメントを見てする提案のための多くのおかげで。

あなたが提案したことから、私が追加のドキュメンテーションから得たものから、私は次のことを考え出しました。しかし、私がサブミットボタンをクリックしても何も起こりません。エラーメッセージは表示されません。コードを正しいフィールド名にリンクしていることを確認しましたが、すべてOKです。私はちょうどあなたが本当に誰かがそれを見てみると、私がどこに間違っているか教えてください。

多くの感謝と種類について

(function ReverseGeocode() { 

    var form, geocoderRequest, latlng, myMarker, point; 

    window.onload = function() { 

     //This is creating the map with the desired options 
     var myOptions = { 
      zoom: 5, 
      center: new google.maps.LatLng(55.378051,-3.435973), 
      mapTypeId: google.maps.MapTypeId.ROADMAP, 
      mapTypeControl: true, 
      mapTypeControlOptions: { 
       style: google.maps.MapTypeControlStyle.HORIZONTAL_BAR, 
       position: google.maps.ControlPosition.BOTTOM 
      }, 
      navigationControl: true, 
      navigationControlOptions: { 
       style: google.maps.NavigationControlStyle.ZOOM_PAN, 
       position: google.maps.ControlPosition.TOP_RIGHT 
      }, 
      scaleControl: true, 
      scaleControlOptions: { 
       position: google.maps.ControlPosition.BOTTOM_LEFT 
      } 
     }; 

     map = new google.maps.Map(document.getElementById('map'), myOptions); 

     var latlng = new google.maps.LatLng('Latitude', 'Longitude'); 

     // This is making the Geocode request 
     geocoder.geocode({'LatLng': latlng}, function(results, status) { 

      if (status == google.maps.GeocoderStatus.OK) {      
       if (results[1]) {   
        map.setZoom(11);   
        var myMarker = new google.maps.Marker({    
         position: results[0].geometry.location, 
         map: map 
        }); 
        //This fills out the 'Address' text boxe on the HTML form 
        document.getElementById('Address').value= results[0].geometry.location.latlng(); 

        var point = myMarker.getPosition(); 
        map.panTo(point); 
       } 
      } 
     } 
)}}) 

Answer 1

あなたのフォームから緯度と経度を持っていたら、あなたは（明瞭化のための出発点として、あなたの上記のコードを使用して、）このような何か：

var latlng = new google.maps.LatLng(latitudeFromForm,longitudeFromForm); 

// This is creating a GeocoderRequest object 
var geocoderRequest = { 
    'latlng':latlng 
} 

// This is making the Geocode request 
geocoder.geocode(geocoderRequest, function(results, status) { 

// This checks to see if the Status is 'OK 'before proceeding 
if (status == google.maps.GeocoderStatus.OK) { 
    // Do stuff with the result here 
} 

まだ読んでいない場合は、逆ジオコーディングセクションhttp://code.google.com/apis/maps/documentation/javascript/services.html#ReverseGeocodingをお読みください。