Google Map Api和GOOGLE Search Api整合

       将GOOGLE MAP API 和 GOOGLE Search API 进行整合，我用面向对象的方式写了一个类，通过传一个经纬度进去，自动通过GOOGLE LOCAL SEARCH获取附近的相关信息。比如餐厅、景点等，反过来标到地图上，并可在任意容器内显示。

下面是源码：

JavaScript复制代码

1. /*  
2. *Author:karry  
3. *Version:1.0  
4. *Time:2008-12-01  
5. *KMapSearch 类  
6. *把GOOGLE MAP 和LocalSearch结合。只需要传入MAP\经纬度值，就可以把该经纬度附近的相关本地搜索内容取出来，在地图上标注出来，并可以在指定容器显示搜索结果  
7. */  
8.   
9. (function() {   
10.     var markers= new Array();    
11.     var KMapSearch=window.KMapSearch= function(map_, opts_) {   
12.         this.opts = {   
13.             container:opts_.container || "divSearchResult",   
14.             keyWord:opts_.keyWord || "餐厅",   
15.             latlng: opts_.latlng || new GLatLng(31, 121),   
16.             autoClear:opts_.autoClear || true,   
17.             icon:opts_.icon || new GIcon(G_DEFAULT_ICON)   
18.         };   
19.         this.map = map_;   
20.         this.gLocalSearch = new google.search.LocalSearch();   
21.         this.gLocalSearch.setCenterPoint(this.opts.latlng);   
22.         this.gLocalSearch.setResultSetSize(GSearch.LARGE_RESULTSET);   
23.         this.gLocalSearch.setSearchCompleteCallback(this, function() {   
24.             if (this.gLocalSearch.results) {   
25.                 var savedResults = document.getElementById(this.opts.container);   
26.                 if (this.opts.autoClear) {   
27.                     savedResults.innerHTML = "";   
28.                 }   
29.                 for (var i = 0; i < this.gLocalSearch.results.length; i++) {   
30.                     savedResults.appendChild(this.getResult(this.gLocalSearch.results[i]));   
31.                 }   
32.             }   
33.         });   
34.     }   
35.     KMapSearch.prototype.getResult = function(result) {   
36.         var container = document.createElement("div");   
37.         container.className = "list";   
38.         var myRadom =(new Date()).getTime().toString()+Math.floor(Math.random()*10000);   
39.         container.id=myRadom;   
40.         container.innerHTML = result.title + "<br />地址：" + result.streetAddress;   
41.         this.createMarker(new GLatLng(result.lat, result.lng), result.html,myRadom);   
42.         return container;   
43.     }   
44.     KMapSearch.prototype.createMarker = function(latLng, content)   
45.     {   
46.         var marker = new GMarker(latLng, {icon:this.opts.icon,title:this.opts.title});   
47.         GEvent.addListener(marker, "click", function() {   
48.             marker.openInfoWindowHtml(content);   
49.         });   
50.         markers.push(marker);   
51.         map.addOverlay(marker);   
52.     }   
53.     KMapSearch.prototype.clearAll = function() {   
54.         for (var i = 0; i < markers.length; i++) {   
55.             this.map.removeOverlay(markers[i]);   
56.         }   
57.         markers.length = 0;   
58.     }   
59.     KMapSearch.prototype.execute = function(latLng) {   
60.         if (latLng) {   
61.             this.gLocalSearch.setCenterPoint(latLng);   
62.         }   
63.         this.gLocalSearch.execute(this.opts.keyWord);   
64.     }   
65. })();  

使用方法：

JavaScript复制代码

1. var myIcon = new GIcon(G_DEFAULT_ICON);   
2. myIcon.image = "canting.png";   
3. myIcon.iconSize = new GSize(16, 20);   
4. myIcon.iconAnchor = new GPoint(8, 20);   
5. myIcon.shadow = "";   
6. var mapSearch = new KMapSearch(map, {container:"cantingContainer",latlng:initPt,icon:myIcon,keyWord:"餐厅"});   
7. mapSearch.clearAll();   
8. mapSearch.execute();  

点击这里查看演示示例：经纬度查询整合本地搜索

程式碼工作室
ERP/EIP/CMS/CHART/REPORT/SPC/EDA/雲端 系統開發整合
ASP/PHP/JSP/ASP.NET 網頁設計
技術指導顧問
信箱:paulwu0114@gmail.com
http://www.coding.com.tw