Store Locator using FreeHound and Google Maps V.3

The example here gives you an overview of how to design a page to incorporate a FreeHound API along with Google Maps API in order to create a simple store locator. It does not describe the full JavaScript used, but ensures you know how to link the APIs correctly and how to set your page up to include an interactive map. Please refer to working example at the bottom of the page to see the full code.

Header

Firstly, you need to include a link to FreeHound API in header of your page:

<script type=”text/javascript” src=”http://www.ehoundplatform.com/api/1.0/proximity.js?key=xz396aw1qe432q1″></script>

Please note that you need to replace the key ‘xz396aw1qe432q1′ value with an API key provided by eHound.

Now you can include a link to Google Maps API in header of your page:

<script type=”text/javascript” src=”http://maps.google.com/maps/api/js?sensor=false&region=AU”></script>

If your data resides only in one region it is best to add the region parameter to improve the usability of search. In our example region is specified as ‘region=AU’, meaning it is restricted to Australia only. For more info refer to Region Localization

The code

For the purpose of this demo, only the FreeHound API calls will be explained here. For references to Google Maps API please view Google Maps Javascript API V3 Reference

Firstly you need to instantiate FreeHound object and specify the name of callback function. This function will be called after proximity search has been performed and will allow you to manipulate the results in appropriate manner.

freeHound = new FreeHound( ‘showLocs’ );

Now you will need to instantiate FH_Search object that will allow you to add parameters to your search.

search = new FH_Search();
search.count = 10; //number of locations to be returned in the result set
search.max_distance = 0; //distance limit for proximity search in km, 0 for unlimited 
search.point = new FH_Location( new FH_LatLon( latitude,longitude ) );

‘count’ parameter must be an integer between 1 and 100. It specifies the number of results to be returned
‘max_distance’ parameter must be a positive integer. It specifies the maximum distance for search
‘point’ parameter is an object that allows you to specify latitude and longitude coordinates of your initial search location

You can also add optional filter parameter to limit search only to specific category:

search.filters = new Array();
search.filters.push( new FH_SearchFilter(‘cat_id’, ‘eq’, ’177′) );

Note: at this stage filtering can only be done on category ID.

This will limit the search to category with ID 177. (You can find ID of the categories in your account under categories section in myHound)

You then can call the method to perform the proximity search:

freeHound.proximitySearch( search );

Now in your callback function [in this example in function showLocs(response)] you can loop through the result set returned:

function showLocs(response){
if ( response.error_code ) {
alert(response.error_message);
}

if ( response.record_set ) {
for (var record_count = 0, rl = response.record_set.length; record_count < rl; record_count++ ) {
var record = response.record_set[record_count];

…
}
}
}

Record Set Available Attributes

View Available Attributes Here

Working example

Store Locator Demo using FreeHound and Google Maps V.3

0 Comments

Hide comments

Be the first to comment.