Google地图自动填充功能未提供完整的搜索地址

时间:2016-09-23 03:06:25

标签: javascript google-maps-api-3 autocomplete

我正在使用带有自动填充功能的Google Maps API。

自动完成工作正在运行,但许多商家地址没有附加数字,这导致搜索问题。

示例:

Google自动填充选项:Alley Katz,O Street,Sacramento,CA,美国

应该是:Alley Katz,2019 O St,Sacramento,CA,United States

但相反它填满了Alley Katz,O Street,Sacramento,CA,美国,搜索标记位于O街上,而不是2019 O St的正确地址附近。

为什么自动填充会从地址中删除号码?我知道formatted_address参数但是如何在执行搜索后访问自动完成选项对象,然后将其传入以获取正确的目标?或者有没有办法显示完整地址的自动填充选项?

 <html>
          <head>
            <title>Simple Map</title>
            <meta name="viewport" content="initial-scale=1.0">
            <meta charset="utf-8">
            <style>
              html, body {
                height: 100%;
                margin: 0;
                padding: 0;
              }
              #map {
                height: 100%;
              }
            </style>
          </head>
          <body>
            <input type="text" id="address" placeholder="Address" /> <a href="#" onclick="searchAddress();">Search</a>
        <!DOCTYPE html>
            <div id="map"></div>
            <script>
              var map;
              function initMap() {
                map = new google.maps.Map(document.getElementById('map'), {
                  center: {lat: -34.397, lng: 150.644},
                  zoom: 8
                });
                var options = {
                    componentRestrictions: {country: "us"}
                };
                var input = document.getElementById('address');
                var autocomplete = new google.maps.places.Autocomplete(input, options);
                
                google.maps.event.addListener(autocomplete, 'place_changed', function() {
            
            var testvar = autocomplete.getPlace().formatted_address;
            var customLat = autocomplete.getPlace().geometry.location.lat();
            var customLng = autocomplete.getPlace().geometry.location.lng();
            
            console.log('testvar: ' + testvar);
            console.log(customLat);
            console.log(customLng);
        
        });
              
                
                
              }
              
              function searchAddress() {
                var address =        document.getElementById('address').value;
                console.log('start address: ' + address);
                
                geocoder.geocode( { 'address': address}, function(results, status) {

                    if (status == google.maps.GeocoderStatus.OK) {

                        search_lat = results[0].geometry.location.lat();
                        search_lng = results[0].geometry.location.lng();

                        console.log('end address coordinates: ' + search_lat + ', ' + search_lng);

                        for (var i=0; i<endMarkers.length;i++) {
                            if (i > 0) {
                                testy = i - 1;
                                endMarkers[testy].setMap(null);
                            }
                        }
                        
                            map.setCenter(end_address_marker.getPosition());

                           
                        map.setZoom(15);
                        map.setCenter(results[0].geometry.location);

                    } else {

                        

                    }

                });
                
              }
              
              
            </script>
            <script src="https://maps.googleapis.com/maps/api/js?sensor=false&callback=initMap&libraries=places"
            async defer></script>
          </body>
        </html>

0 个答案:

没有答案