title: Different result between google maps Autocomplete and AutocompleteService
body: <p>I'm using google maps APIv3 AutocompleteService to fetch data to a bootstrap's typeahead. However the result a little inaccurate comparing with the result return by using the built-in autocomplete of google.</p>
  
  <p>My HTML code:</p>
  
  <pre><code>&lt;label&gt;Built-in&lt;/label&gt;&lt;input type="text" id="address1" /&gt;
  &lt;label&gt;Customize&lt;/label&gt;&lt;input type="text" id="address2" /&gt;
  </code></pre>
  
  <p>My script:</p>
  
  <pre><code>&lt;script&gt;
      //this input use google built-in autocomplete
      var input1 = document.getElementById('address1');
      autocomplete = new google.maps.places.Autocomplete(input1);
  
      //this input use google AutocompleteService
      $('#address2').typeahead({
          source: process_keyword
      });
  
      var service = new google.maps.places.AutocompleteService();
  
      function process_keyword(query, process) {
          var place_results = [];
          var request = {
              input: query,
              types: ['geocode']
          };
          service.getPlacePredictions(request, function (predictions, status) {
              process($.map(predictions, function (prediction) {
                  return prediction.description;
              }));
          });
      }
  &lt;/script&gt;
  </code></pre>
  
  <p>I've posted full code here: <a href="http://jsbin.com/ididas/1/edit" rel="nofollow">http://jsbin.com/ididas/1/edit</a></p>
  
  <p>For example when I input </p>
  
  <blockquote>
    <p>9 dinh tien hoang</p>
  </blockquote>
  
  <p>to the first box, it will display 5 results. But when i input the same query to second box, it will display only 2 results.</p>
  
  <p>My questions is why does they have this different and how can I repair so that my custom typeahead work perfectly as the built-in autocomplete</p>