2017-04-25 19 views
-1

Googleマップを検索ボックスの場所に移動するための検索ボックスをオートコンプリートに追加しようとしています。これまでのところ、なぜそれが動作していないのかを考え出すことはあまりない。Googleマップのオートコンプリート検索ボックスが機能しない

---------- HTML

<div class="input-group location" > 
     <input type="text" id="location" placeholder="Enter Location"> 
     <span class="input-group-addon"><i class="fa fa-map-marker geolocation" data-toggle="tooltip" data-placement="bottom" title="Find my position"></i></span> 
</div> 

----------あなたのコードが動作しているjavascriptの

var input = document.getElementById('#location') ; 
    var autocomplete = new google.maps.places.Autocomplete(input, { 
     types: ["geocode"] 
    }); 

    autocomplete.bindTo('bounds', map); 
    google.maps.event.addListener(autocomplete, 'place_changed', function() 
    { 
     var place = autocomplete.getPlace(); 
     if (!place.geometry) { 
      return; 
     } 
     if (place.geometry.viewport) { 
      map.fitBounds(place.geometry.viewport); 
      map.setZoom(14); 
     } else { 
      map.setCenter(place.geometry.location); 
      map.setZoom(14); 
     } 

     marker.setPosition(place.geometry.location); 
     //marker.setVisible(true); 

     var address = ''; 
     if (place.address_components) { 
      address = [ 
       (place.address_components[0] && 
       place.address_components[0].short_name || ''), 
       (place.address_components[1] && 
       place.address_components[1].short_name || ''), 
       (place.address_components[2] && 
       place.address_components[2].short_name || '') 
      ].join(' '); 
     } 
    }); 

答えて

2

、唯一の問題はですあなたが得る入力要素は、あなたが、ここにあなたの作業コードがあり、入力を取得する#タグを使用していた

Your Code

は変更する必要があります。

var input = document.getElementById('location'); //削除タグ#

関連する問題