使用SearchBox进行Google地方搜索 - 仅限英国

时间:2016-11-14 12:34:33

标签: google-maps-api-3

我正在使用Google地方 SearchBox 非自动完成)进行地点搜索。我的目标是我想限制搜索特定国家(英国)。 我知道使用AutoComplete可以轻松实现同样的目的。但我不能使用它,因为我的地图将填充输入键以及搜索按钮。 我正在使用代码选择搜索按钮上的第一个选项。

我尝试使用 google.maps.LatLngBounds ,但这只会设置结果的优先级,而不会限制任何内容。

HTML:

 <ul class="list-unstyled search-branch">
   <li>Search branches:</li>
   <li><input type="text" placeholder="City, town or postcode" id="txtbranch" value="Eurochange" />
       <input type="button" class="button gold" id="getbranch" value="Search" />
       <div style="clear:both;"></div>
       <div class="error-message-summary" id="locationnotfound" style="padding: 0;top:-30px; position:relative; font-size:16px;display:none">
                                        No search results found.
       </div>
   </li>                                 
</ul>         

JS:

 var input = document.getElementById('txtbranch');

  var defaultBounds = new google.maps.LatLngBounds(
         new google.maps.LatLng(-33.8902, 151.1759),
         new google.maps.LatLng(-33.8474, 1512631)
   );

    var options = {
        bounds: defaultBounds
    }

    var searchBox = new google.maps.places.SearchBox(input, {
        bounds: defaultBounds
    });

 $('#getbranch').click(function () {

        var input = document.getElementById('txtbranch');
        if (BranchAddressSelector.val() == "") {
            return;
        }
        google.maps.event.trigger(input, 'focus');
        google.maps.event.trigger(input, 'keydown', { keyCode: 13 });
        return false;
    })

    searchBox.addListener('places_changed', function () {

        var places = searchBox.getPlaces()[0];
        if (typeof (places) === "undefined") {
            locationNotFoundSelector.css("display", "block");
            return false;
        }

        if (BranchAddressSelector.val() == "") {
            return false;
        }                      

        var address = places.formatted_address;

        if (typeof (address) === "undefined") {
            locationNotFoundSelector.css("display", "block");
            return false;
        }
        var latitude = places.geometry.location.lat();
        var longitude = places.geometry.location.lng();
        $.ajax({
            type: "GET",
            url: BranchLocatorUrl.GetBranches,
            data: { Latitude: latitude, longitude: longitude },
            success: function (data) {
                if (data.length > 0) {                        
                    markers = data;
                    LoadMap(0, 0);
                    BranchListSelector.html(CreateSearchHtml(markers));
                    goToByScroll("dvMap");
                    BranchListSelector.css("display", "none");
                    paginationSelector.css("display", "none");
                    $('.map-distance').css("display", "block");
                    locationNotFoundSelector.css("display", "none");                       
                    var show_per_page = 6;
                    var number_of_items = BranchListSelector.children('.BranchItem').size();
                    var number_of_pages = Math.ceil(number_of_items / show_per_page);

                    totalPages = number_of_pages;
                    $('#current_page').val(0);
                    $('#show_per_page').val(show_per_page);

                    var navigation_html = '<a class="previous_link"  style="color: #007ea0;" href="javascript:previous();">Prev</a>&nbsp;&nbsp;';
                    var current_link = 0;
                    while (number_of_pages > current_link) {
                        navigation_html += '<a class="page_link"  style="color:  #007ea0;"  href="javascript:go_to_page(' + current_link + ')" longdesc="' + current_link + '">' + (current_link + 1) + '</a>&nbsp;&nbsp;';
                        current_link++;
                    }
                    navigation_html += '<a class="next_link" style="color: #007ea0;" href="javascript:next();">  Next</a>';

                    $('#page_navigation').html(navigation_html).css("float", "right").css("display", "none");
                    $('#page_navigation .page_link:first').addClass('active_page');
                    BranchListSelector.children('.BranchItem').css('display', 'none');
                    BranchListSelector.children('.BranchItem').slice(0, show_per_page).css('display', 'block');
                    BranchListSelector.css("display", "block");
                    // paginationSelector.css("display", "block");                       
                    $('.map-distance').css("display", "none");
                    $('#moreBranch').css("display", "block");
                }
                else {
                    alert("Data not found.");
                }
            },
            error: function (e) {
                alert("Some Problem occurs.Try after some time");
                return;
            }
        });
    });

0 个答案:

没有答案