【问题标题】:google places API - restrict to return full addresses only谷歌地方 API - 限制只返回完整地址
【发布时间】:2015-06-01 22:42:38
【问题描述】:

有谁知道限制 Google Places API 只返回完整地址结果的方法 - 即具有地址前两行的结果。 我想去掉城镇,因为它们太宽了。

我看到 postcodeanywhere 只提供完整地址,但它们没有免费层。

谢谢。

【问题讨论】:

  • 嘿@paul,你找到限制它的方法了吗?

标签: google-maps google-places-api


【解决方案1】:

您已选择要从 AUTOCOMPLETE 返回的参数,即您的实例中的 street_numberroute

基本用法位于这里Google Maps JavaScript API

请记住以下几点;您的输入字段必须根据自动完成参数命名才能开箱即用,例如 street_numberroutepostal_code 等,否则 API 不会写入表单内的这些字段。

我包含的小提琴中的示例 JS:

var placeSearch;
var componentForm = {
    street_number: 'long_name',
    route: 'long_name'
};

var mapOptions = {
    center: new google.maps.LatLng(41.877461, -87.638085),
    zoom: 13,
    mapTypeId: google.maps.MapTypeId.ROADMAP,
    scrollwheel: false,
    disableDefaultUI: true,
    streetViewControl: false,
    panControl: false
};

var map = new google.maps.Map(document.getElementById('map_canvas'),
mapOptions);

var input = /** @type {HTMLInputElement} */
(
document.getElementById('field_autocomplete'));

var autocomplete = new google.maps.places.Autocomplete(input);
autocomplete.bindTo('bounds', map);

var infowindow = new google.maps.InfoWindow();

var marker = new google.maps.Marker({
    map: map,
    anchorPoint: new google.maps.Point(0, -29)
});

google.maps.event.addListener(autocomplete, 'place_changed', function () {
    infowindow.close();
    marker.setVisible(false);

    var place = autocomplete.getPlace();

    if (!place.geometry) {
        window.alert("Autocomplete's returned place contains no geometry");
        return;
    }

    // If the place has a geometry, then present it on a map.
    if (place.geometry.viewport) {
        map.fitBounds(place.geometry.viewport);
    } else {
        map.setCenter(place.geometry.location);
        map.setZoom(12); // Why 17? Because it looks good.
    }
    marker.setIcon( /** @type {google.maps.Icon} */ ({
        url: place.icon,
        size: new google.maps.Size(71, 71),
        origin: new google.maps.Point(0, 0),
        anchor: new google.maps.Point(25, 34),
        scaledSize: new google.maps.Size(50, 50)
    }));
    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(' ');
    }

    infowindow.setContent('<div id="infowindow"><strong>' + place.name + '</strong><br>' + address);
    infowindow.open(map, marker);
});

google.maps.event.addListener(autocomplete, 'place_changed', function () {
    fillInAddress();
});

function fillInAddress() {
    // Get the place details from the autocomplete object.
    var place = autocomplete.getPlace();

    for (var component in componentForm) {
        document.getElementById(component).value = '';
        document.getElementById(component).disabled = false;
    }

    // Get each component of the address from the place details
    // and fill the corresponding field on the form.
    for (var i = 0; i < place.address_components.length; i++) {
        var addressType = place.address_components[i].types[0];
        if (componentForm[addressType]) {
            var val = place.address_components[i][componentForm[addressType]];
            document.getElementById(addressType).value = val;
        }
    }
}

// Bias the autocomplete object to the user's geographical location,
// as supplied by the browser's 'navigator.geolocation' object.
function geolocate() {
    if (navigator.geolocation) {
        navigator.geolocation.getCurrentPosition(function (position) {
            var geolocation = new google.maps.LatLng(
            position.coords.latitude, position.coords.longitude);

            autocomplete.setBounds(new google.maps.LatLngBounds(geolocation, geolocation));
        });
    }
}

var componentForm 用于指定要从 API 检索的自动完成组件。

【讨论】:

  • 我试图做的是看看是否只能在自动完成中选择完整地址(即,假设您需要为包裹递送选择完整地址,应该没有选项只是选择“伦敦”)。我检查了 jsfiddle 并在被选中后隔离元素是不够的。我不认为谷歌允许这种地址隔离,这很好,因为有其他提供商。感谢您的努力和响应。
  • 这不能回答问题。
  • 很遗憾,我真的可以使用这个问题的答案,但没有找到与这个主题相关的任何其他问题。
猜你喜欢
  • 2014-05-18
  • 1970-01-01
  • 1970-01-01
  • 2012-07-06
  • 1970-01-01
  • 2015-03-22
  • 1970-01-01
  • 2017-01-10
  • 1970-01-01
相关资源
最近更新 更多