【问题标题】:How to Get addresses from postalcode as like royalmail find-a-postcode如何从邮政编码中获取地址,如 Royalmail 查找邮政编码
【发布时间】:2018-02-23 05:53:29
【问题描述】:

我的问题是: 如何从邮政编码中获取地址,例如Royalmail find-a-postcode?​​p>

为此,我创建了一个演示页面并进行了大量研发,但没有受到任何批评。 您可以查看演示页面和皇家邮政网站并输入邮政编码“HA5 1AA”

http://www.gibbs-gillespie.co.uk/zipcodeaddress.html

https://www.royalmail.com/find-a-postcode

皇家邮政返回 5 个结果,而 google 只返回一个结果。

请给我解决方案或提示

谢谢

【问题讨论】:

  • 对我来说,您在这里实际问的是什么并不清楚。没有上下文。没有代码。只是邮政服务和带有链接的谷歌地图之间的模糊比较。我可以尝试提出解决方案的问题是什么?
  • zip-address-location.html:40 Uncaught TypeError: Cannot read property 'location' of undefined

标签: javascript google-maps googleplacesautocomplete


【解决方案1】:

根据您的代码和在强大的 Google Mothership 上找到的一些代码,我认为这应该有助于您继续前进。

<!doctype html>
<html xmlns='http://www.w3.org/1999/xhtml'>
    <head>
        <title>Geocode address - find Postcode</title>
        <meta charset='utf-8' />
        <style type='text/css'>
            body {
                font-family: Arial;
                font-size: 10pt;
            }
            #map {
                height: 100%;
            }
            html, body {
                height: 100vh;
                margin: 0;
                padding: 0;
            }
            #latlng {
                width: 225px;
            }
            #container{
                display:block;  
                height:500px;
                width:500px;
                margin:0 auto;
            }
            #data{
                width:100%;
                height:2rem;
                padding:1rem;
                box-sizing:border-box;
                display:block;
            }
            #txtPlaces{
                width:100%;
                box-sizing:border-box;
                padding:1rem;
                margin:0 auto 1rem auto;
            }
        </style>
        <script src='//maps.googleapis.com/maps/api/js?key=AIzaSyDsCn5YSPGtKhk3RiU2svNV5GKEEMJc84I&libraries=places'></script>
        <script type='text/javascript'>
            (function(){

                var map,infowindow,lat,lng,geocoder,data;
                var place,address,geometry,marker,content;

                function initMap() {
                    /* default location */
                    lat=53.971481395939115;
                    lng=-3.439286750000065;


                    map = new google.maps.Map(document.getElementById('map'), {
                        zoom: 5,
                        center: { lat:lat, lng:lng }
                    });
                    marker = new google.maps.Marker({
                        map: map,
                        anchorPoint: new google.maps.Point( 0, -32 )
                    });

                    content=document.getElementById('content');
                    geocoder = new google.maps.Geocoder;

                    infowindow = new google.maps.InfoWindow;
                    infowindow.setContent( content );

                    var autocomplete = new google.maps.places.Autocomplete( document.getElementById('txtPlaces') );

                    autocomplete.bindTo('bounds', map );
                    marker.setVisible( false );

                    autocomplete.addListener('place_changed', function() {
                        infowindow.close();
                        place = autocomplete.getPlace();
                        if( !place.geometry ) {
                            alert( 'Bad foo: '+place.name );
                            return false;
                        }

                        if( place.geometry.viewport ) {
                            map.fitBounds( place.geometry.viewport );
                        } else {
                            map.setCenter( place.geometry.location );
                            map.setZoom(15);
                        }
                        marker.setPosition( place.geometry.location );
                        marker.setVisible( true );

                        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 || '' ),
                                ( place.address_components[3] && place.address_components[3].short_name || '' ),
                                ( place.address_components[4] && place.address_components[4].short_name || '' ),
                                ( place.address_components[5] && place.address_components[5].short_name || '' )
                            ].join( ' ' );
                        }

                        content.children['place-icon'].src = place.icon;
                        content.children['place-name'].textContent = place.name;
                        content.children['place-address'].textContent = address;

                        infowindow.open( map, marker );
                        geocodeLatLng( geocoder );
                    });
                }

                function geocodeLatLng( geocoder ) {
                    address=document.getElementById('txtPlaces').value;
                    data = document.getElementById('data');

                    geocoder.geocode({ 'address': address }, function( results, status ) {
                        if ( status === 'OK' ) {
                            if ( results[0] ) {
                                geometry=results[0].geometry.location;
                                latlng=new google.maps.LatLng( geometry.lat(), geometry.lng() );
                                map.setZoom( 17 );
                                map.setCenter( latlng );
                                data.innerHTML=results[0].formatted_address;
                            } else {
                                window.alert('No results found');
                            }
                        } else {
                            window.alert('Geocoder failed due to: ' + status);
                        }
                    });
                }

                document.addEventListener( 'DOMContentLoaded', initMap, false );
            })();
        </script>
    </head>
    <body>
        <h1>Location:</h1>
        <div id='content'>
            <img src='' width='16' height='16' id='place-icon'>
            <span id='place-name' class='title'></span><br>
            <span id='place-address'></span>
        </div>

        <div id='container'>
            <input type='text' id='txtPlaces' placeholder='Enter a location' />
            <div id='map'></div>
            <span id='data'></span>
        </div>
    </body>
</html>

【讨论】:

  • 我错误地提到了错误的网址。网址是:gibbs-gillespie.co.uk/zipcodeaddress.html,我想要 5 个结果而不是 1 个。 google 只返回一个结果,而皇家邮件返回 5 个结果
  • 但是 PostOffice 没有使用 Google API 来提供他们的结果,因此您只能在 Google 提供的范围内工作。无论如何,对于英国来说,有一个免费提供的所有(?)英国邮政编码的数据库 - 如果您在英国进行搜索,您也许可以将其包含在内,但否则我无法想到解决办法google api 的局限性。
  • 顺便说一句:zipcodeaddress.html:173 Uncaught ReferenceError: $ is not defined
  • 您或许可以利用 PostOffice 数据 - 他们有一个 Access-Control-Allow-Origin:* 标头,因此您应该能够向它发送请求
【解决方案2】:

要像 Royal Mail 的解决方案一样添加邮政编码查找器,您需要从 PAF 解决方案提供商处获得许可。 Royal Mail 提供比 Google Places 更准确和最新的地址列表。

在英国,供应商很少;这是一个列表:https://www.poweredbypaf.com/using-our-address-data/find-a-ready-made-solution/

Ideal Postcodes 是一家提供邮政编码查询 + 附加数据集的供应商。例如,multiple residence dataset 捕获位于多个占用建筑物内的子场所,这些建筑物没有自己的公共交付点(例如,一个信箱、邮寄点等)。这就是为什么您可能会在 Royal Mail 的邮政编码查找器中看到比 Google 的解决方案更多的地址。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2020-04-21
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多