title: How to reverse geocode properly with vue2-google-maps
body: <p>This is the response returned by the server : </p>
  
  <p><a href="https://i.stack.imgur.com/wXOxr.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/wXOxr.png" alt="enter image description here"></a></p>
  
  <p>Using basic reverse geocoding   provided by google</p>
  
  
  
  <pre><code>&lt;script&gt;
  
      function geocodelatLng(){
          var response = [
          {
              "address": "213 Marlon Forks\nSouth Corineland, HI 81723-1044",
              "lat": "10.30431500",
              "lng": "123.89035500"
          },
          {
              "address": "1291 Stephania Road\nLake Dorotheastad, TN 82682-76",
              "lat": "10.30309100",
              "lng": "123.89154500"
          },
          {
              "address": "20330 Schmeler Course Apt. 210\nNorth Ari, NV 70048",
              "lat": "10.30356400",
              "lng": "123.89964100"
          }
          ] ; 
  
  
  
  
          return _.map(response,coords =&gt; { 
              // console.log(arr.index);
  
              var geocoder = new google.maps.Geocoder;
  
  
              var latLng = { 
                  lat : parseFloat(coords.lat),
                  lng : parseFloat(coords.lng)
              }  ; 
  
  
          // for every lat,lng . 
          // console.log(latLng);
  
          geocoder.geocode({'location': latLng},function (results,status){ 
              if (status === 'OK') {
                  if (results[0]) {
                      console.log(results[0].formatted_address);
                  } else {
  
                      window.alert('No results found');
  
                  }
              } else {
                  window.alert('Geocoder failed due to: ' + status);
              }
  
          });  
  </code></pre>
  
  <p>});
          }</p>
  
  <p>this worked and it logs in the console 3 geocoded addresses. But when I use it with this package. It doesn't work this is my code.</p>
  
  <pre><code>  geocodedAddress(){
      let geocoder = new google.maps.Geocoder();
      let theLocations = this.locations ;
  
      return _.map(theLocations, addr =&gt; { 
  
        var geocoder = new google.maps.Geocoder();
  
        var locationss = { 
          lat : parseFloat(addr.lat),
          lng : parseFloat(addr.lng)
        }  ; 
  
      // var sampleLocation = { lat: 1.39, lng: 103.8 };
  
      return new Promise(function(resolve, reject) {
        geocoder.geocode({'location': locationss }, function(results, status){
          if (status === 'OK') {
            if (results[0]) {
              return results[0].formatted_address;
            } else {
              console.log(status);
              window.alert('No results found');
            }
          }
        })
      });
    });
  
    }
  </code></pre>
  
  <p>in my template : </p>
  
  <pre><code>   &lt;v-list-tile-content&gt;
          &lt;v-list-tile-title v-text="geocodedAddress"&gt;&lt;/v-list-tile-title&gt;
          &lt;v-list-tile-sub-title&gt;{{ address.address }}&lt;/v-list-tile-sub-title&gt;
     &lt;/v-list-tile-content&gt;
  </code></pre>
  
  <p>can you please help me what should i do with my code. Because I'm having a hard time with this . </p>