Introduction to the simple use of Google (local) Search API _javascript Tips

Source: Internet
Author: User

Spent two days to use Google's API to do such a small thing, in fact, the real implementation code is not much, more than 10 lines. The time-consuming task is to understand the functionality of each API and debug JavaScript.

Here's a brief introduction to some of the functions I've used this time.

• constructor Google.search.LocalSearch ()

This is actually the creation of a localsearch service, like other service (News, blogs, Web), is for SearchControl use. These service determines the ability of SearchControl.

• Set the Localsearch search structure type

Localsearch.setrestriction (Google.search.Search.RESTRICT_TYPE, Google.search.LocalSearch.TYPE_KMLONLY_RESULTS)

This shows that the results of the search are not business, only KML and GeoCode results

• Set the search range for Localsearch

Localsearch.setcenterpoint ("Beijing");

google.search.searcheroptions ()

Set the properties of the search Service (Searcher) to be used as a property of Searchcontrol.addsearcher () with the following options:


1. Set how the results are displayed
Searcheroptions.setexpandmode (Google.search.SearchControl.EXPAND_MODE_OPEN);

2. Set the text displayed when the file does not have search results

searcheroptions.setnoresultsstring (Google.search.SearchControl.NO_RESULTS_DEFAULT_STRING);

3. Set the location where the results are displayed

Searcheroptions.setroot (Resultcanvas);

new Google.search.DrawOptions ();

Set the way Google Search control is displayed

Drawoptions.setdrawmode (Google.search.SearchControl.DRAW_MODE_TABBED)

Set display mode to tabbed, that is, each searcher like tabs display

Drawoptions.setinput (document.getElementById ("input"));

Change the default value of the search input box to a user-defined input box


Returns the user's choice of search results as a corresponding Gresult object, such as Localsearch's Gresult is a glocalresult.

This option took me a long time to find, the reason for two, one is the use of fewer people, fewer documents. The second is that I read the English document, took a long time to see, in fact, it takes a long time to see Chinese documents, I think.

Searchcontrol.setonkeepcallback (this, localsearchkeephandler);

By the way, paste the Localsearchkeephandler code, whose argument is the Gresult object that is automatically returned.

Copy Code code as follows:

function Localsearchkeephandler (Result) {
var from = document.getElementById ("from");
Alert ("Result.tilte =" + Result.title);
From.value = processstring (Result.title);
Alert ("From.value =" + From.value);
alert (result.title);
}

Simply post this code as a whole to facilitate reading
Copy Code code as follows:

Google.load ("Search", "1", {"Language": "ZH-CN"});
function Initialize () {
Localsearch Object used to create a local search service for the maps
var localsearch = new Google.search.LocalSearch ();
Restrict the local search Resutls to KML and GeoCode results only, no business ones
Localsearch.setrestriction (Google.search.Search.RESTRICT_TYPE, Google.search.LocalSearch.TYPE_KMLONLY_RESULTS);
Set The local Search center point
Localsearch.setcenterpoint ("Beijing");
It's about local search, which are used to set where the results'll appear, a param of options
var Resultcanvas = document.getElementById ("Resultcanvas");
Options:open, Alternate Root
var searcheroptions = new Google.search.SearcherOptions ();
Show many results
Searcheroptions.setexpandmode (Google.search.SearchControl.EXPAND_MODE_OPEN);
No results message
Searcheroptions.setnoresultsstring (Google.search.SearchControl.NO_RESULTS_DEFAULT_STRING);
Options.setdrawmode (Google.search.SearchControl.DRAW_MODE_TABBED),//web, local ... in a tab show
Searcheroptions.setroot (Resultcanvas); Show the results in another place--<div id= "Resultcanvas" >
SearchControl Object used to create a search service which'll include a local search service
var SearchControl = new Google.search.SearchControl (null);
Searchcontrol.addsearcher (Localsearch, searcheroptions);
Searchcontrol.addsearcher (New Google.search.WebSearch ());
Searchcontrol.addsearcher (New Google.search.NewsSearch ());
Searchcontrol.addsearcher (New Google.search.BlogSearch ());
Draw options and set it to a tabbed view,
var drawoptions = new Google.search.DrawOptions ();
Drawoptions.setdrawmode (Google.search.SearchControl.DRAW_MODE_TABBED)
Make the SearchControl return a Result:gresult
Searchcontrol.setonkeepcallback (this, localsearchkeephandler);//keeping a search result
This option is used to set the search box position in a DOM tree.
Drawoptions.setsearchformroot (document.getElementById ("drawoptions"));
Set the input box to a user defined element
Drawoptions.setinput (document.getElementById ("input"));
Tell the search box to draw itself and tell it where to attach
Searchcontrol.draw (document.getElementById ("SearchBox"), drawoptions);//here I changed fromaddress and toaddress to Search, a new place
Another user defined input box
Drawoptions.setinput (document.getElementById ("Input2"));
Searchcontrol.draw ();
/** The codes below is about Google Ajax Map Search API
This code segment was used to add a sidebar to show the results of the search
I wonder why no ' var ' exists here
Optinos = new Object ();
Options.resultlist = Resultcanvas;
Options.resultformat = "Multi-line1";
var lsc2 = new Google.elements.LocalSearch (options);
Map.addcontrol (LSC2, New Gcontrolposition (G_anchor_top_left, New Gsize (-282,-2));
*/
}
Google.setonloadcallback (initialize);

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.