更新：这里是使用 google clientlocation api 和使用 jsonp 进行本地搜索的示例。
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script type="text/javascript" src="http://www.google.com/jsapi?key=ABQIAAAALDWeTDQHOJCbCf0JnUqL8BT2yXp_ZAY8_ufC3CFXhHIE1NvwkxQA7AE8xB9MyWgHECPY2qimOp7BUQ"></script>
<script src="scripts/clientLocation.js" type="text/javascript"></script>
<script src="scripts/localSearch.js" type="text/javascript"></script>
<script type="text/javascript">
function $g(id) {
return document.getElementById(id);
}
function displayLocation(latitudeEl, longitudeEl, cityEl, regionEl, countryEl, country_codeEl) {
var cloc = new ClientLocation.Location(google.loader.ClientLocation);
if (latitudeEl) latitudeEl.innerHTML = cloc.latitude;
if (longitudeEl) longitudeEl.innerHTML = cloc.longitude;
if (cityEl) cityEl.innerHTML = cloc.address.city;
if (regionEl) regionEl.innerHTML = cloc.address.region;
if (country) country.innerHTML = cloc.address.country;
if (country_codeEl) country_codeEl.innerHTML = cloc.address.country_code;
}
function localSearch(term, callback, context) {
var cloc = new ClientLocation.Location(google.loader.ClientLocation);
var searchUrl = 'http://www.google.com/uds/GlocalSearch?callback=' + callback + '&context=' + context + '&hl=en&q=' + encodeURIComponent(term) + '&sll=' + cloc.latitude + ',' + cloc.longitude + '&key=ABQIAAAALDWeTDQHOJCbCf0JnUqL8BT2yXp_ZAY8_ufC3CFXhHIE1NvwkxQA7AE8xB9MyWgHECPY2qimOp7BUQ&v=1.0';
// http://jaybyjayfresh.com/2007/09/17/using-script-tags-to-do-remote-http-calls-in-javascript/
scriptLoaded = function() {
removeNode(newScript);
};
var headID = document.getElementsByTagName("head")[0];
var newScript = document.createElement('script');
newScript.type = 'text/javascript';
newScript.onload = scriptLoaded;
newScript.src = searchUrl;
headID.appendChild(newScript);
}
function search() {
var term = $g("txtSearch").value;
localSearch(term, "displayResults", "0");
}
function displayResults(context, results, status, details, unused) {
var titles = [];
for (var i = 0; i < results.results.length; i++) {
// this cast is not necessary, just here to illustrate
// vs intellisense and reduce coding errors.
var result = new LocalSearch.Result(results.results[i]);
titles.push(result.title);
}
$g("searchResults").innerHTML = titles.join("</br>");
}
function init() {
displayLocation($g("latitude"), $g("longitude"), $g("city"), $g("region"), $g("country"), $g("country_code"));
}
</script>
</head>
<body onload="init()">
<form id="form1" runat="server">
<div>
latitude : <span id="latitude"></span>
<br />
longitude : <span id="longitude"></span>
<br />
city : <span id="city"></span>
<br />
region : <span id="region"></span>
<br />
country : <span id="country"></span>
<br />
country_code : <span id="country_code"></span>
<br />
</div>
<input type="text" id="txtSearch" /><input type="button" id="btnSearch" value="get results"
onclick="search();" /><br />
<div id="searchResults">
</div>
</form>
</body>
</html>
// <copyright file="clientLocation.js" company="Sky Sanders">
// This source is placed in the Public Domain.
// http://skysanders.net/subtext
// Attribution is appreciated.
// </copyright>
/*
object literal format for google.loader.clientlocation
{
"latitude": 33.324,
"longitude": -111.867,
"address": {
"city": "Chandler",
"region": "AZ",
"country": "USA",
"country_code": "US"
}
}
*/
var ClientLocation = {};
ClientLocation.Address = function() {
/// <field name="city" type="String" />
/// <field name="region" type="String" />
/// <field name="country" type="String" />
/// <field name="country_code" type="String" />
/// <returns type="ClientLocation.Address"/>
if (arguments.length > 0) {
this.city = arguments[0].city;
this.region = arguments[0].region;
this.country = arguments[0].country;
this.country_code = arguments[0].country_code;
return;
}
else {
this.city = "";
this.region = "";
this.country = "";
this.country_code = "";
}
}
ClientLocation.Location = function() {
/// <field name="latitude" type="Number" />
/// <field name="longitude" type="Number" />
/// <field name="address" type="ClientLocation.Address" />
if (arguments.length > 0) {
this.latitude = arguments[0].latitude;
this.longitude = arguments[0].longitude;
this.address = arguments[0].address;
}
else {
this.latitude = 0;
this.longitude = 0;
this.address = undefined;
}
}
// <copyright file="localSearc.js" company="Sky Sanders">
// This source is placed in the Public Domain.
// http://skysanders.net/subtext
// Attribution is appreciated.
// </copyright>
/*
GlocalSearch result
{
"GsearchResultClass": "GlocalSearch",
"viewportmode": "computed",
"listingType": "local",
"lat": "33.389689",
"lng": "-111.853909",
"accuracy": "8",
"title": "Best \u003cb\u003eBuy\u003c/b\u003e",
"titleNoFormatting": "Best Buy",
"ddUrl": "http://www.google.com/maps....",
"ddUrlToHere": "http://www.google.com/maps?....",
"ddUrlFromHere": "http://www.google.com/maps?....",
"streetAddress": "1337 South Alma School Road",
"city": "Mesa",
"region": "AZ",
"country": "United States",
"staticMapUrl": "http://mt.google.com/mapdata?....",
"url": "http://www.google.com/maps/place?source....",
"content": "",
"maxAge": 604800,
"phoneNumbers": [{
"type": "",
"number": "(480) 644-7139"
},
{
"type": "",
"number": "(480) 464-0444"
}],
"addressLines": ["1337 South Alma School Road", "Mesa, AZ"]
}
*/
var LocalSearch = {};
LocalSearch.PhoneNumber = function() {
/// <field name="type" type="String"/>
/// <field name="number" type="String"/>
/// <returns type="LocalSearch.PhoneNumber"/>
if (arguments.length > 0) {
this.type = arguments[0].type;
this.number = arguments[0].number;
}
else {
this.type = "";
this.number = "";
}
}
LocalSearch.Result = function() {
/// <field name="GsearchResultClass" type="String"/>
/// <field name="viewportmode" type="String"/>
/// <field name="listingType" type="String"/>
/// <field name="lat" type="String"/>
/// <field name="lng" type="String"/>
/// <field name="accuracy" type="String"/>
/// <field name="title" type="String"/>
/// <field name="titleNoFormatting" type="String"/>
/// <field name="ddUrl" type="String"/>
/// <field name="ddUrlToHere" type="String"/>
/// <field name="ddUrlFromHere" type="String"/>
/// <field name="streetAddress" type="String"/>
/// <field name="city" type="String"/>
/// <field name="region" type="String"/>
/// <field name="country" type="String"/>
/// <field name="staticMapUrl" type="String"/>
/// <field name="url" type="String"/>
/// <field name="content" type="String"/>
/// <field name="maxAge" type="Number"/>
/// <field name="phoneNumbers" type="Array"/>
/// <field name="addressLines" type="Array"/>
// <returns type="LocalSearch.Result"/>
if (arguments.length > 0) {
this.GsearchResultClass = arguments[0].GsearchResultClass;
this.viewportmode = arguments[0].viewportmode;
this.listingType = arguments[0].listingType;
this.lat = arguments[0].lat;
this.lng = arguments[0].lng;
this.accuracy = arguments[0].accuracy;
this.title = arguments[0].title;
this.titleNoFormatting = arguments[0].titleNoFormatting;
this.ddUrl = arguments[0].ddUrl;
this.ddUrlToHere = arguments[0].ddUrlToHere;
this.ddUrlFromHere = arguments[0].ddUrlFromHere;
this.streetAddress = arguments[0].streetAddress;
this.city = arguments[0].city;
this.region = arguments[0].region;
this.country = arguments[0].country;
this.staticMapUrl = arguments[0].staticMapUrl;
this.url = arguments[0].url;
this.content = arguments[0].content;
this.maxAge = arguments[0].maxAge;
this.phoneNumbers = arguments[0].phoneNumbers;
this.addressLines = arguments[0].addressLines;
}
else {
this.GsearchResultClass = "";
this.viewportmode = "";
this.listingType = "";
this.lat = "";
this.lng = "";
this.accuracy = "";
this.title = "";
this.titleNoFormatting = "";
this.ddUrl = "";
this.ddUrlToHere = "";
this.ddUrlFromHere = "";
this.streetAddress = "";
this.city = "";
this.region = "";
this.country = "";
this.staticMapUrl = "";
this.url = "";
this.content = "";
this.maxAge = 0;
this.phoneNumbers = [];
this.addressLines = [];
}
}