Back

Query autocomplete

Note: This service requires your project to have an associated billing information.

Make sure to ENABLE this Places API in your google map console dashboard.
The Query Autocomplete service allows you to add geographic predictions on the fly such as "pizza near New York". It will return a

You can use query autocomplete by calling the QueryAutocomplete method of the map object like this:

 map.QueryAutocomplete(query, lat, lng, radius, callback)


query String
Required. The text string on which to search. The Places service will return candidate matches based on this string and order results based on their perceived relevance.
lat String
Optional. The latitude of the point around which you wish to retrieve place information
lng String
Optional. The longitude of the point around which you wish to retrieve place information
radius String
Optional. The distance (in meters) within which to return place results
callback Function
Required. The function where to pass the result in the sequence (error, result).

The queryautocomplete will match the whole string into the search. Example "pizza near New Yor". In order to filter the result within the specified location, pass the latitude and longitude of the center coordinate and specify the radius to limit the result in the specified area. Results outside the area may still be displayed.

Sample result "pizza near sydne"

[
  {
     "description" : "pizza near Sydney, New South Wales, Australia",
     "matched_substrings" : [
        {
           "length" : 5,
           "offset" : 0
        },
        {
           "length" : 4,
           "offset" : 6
        },
        {
           "length" : 5,
           "offset" : 11
        }
     ],
     "terms" : [
        {
           "offset" : 0,
           "value" : "pizza"
        },
        {
           "offset" : 6,
           "value" : "near"
        },
        {
           "offset" : 11,
           "value" : "Sydney"
        },
        {
           "offset" : 19,
           "value" : "New South Wales"
        },
        {
           "offset" : 36,
           "value" : "Australia"
        }
     ]
  },
  {
     "description" : "pizza near Sydney, NS, Canada",
     "matched_substrings" : [
        {
           "length" : 5,
           "offset" : 0
        },
        {
           "length" : 4,
           "offset" : 6
        },
        {
           "length" : 5,
           "offset" : 11
        }
     ],
     "terms" : [
        {
           "offset" : 0,
           "value" : "pizza"
        },
        {
           "offset" : 6,
           "value" : "near"
        },
        {
           "offset" : 11,
           "value" : "Sydney"
        },
        {
           "offset" : 19,
           "value" : "NS"
        },
        {
           "offset" : 23,
           "value" : "Canada"
        }
     ]
  },
    ...additional results ...
  {
     "description" : "Bondi Pizza, Campbell Parade, Sydney, New South Wales, Australia",
     "id" : "c478ed4e7cb075b307fdce4ad4f6c9d15cab01d7",
     "matched_substrings" : [
        {
           "length" : 5,
           "offset" : 6
        },
        {
           "length" : 5,
           "offset" : 30
        }
     ],
     "place_id" : "ChIJv0wpwp6tEmsR0Glcf5tugrk",
     "reference" : "ClRPAAAAYozD2iM3dQvDMrvrLDIALGoHO7v6pWhxn5vIm18pOyLLqToyikFov34qJoe4NnpoaLtGIWd5LWm5hOpWU1BT-SEI2jGZ8WXuDvYiFtQtjGMSEIR4thVlMws1tnNuE3hE2k0aFCqP_yHWRNSLqaP_vQFzazO-D7Hl",
     "terms" : [
        {
           "offset" : 0,
           "value" : "Bondi Pizza"
        },
        {
           "offset" : 13,
           "value" : "Campbell Parade"
        },
        {
           "offset" : 30,
           "value" : "Sydney"
        },
        {
           "offset" : 38,
           "value" : "New South Wales"
        },
        {
           "offset" : 55,
           "value" : "Australia"
        }
     ],
     "types" : [ "establishment" ]
  }
]

Make sure to check if there's an error. If error is true, then the result argument is the error message. You can get for the details of a place by calling the GetPlaceDetails method of the map object passing the place_id or description you retrieve from queryautocomplete result. If applicable, use the place_id always to query for places details.

Query autocomplete example

app.LoadPlugin("MapView");

function OnStart() {
    lay = app.CreateLayout("Linear", "VCenter, FillXY");
        
        var apiKey = "AIzaSyD2eHntKEmh272p3ac6YjWPbPkwo3m2mck";
        
        map = app.CreateMapView(apiKey, 0.9, 0.5, 7.0689323, 125.6114588, 13);
        map.SetOnReady(MapOnReady);
        lay.AddChild(map);

    app.AddLayout(lay);
}
function MapOnReady() {
    var query = "pizza near new yor";
    map.QueryAutocomplete(query, null, null, null, OnResult);
}
function OnResult(error, result) {
    if(error) {
        alert(error);
        return;
    }
    app.Alert(JSON.stringify(result));
}
Copy    Run   

Query autocomplete example

app.LoadPlugin("MapView");

function OnStart() {
    lay = app.CreateLayout("Linear", "VCenter, FillXY");
        
        var apiKey = "AIzaSyD2eHntKEmh272p3ac6YjWPbPkwo3m2mck";
        
        map = app.CreateMapView(apiKey, 0.9, 0.5, 7.0689323, 125.6114588, 13);
        map.SetOnReady(MapOnReady);
        lay.AddChild(map);

    app.AddLayout(lay);
}
function MapOnReady() {
    var query = "SM Lanang";
    map.QueryAutocomplete(query, 7.0689323, 125.6114588, 10000, OnResult);    //10km within the center
}
function OnResult(error, result) {
    if(error) {
        alert(error);
        return;
    }
    app.Alert(result);
}
Copy    Run   

Query autocomplete example

app.LoadPlugin("MapView");

function OnStart() {
    lay = app.CreateLayout("Linear", "VCenter, FillXY");
        
        var apiKey = "AIzaSyD2eHntKEmh272p3ac6YjWPbPkwo3m2mck";
        
        map = app.CreateMapView(apiKey, 0.9, 0.5, 7.0689323, 125.6114588, 13);
        map.SetOnReady(MapOnReady);
        lay.AddChild(map);

    app.AddLayout(lay);
}
function MapOnReady() {
    var query = "SM Lanang";
    map.QueryAutocomplete(query, 7.0689323, 125.6114588, 10000, OnResult);    //10km within the center
}
function OnResult(error, res) {
    if(error) {
        alert(error);
        return;
    }
    for(var i = 0; i < res.length; i++) {
        pred = res[i];
        // choosing the place_id if applicable
        q = pred.place_id ? pred.place_id : pred.description;
        
        // and find the details using default fields
        map.GetPlaceDetails(q, null, OnDetails);
    }
    map.SetZoom(8);
}
function OnDetails(error, res) {
    if(error) return;
    loc = res.geometry.location;
    map.CreateMarker(loc.lat, loc.lng);
}
Copy    Run