Me tomó dos días usar la API de Google para hacer algo tan pequeño. De hecho, el código de implementación real no es mucho, solo una docena de líneas. El trabajo que requiere mucho tiempo es comprender las funciones de cada API y depurar JavaScript.
Presentemos brevemente algunas de las funciones que utilicé esta vez.
•Constructor google.search.LocalSearch()
En realidad, esto crea un servicio LocalSearch. Este servicio, al igual que otros servicios (noticias, blogs, web), es utilizado por SearchControl. Estos Servicios determinan las capacidades de SearchControl.
•Establecer el tipo de estructura de búsqueda de LocalSearch
localSearch.setRestriction(google.search.Search.RESTRICT_TYPE, google.search.LocalSearch.TYPE_KMLONLY_RESULTS)
Esto muestra que no hay resultados comerciales en los resultados de búsqueda, solo resultados kml y geocodificados.
• Establecer el alcance de búsqueda de LocalSearch
localSearch.setCenterPoint("Pekín");
•google.search.SearcherOptions()
Establezca las propiedades del Servicio de búsqueda (Buscador) y utilícelas como un atributo de SearchControl.addSearcher(). Están disponibles las siguientes opciones:
1. Establecer el método de visualización de los resultados.
•searcherOptions.setExpandMode(google.search.SearchControl.EXPAND_MODE_OPEN);
2. El texto que se muestra cuando no hay resultados de búsqueda en el perfil.
• searcherOptions.setNoResultsString(google.search.SearchControl.NO_RESULTS_DEFAULT_STRING);
3. Establezca la ubicación donde se muestran los resultados.
•searcherOptions.setRoot(resultCanvas);
•nuevas google.search.DrawOptions();
Establecer cómo se muestra el control de búsqueda de Google
•drawOptions.setDrawMode(google.search.SearchControl.DRAW_MODE_TABBED)
Establezca el modo de visualización en modo de pestañas, es decir, cada buscador se muestra como pestañas
•drawOptions.setInput(document.getElementById("entrada"));
Cambiar el valor predeterminado del cuadro de entrada de búsqueda a un cuadro de entrada definido por el usuario
Devuelve los resultados de búsqueda seleccionados por el usuario como un objeto GResult correspondiente. Por ejemplo, el GResult de LocalSearch es un GLocalResult.
Me tomó mucho tiempo encontrar esta opción. Hay dos razones: primero, hay pocas personas que la usan y hay pocos documentos. En segundo lugar, me llevó mucho tiempo entender el documento en inglés que leí. De hecho, creo que me lleva más tiempo leer el documento en chino.
•searchControl.setOnKeepCallback(este, LocalSearchKeepHandler);
Por cierto, pegue el código de LocalSearchKeepHandler, cuyo parámetro es el objeto GResult devuelto automáticamente.
Copie el código de código de la siguiente manera:
función LocalSearchKeepHandler (resultado) {
var de = document.getElementById("de");
alerta("resultado.tilte = " + resultado.título);
from.value = ProcessString(resultado.título);
alerta("desde.valor = " + desde.valor);
//alerta(resultado.título);
}
Simplemente publique este código en su totalidad para facilitar la lectura.
Copie el código de código de la siguiente manera:
google.load("búsqueda", "1", {"idioma": "zh-CN"});
función inicializar() {
//LocalSearch Objeto utilizado para crear un servicio de búsqueda local para los mapas.
var localSearch = nuevo google.search.LocalSearch();
//restringir los resultados de búsqueda local a kml y geocodificar solo los resultados, no los comerciales
localSearch.setRestriction(google.search.Search.RESTRICT_TYPE, google.search.LocalSearch.TYPE_KMLONLY_RESULTS);
// Establecer el punto central de búsqueda local
localSearch.setCenterPoint("Pekín");
//Se trata de búsqueda local, que se utilizan para establecer dónde aparecerán los resultados, un parámetro de opciones
var resultadoCanvas = document.getElementById("resultCanvas");
//opciones: abrir, raíz alternativa
var searcherOptions = nuevo google.search.SearcherOptions();
//muestra muchos resultados
searcherOptions.setExpandMode(google.search.SearchControl.EXPAND_MODE_OPEN);
//no hay mensaje de resultados
searcherOptions.setNoResultsString(google.search.SearchControl.NO_RESULTS_DEFAULT_STRING);
//options.setDrawMode(google.search.SearchControl.DRAW_MODE_TABBED);//web, local... en una pestaña
searcherOptions.setRoot(resultCanvas);//muestra los resultados en otro lugar--<div id="resultCanvas">
//SearchControl Objeto utilizado para crear un servicio de búsqueda que incluirá un servicio de búsqueda local
var searchControl = nuevo google.search.SearchControl(nulo);
searchControl.addSearcher(localSearch, searcherOptions);
searchControl.addSearcher(nuevo google.search.WebSearch());
searchControl.addSearcher(nuevo google.search.NewsSearch());
searchControl.addSearcher(nuevo google.search.BlogSearch());
//dibuja opciones y configúralas en una vista con pestañas,
var drawOptions = nuevo google.search.DrawOptions();
drawOptions.setDrawMode(google.search.SearchControl.DRAW_MODE_TABBED)
//hace que el control de búsqueda devuelva un resultado:GResultado
searchControl.setOnKeepCallback(this, LocalSearchKeepHandler);//manteniendo un resultado de búsqueda
//Esta opción se utiliza para establecer la posición del cuadro de búsqueda en un árbol DOM.
//drawOptions.setSearchFormRoot(document.getElementById("drawOptions"));
//establece el cuadro de entrada en un elemento definido por el usuario
//drawOptions.setInput(document.getElementById("entrada"));
// le indica al cuadro de búsqueda que se dibuje solo y le indica dónde adjuntarlo
//searchControl.draw(document.getElementById("searchBox"), drawOptions);//Aquí cambié de dirección y a dirección para buscar, un nuevo lugar
//otro cuadro de entrada definido por el usuario
drawOptions.setInput(document.getElementById("input2"));
searchControl.draw();
/** Los códigos siguientes son sobre la API de búsqueda de mapas Ajax de Google.
//este segmento de código se usa para agregar una barra lateral para mostrar los resultados de la búsqueda
//Me pregunto por qué no existe 'var' aquí
optinos = nuevo Objeto();
opciones.resultList = resultadoCanvas;
opciones.resultFormat = "multilínea1";
var lsc2 = nuevo google.elements.LocalSearch(opciones);
map.addControl(lsc2, nuevo GControlPosition(G_ANCHOR_TOP_LEFT, nuevo GSize(-282, -2)));
*/
}
google.setOnLoadCallback(inicializar);