0

目标：尝试对用户输入的地址进行地理编码，然后获取信息，将其放入表单并将此信息输入数据库。

到目前为止的道路：我已经使用以下代码成功地完成了这项任务：

$(function() {
    $("#address").autocomplete({
        //This bit uses the geocoder to fetch address values
        source : function(request, response) {
            geocoder.geocode({
                'address' : request.term
            }, function(results, status) {
                response($.map(results, function(item) {
                    return {
                        label : item.formatted_address,
                        value : item.formatted_address,
                        latitude : item.geometry.location.lat(),
                        longitude : item.geometry.location.lng(),
                        streetNo : item.address_components[0].long_name,
                        streetName : item.address_components[1].long_name,
                        town : item.address_components[2].long_name,
                        province : item.address_components[4].long_name,
                        postal : item.address_components[6].long_name,
                        country : item.address_components[5].long_name
                    }

                }));
            })
        },
        //This bit is executed upon selection of an address
        select : function(event, ui) {

            //Now that an address has been selected, show the address form
            $("#newReview").show('fast');
            $("#latitude").val(ui.item.latitude);
            $("#longitude").val(ui.item.longitude);
            $("#streetNo").val(ui.item.streetNo);
            $("#streetName").val(ui.item.streetName);
            $("#streetNo").val(ui.item.streetNo);
            $("#town").val(ui.item.town);
            $("#postal").val(ui.item.postal);
            $("#province").val(ui.item.province);
            var location = new google.maps.LatLng(ui.item.latitude, ui.item.longitude);
            marker.setPosition(location);
            map.setCenter(location);

            $(".correctAddress").click(function() {
                if($(".correctAddress").val() == "yes") {
                    $("#map").hide('fast');
                };
            });

            $(".inCorrectAddress").click(function() {
                if($(".inCorrectAddress").val() == "no") {
                    $("#map").show('fast');
                };
            });
        }
    });
});

注意我只包含了执行“工作”的代码。

现在做什么：：用户可以查找地址，他们会收到自动完成建议，当他们选择地址时，会出现一个带有一些字段的“表单”，其中已经填充了地址信息。

然而，问题在于，根据最终选择的地址，信息可能并不总是匹配。

IE 1139 Ontario Rd, Welland ON, L3B 5E5, Canada 将正常工作，并且字段将正确填充，但如果用户选择“地点”或不正确的地址，例如：

Cornelia Ct, 81 Cornelia St W, Smiths Falls ON 等....

然后信息不好，因为我得到了“Cornelia Ct”这个名字，而不是应该是 81 的街道号码，因为在这种情况下：

streetNo : item.address_components[0].long_name,

该数组节点实际上是“Cornelia Ct”名称，它是地址的第一部分。

我需要做的是提取地理编码返回的“类型”，如本例所示：https ://developers.google.com/maps/documentation/geocoding/#JSON 或此链接上的信息： https://developers.google.com/maps/documentation/geocoding/#Types

这样，如果我能做到这一点，街道号码将始终是“street_number”和街道名称“路线”等......等等......，让我保持我的数据有效和统一。

我在stackoverflow上检查了这个问题：

如何从谷歌地图地理编码返回地址类型？这个答案有效，但我已经在做同样的事情了。

诚然，我几乎没有解析 JSON 的经验，但根据我所理解和迄今为止所尝试的，我认为有一种方法可以使用实际的“类型”名称而不是数组的节点号？

我尝试了各种方法，例如：

item.address_components['street_name'].long_name

和它的变化，但我似乎无法破解它。

这段代码的第二个问题是，通过询问那些特定的结果，自动完成搜索只会在你已经输入大部分内容时给你一个建议，就好像它在等待匹配所有这些字段之前猜测一样。

如果我可以在地理编码的“返回”之外使用数组，理论上它应该允许更流畅的搜索，就像我删除时一样：

streetNo : item.address_components[0].long_name,
streetName : item.address_components[1].long_name,
town : item.address_components[2].long_name,
province : item.address_components[4].long_name,
postal : item.address_components[6].long_name,

提前感谢你们的时间！

4

1 回答 1

0

我自己也解决了这个问题，这是我的解决方案。我在输入上使用了livequery，因为它可以在我的代码中隐藏/显示，但是如果您愿意，可以编辑此行以删除插件。

$("#GeneralLocation").livequery(function() {
  $(this).autocomplete({
    //This bit uses the geocoder to fetch address values
    source: function(request, response) {
      geocoder.geocode( {'address': request.term }, function(results, status) {
        response($.map(results, function(item) {
          return {
            label:  item.formatted_address,
            value: item.formatted_address,
            address_components: item.address_components,
            latitude: item.geometry.location.lat(),
            longitude: item.geometry.location.lng()
          }
        }));
      })
    },
    minLength: 3,  //only start suggestions after this many chars
    //Executed upon selection of an address
    select: function(event, ui) {

  // Inline function, Return an address field by type
  function getaddrfield(addr,type) {
    var ret = "";
    $.each(addr,function(index, c) {
      if ($.inArray(type,c.types)>=0)
        ret = c.long_name;
    });
    return(ret);
  }

      loc_suburb = getaddrfield(ui.item.address_components, "locality");
      loc_state = getaddrfield(ui.item.address_components, "administrative_area_level_1");
      loc_country = getaddrfield(ui.item.address_components, "country");
    }
});

提示是最受欢迎的，但我希望对某人有所帮助。

唐有一个美好的一天

于 2013-03-02T12:31:09.093 回答