Google (Local) Search API的簡單使用介紹_javascript技巧

花了兩天的時間來用Google的API來做這麼一個小東西，其實真正的實作程式碼不是很多，十幾行而已。花時間的工作是了解各個API的功能以及調試JavaScript。

下面簡單介紹一下這次我用到的幾個函數吧。

•建構子google.search.LocalSearch()

這其實是建立了一個LocalSearch的Service，這個Service和其他Service（News, Blog, Web）一樣，都是供SearchControl使用的。這些Service決定了SearchControl的能力。

•設定LocalSearch的搜尋結構類型

localSearch.setRestriction(google.search.Search.RESTRICT_TYPE, google.search.LocalSearch.TYPE_KMLONLY_RESULTS)

這表示搜尋的結果沒有business的結果，只有kml和geocode結果

•設定LocalSearch的搜尋範圍

localSearch.setCenterPoint("北京");

•google.search.SearcherOptions()

設定Search Service(Searcher)的屬性，作為SearchControl.addSearcher()的一個屬性使用，有以下選項可以選擇：

1.設定結果的顯示方式
•searcherOptions.setExpandMode(google.search.SearchControl.EXPAND_MODE_OPEN);

2.  設定檔沒有搜尋結果時顯示的文字

•  searcherOptions.setNoResultsString(google.search.SearchControl.NO_RESULTS_DEFAULT_STRING);

3.  設定結果顯示的位置

•searcherOptions.setRoot(resultCanvas);

•new google.search.DrawOptions();

設定Google Search Control的顯示方式

•drawOptions.setDrawMode(google.search.SearchControl.DRAW_MODE_TABBED)

設定顯示方式為tabbed方式，即各個Searcher像tabs一樣顯示

•drawOptions.setInput(document.getElementById("input"));

將搜尋輸入框的預設值改為使用者自訂的一個輸入框

將使用者選擇搜尋結果作為一個對應的GResult物件傳回，如LocalSearch的GResult就是一個GLocalResult。

這個選項費了我很久才找到，原因有二，一是用的人少，文檔少。二是我看的英文文檔，花了蠻長時間才看明白，其實看中文文檔要花的時間更長，我覺得。

•searchControl.setOnKeepCallback(this, LocalSearchKeepHandler);

順便貼上LocalSearchKeepHandler的程式碼，其參數為自動傳回的那個GResult物件。

複製程式碼 程式碼如下:

function LocalultKeepdler;(>

function LocalultKeepdler,(result) {

function LocalultKeepdler(result) document.getElementById("from");
  alert("result.tilte = " result.title);
  from.value = ProcessString(result.title);
  from.value = ProcessString(result.title);

  from.value = ProcessString(result.title);
  from.value = ProcessString(result.title);
  alert("from.value. from.value);

 // alert(result.title); }乾脆將這段程式碼整體貼出，方便閱讀

複製程式碼 程式碼如下:

google.load("search", "1", {"language": "zh-CN"});
 functioninitialize() {
     //用於建立LocalSearch 物件地圖的本地搜尋服務
        var localSearch = new google.search.LocalSearch(); 
        // 將本地搜尋結果限制為僅限KML 和地理編碼結果，包含業務      本地搜尋的，用於設定結果出現的位置，一個options參數
  var resultCanvas = document.getElementById("resultCanvas");      
  //選項：開啟，備用根  //顯示多個結果
  searcherOptions.setExpandMode(google.search.SearchControl.EXPAND_MODE_OPEN);
  //沒有結果訊息
  searcherOptions.setSTRResult1(google.search. //options.setDrawMode(google.search.SearchControl.DRAW_MODE_TABBED);//網路、本機...在標籤中顯示
  searcherOptions.setRoot(resultCanvas); //在另一個地方顯示結果--

     //用於建立搜尋服務的SearchControl對象，其中將包含本地搜尋服務              localSearch , searcherOptions); 
  searchControl.addSearcher(new google.search.WebSearch());
  searchControl.addSearcher(new google.search.NewsSearch());
 search. BlogSearch()) ;
  //繪製選項並將其設定為選項卡式視圖，
  var drawOptions = new google.search.DrawOptions();
  drawOptions.setDrawMode(google.search.SearchControl. DRAW_MODE_TABBED)
  / /使searchControl返回結果：GResult
  searchControl.setOnKeepCallback(this, LocalSearchKeepHandler);//保留搜尋結果
  ///此選項用於設定搜尋框在此選項中設定的位置。
//drawOptions.setSearchFormRoot(document.getElementById("drawOptions"));
  //將輸入框設定為使用者定義的元素 
  //drawOptions.setInput(document.getElementBadument." );
  // 告訴搜尋框自己繪製，並告訴它附加到哪裡
 // searchControl.draw(document.getElementById("searchBox"), drawOptions);//這裡我把fromaddress 和toaddress 改成了search，a新地點
  //另一個使用者定義的輸入框
  drawOptions.setInput(document.getElementById("input2"));
  searchControl.draw();
** 下面的程式碼是關於google Ajax地圖搜尋API
  //此程式碼段用於新增側邊欄以顯示搜尋結果
  //我想知道為什麼這裡沒有'var'
   optinos = new Object( );
   options.resultList = resultCanvas;
   options.resultFormat = "multi-line1";
   var lsc2 = new google.elements.LocalSearch(opp. GControlPosition(G_ANCHOR_TOP_LEFT, new GSize(-282, -2)));
   */
        }
 google.setOnLoadCallback(initialize);