Question

我正在开发一个属性搜索系统的API，我正在尝试将这些属性显示为Google地图上的标记。一切都在使用API工作正常，我得到了有效的回复，正是我正在寻找的和我期望得到的。我遇到的问题是标记。

我限制对100个属性的响应，并要求他们将信息进行地理编码。我得到了100个属性，可以遍历并列出所有属性，但我在地图上最多只能获得11个标记。根本不改变标准并再次搜索应返回相同的结果，但我得到一组不同的标记。再次搜索，我得到一个标记。

我也遇到了标记变量的问题。我在加载时将它设置为空数组，然后将每个属性的标记推送到它，但是当我控制台记录数组时，它总是为空。

这是整个javascript：

<script>
    var user    = "bac0Fmk5";
    var key     = "Vkjx5BV8VeYOxAixFD";
    var secret  = "CU5g6wQR2ZJV7";

    var markers = [];

$(document).ready(function(){
    var map = new google.maps.Map(document.getElementById('map'), {
      zoom: 10,
      center: new google.maps.LatLng(30.1767, -85.8056),
      mapTypeId: google.maps.MapTypeId.ROADMAP
    }); 

    var geocoder =  new google.maps.Geocoder();

    var infowindow =  new google.maps.InfoWindow({
        content: ''
    });

    $('#search_btn').click(function(){
        clearOverlays();

        $.ajax({
            type: 'POST',
            dataType: "json",
            async: false,
            url: "api/ex.api.php",
            data: {
                user:           user,
                key:            key,
                secret:         secret,
                area:           $('#area').val(),
                category:       $('#type').val(),
                min_price:      $('#min_price').val(),
                max_price:      $('#max_price').val(),
                bedrooms:       $('#bedrooms').val(),
                bathrooms:      $('#bathrooms').val(),
                subdivision:    $('#subdivision').val(),
                city:           $('#city').val(),
                mls_acct:       $('#mls_acct').val()
            },
            success: function (responseData, textStatus, jqXHR) {
                // console.log(responseData);
                // console.log(jqXHR);
                $.each(jqXHR.responseJSON, function(i, e){
                    //console.log(e.mls_acct);

                    geocoder.geocode( { 'address': e.street_num+' '+e.street_name+' '+e.city+','+e.state+' '+e.zip}, function(results, status) {
                          if (status == google.maps.GeocoderStatus.OK) {
                            // console.log("location : " + results[0].geometry.location.lat() + " " +results[0].geometry.location.lng()); 
                            var lat = results[0].geometry.location.lat();
                            var lng = results[0].geometry.location.lng();
                            //window.locs.push([lat, lng]);

                            if(e.street_num == '' || e.street_name == '' || e.city == '' || e.state == '' || e.zip == '')
                            {
                                console.log('got a dead one');
                            }

                            marker = new google.maps.Marker({
                                position: new google.maps.LatLng(lat, lng),
                                map: map
                            });
                            markers.push(marker);

                            bindInfoWindow(marker, map, infowindow, "<div><h2>"+e.mls_acct+"</h2></div>");
                        }
                    });
                });
            },
            error: function (responseData, textStatus, errorThrown) {
                console.log('Response Data: ' + responseData);
                console.log('Status: ' + textStatus);
                console.log('Error Thrown: ' + errorThrown);
            }
        });

        return false;
    });
});

function bindInfoWindow(marker, map, infowindow, html) {
    google.maps.event.addListener(marker, 'click', function() {
        infowindow.setContent(html);
        infowindow.open(map, marker);
    });
}

function clearOverlays() {
  for (var i = 0; i < markers.length; i++ ) {
    markers[i].setMap(null);
  }
  markers.length = 0;
}
</script>

Answer 1

当它不是“OK”时，你默默地忽略了GeocoderStatus。您可能正在获得OVER_QUERY_LIMIT响应。添加提醒，至少让你知道它失败的原因：

                geocoder.geocode( { 'address': e.street_num+' '+e.street_name+' '+e.city+','+e.state+' '+e.zip}, function(results, status) {
                      if (status == google.maps.GeocoderStatus.OK) {
                        // console.log("location : " + results[0].geometry.location.lat() + " " +results[0].geometry.location.lng()); 
                        var lat = results[0].geometry.location.lat();
                        var lng = results[0].geometry.location.lng();
                        //window.locs.push([lat, lng]);

                        if(e.street_num == '' || e.street_name == '' || e.city == '' || e.state == '' || e.zip == '')
                        {
                            console.log('got a dead one');
                        }

                        marker = new google.maps.Marker({
                            position: new google.maps.LatLng(lat, lng),
                            map: map
                        });
                        markers.push(marker);

                        bindInfoWindow(marker, map, infowindow, "<div><h2>"+e.mls_acct+"</h2></div>");
                    } else alert("Geocode failed, status="+status);
                });

Google Maps API不显示所有标记

1 个答案: