views:

461

answers:

1

Hello,

I am trying to implement a Maps API V3 and Local Search but I seem to be having problems. Somehow, the results in the OnLocalSearch() function is empty.

Here is my complete code:

<script type="text/javascript">
//<![CDATA[
$(document).ready(function() {
    // do stuff when DOM is ready
    var geocoder = new google.maps.Geocoder();
    var address = '{{string_location}}';
    var map;

    // Our global state for LocalSearch
    var gInfoWindow;
    var gSelectedResults = [];
    var gCurrentResults = [];
    var gLocalSearch = new GlocalSearch();

    if (geocoder) {
        geocoder.geocode({ 'address': address }, function (results, status) {
            if (status == google.maps.GeocoderStatus.OK) {
                //alert(results[0].geometry.location.lat())
                //alert(results[0].geometry.location.lng())

                //Create the Map and center to geocode results latlong
                var latlng = new google.maps.LatLng(results[0].geometry.location.lat(), results[0].geometry.location.lng());
                var myOptions = {
                    zoom: 14,
                    center: latlng,
                    mapTypeId: google.maps.MapTypeId.ROADMAP
                };

                map = new google.maps.Map(document.getElementById("map_canvas"),
                    myOptions);

                gLocalSearch.setSearchCompleteCallback(this, OnLocalSearch);
                gLocalSearch.execute("{{business_item.name}}");
            } 
            else {
                alert('No results found. Check console.log()');
                console.log("Geocoding address: " + address);
                console.log("Geocoding failed: " + status);
            }
        });
    }

    /*
    Other functions        
    */        
    function OnLocalSearch() {
        if (gLocalSearch.results[0]) { //This is empty. Why?
            var resultLat = gLocalSearch.results[0].lat; 
            var resultLng = gLocalSearch.results[0].lng; 
            var point = new GLatLng(resultLat,resultLng); 
            callbackFunction(point); 
        }else{ 
            alert("not found!"); 
        } 
    }
});
//]]>
</script>

FYI, I am using this as an example and I am stuck for a few hours now about this: http://gmaps-samples-v3.googlecode.com/svn-history/r136/trunk/localsearch/places.html

Any reply will be greatly appreciated.

Regards, Wenbert

UPDATE I made a mistake somewhere here:

<script src="http://www.google.com/uds/api?file=uds.js&amp;v=1.0" type="text/javascript"><;/script>
<script src="http://maps.google.com/maps/api/js?v=3.1&amp;sensor=false&amp;region=PH"&gt;&lt;/script&gt;

Also, make sure you double check the address you are geocoding. I am from the Philippines and it seems that Google only geocodes Major Roads. See http://gmaps-samples.googlecode.com/svn/trunk/mapcoverage_filtered.html

Thanks to jgeerdes from irc.geekshed.net #googleapis

+1  A: 

Just making a couple of tweaks so that the code is actually complete, and using an address I know will be geocoded successfully plus a query I know will return something, your code works. Here is what I did:

<html>
<head>
 <title>Wenbert test</title>
<script src="http://www.google.com/jsapi"&gt;&lt;/script&gt;
 <script type="text/javascript">
//<![CDATA[
google.load('jquery','1.4.2');
google.load('maps','3',{other_params:'sensor=false'});
google.load('search','1');
alert('starting...');

$(document).ready(function() {
alert('here');
    // do stuff when DOM is ready
    var geocoder = new google.maps.Geocoder();
    var address = '4019 lower beaver rd. 50310';
    var map;

    // Our global state for LocalSearch
    var gInfoWindow;
    var gSelectedResults = [];
    var gCurrentResults = [];
    var gLocalSearch = new GlocalSearch();

    if (geocoder) {
        geocoder.geocode({ 'address': address }, function (results, status) {
            if (status == google.maps.GeocoderStatus.OK) {
                //alert(results[0].geometry.location.lat())
                //alert(results[0].geometry.location.lng())

                //Create the Map and center to geocode results latlong
                var latlng = new google.maps.LatLng(results[0].geometry.location.lat(), results[0].geometry.location.lng());
                var myOptions = {
                    zoom: 14,
                    center: latlng,
                    mapTypeId: google.maps.MapTypeId.ROADMAP
                };

                map = new google.maps.Map(document.getElementById("map_canvas"),
                    myOptions);

                gLocalSearch.setSearchCompleteCallback(this, OnLocalSearch);
                gLocalSearch.execute("debra heights wesleyan church");
            } 
            else {
                alert('No results found. Check console.log()');
                console.log("Geocoding address: " + address);
                console.log("Geocoding failed: " + status);
            }
        });
    }

    /*
    Other functions        
    */        
    function OnLocalSearch() {
        if (gLocalSearch.results[0]) { //This is empty. Why?
            var resultLat = gLocalSearch.results[0].lat; 
            var resultLng = gLocalSearch.results[0].lng; 
            var point = new google.maps.LatLng(resultLat,resultLng); 
            callbackFunction(point); 
        }else{ 
            alert("not found!"); 
        } 
    }
});
//]]>
</script>
</head>
<body>
 <div id="map_canvas" style="height:100%;"></div>
</body>
</html>
jgeerdes
Thanks! Looks like I made error including the javascript in the header.
wenbert