The GoogleBar allows you to achieve similar functionality to what you would get by using the Google AJAX Search API to perform a Local Search, but provides a few advantages:
- If you just need the basic functionality, all you need is one extra command in your code: map.enableGoogleBar().
The Maps API GoogleBar options provide facilities which you can use to:
- Modify or replace the text, images, or other content of the Google Search Results
- Changing the order in which the Google Search Results appear
- Intermix Search Results from sources other than Google
- Intermix other content such that it appears to be part of the Google Search Results
- Modify, replace or otherwise disable the functioning of links
All of which would be prohibited if you were using the Google AJAX Search API.
The possible entries in the googleBarOptions are:
|showOnLoad||bool||If true, the Google Bar will be expanded when the map has loaded.|
|linkTarget||string||Use one of these string variables to control the link target pane G_GOOGLEBAR_LINK_TARGET_BLANK, G_GOOGLEBAR_LINK_TARGET_PARENT, G_GOOGLEBAR_LINK_TARGET_SELF, G_GOOGLEBAR_LINK_TARGET_TOP|
|resultList||string||Use one of these string variables to control result list suppression G_GOOGLEBAR_RESULT_LIST_INLINE, G_GOOGLEBAR_RESULT_LIST_SUPPRESS|
|suppressInitialResultSelection||bool||If true, the info window is not opened on the first result.|
|suppressZoomToBounds||bool||If true, the map does not zoom and pan to fit the results.|
|onIdleCallback||function||Function be be called when the GoogleBar finishes searching|
|onSearchCompleteCallback||function||Function to be called when the search is complete, before the reults are plotted|
|onMarkersSetCallback||function||Function to be called after the markers have been placed on the map.|
|onGenerateMarkerHtmlCallback||function||Function to be called when the info window is about to be opened on one of the results. Must return the (modified) html element object to be used for the info window contents.|
The first six options are fairly straight forward, but the callback functions need a bit of explanation:
This function is called when the GoogleBar is opened for the first time, and called again whenever the previous results are cleared. It is not called if a second search is executed without the user explicitly clearing the previous results.
No parameters are passed.
This function is called when the search is complete, before the results are plotted.
There is one parameter, a reference to a GlocalSearch object, see Official Class reference
Of particular interest is the .results array, which is an array of GlocalResult() objects, see Official Class reference
You can read that information, but also, because it’s a reference, you can modify the contents of the .result array. The .html will have already been calculated, so changing things like the .results[i].city won’t affect what gets displayed in the info window.
If you want to change the info window contents at this point, then you need to change the .results[i].html.innerHTML.
This function is called when the API has created markers corresponding to the search results.
There is one parameter, an array of anonymous Objects.
Each Object in the array has two properties, .result is a GlocalResult object and .marker is a GMarker.
This function is called whenever an info window is about to be opened.
The parameters are:
- The GMarker
- The HTMLElement which is intended to become the info window contents
- The GlocalResult
The function must return a HTMLElement which will become the actual info window contents.
Simple result filtering example
This example uses onSearchCompleteCallback to filter the search results, reducing the number of results to no more than two.
Simple info window modification
This example uses onGenerateMarkerHtmlCallback to read information from the GMarker and from the GlocalResult to modify the contents of the info window at the time that the info window is opened.
Advanced example: add ELabels
This advanced example uses all the GoogleBar Options. It displays an Elabel alongside each marker, and in order to do that it uses the callback functions like this:
onIdleCallback uses map.clearOverlays() to remove the old ELabels
onSearchCompleteCallback uses map.clearOverlays() to remove the old ELabels
onMarkersSetCallback reads the location of each GMarker and the titleNoFormatting of each GlocalResult and uses that information to create an ELabel.
onGenerateMarkerHtmlCallback hides the ELabel corresponding to the marker on which the info window is opening.