根据腾讯地图API,以图文的方式一步一步的来说明如何获取详细的位置信息数据。具体参考腾讯地图Webservice API的简介。腾讯地图WebService API

  第一步:申请开发者密钥(key)申请密钥

      我选择的应用类型为浏览器类型(调用Javascript API、JSONP调用WebService API、静态图API等)。

      填写完成提交好既可以获取属于自己的Key。

      

  第二步:Key获取到了,下面就要通过ajax请求获取位置信息了

      首先跟大家说一下此接口都可以获取那些信息,以及需要传哪些参数。简单来说就是输入坐标返回地理位置信息和附近poi列表(POI是“Point of Interest”的缩写,可以翻译成“信息点”,每个POI包含四方面信息,名称、类别、经度纬度、附近的酒店饭店商铺等信息)。

      

  1 {
  2     "status": 0,
  3     "message": "query ok",
  4     "result": {
  5         "location": {
  6             "lat": 39.984154,
  7             "lng": 116.30749
  8         },
  9         "address": "北京市海淀区彩和坊路北四环西路66号",
 10         "formatted_addresses": {
 11             "recommend": "海淀区北四环西路66号中国技术交易大厦内",
 12             "rough": "海淀区中关村"
 13         },
 14         "address_component": {
 15             "nation": "中国",
 16             "province": "北京市",
 17             "city": "北京市",
 18             "district": "海淀区",
 19             "street": "彩和坊路",
 20             "street_number": "北四环西路66号"
 21         },
 22         "ad_info": {
 23             "adcode": "110108",
 24             "name": "中国,北京市,北京市,海淀区",
 25             "location": {
 26                 "lat": 39.984154,
 27                 "lng": 116.307487
 28             },
 29             "nation": "中国",
 30             "province": "北京市",
 31             "city": "北京市",
 32             "district": "海淀区"
 33         },
 34         "address_reference": {
 35             "crossroad": {
 36                 "title": "彩和坊路/北四环西路辅路(路口)",
 37                 "location": {
 38                     "lat": 39.985001,
 39                     "lng": 116.308113
 40                 },
 41                 "_distance": 104.2,
 42                 "_dir_desc": "西南"
 43             },
 44             "street": {
 45                 "title": "彩和坊路",
 46                 "location": {
 47                     "lat": 39.984154,
 48                     "lng": 116.308098
 49                 },
 50                 "_distance": 49.1,
 51                 "_dir_desc": "西"
 52             },
 53             "famous_area": {
 54                 "title": "中关村",
 55                 "location": {
 56                     "lat": 39.984119,
 57                     "lng": 116.307503
 58                 },
 59                 "_distance": 0,
 60                 "_dir_desc": "内"
 61             },
 62             "town": {
 63                 "title": "海淀街道",
 64                 "location": {
 65                     "lat": 39.984154,
 66                     "lng": 116.307487
 67                 },
 68                 "_distance": 0,
 69                 "_dir_desc": "内"
 70             },
 71             "street_number": {
 72                 "title": "北四环西路66号",
 73                 "location": {
 74                     "lat": 39.984119,
 75                     "lng": 116.307503
 76                 },
 77                 "_distance": 0,
 78                 "_dir_desc": ""
 79             },
 80             "landmark_l2": {
 81                 "title": "中国技术交易大厦",
 82                 "location": {
 83                     "lat": 39.984154,
 84                     "lng": 116.307487
 85                 },
 86                 "_distance": 0,
 87                 "_dir_desc": "内"
 88             }
 89         },
 90         "poi_count": 10,
 91         "pois": [
 92             {
 93                 "id": "3629720141162880123",
 94                 "title": "中国技术交易大厦",
 95                 "address": "北四环西路66号",
 96                 "category": "房产小区;商务楼宇",
 97                 "location": {
 98                     "lat": 39.984154,
 99                     "lng": 116.307487
100                 },
101                 "ad_info": {
102                     "adcode": "110108",
103                     "province": "北京市",
104                     "city": "北京市",
105                     "district": "海淀区"
106                 },
107                 "_distance": 0,
108                 "_dir_desc": "内"
109             },
110             {
111                 "id": "12925244666643621769",
112                 "title": "中国技术交易大厦B座",
113                 "address": "北京市海淀区北四环西路66号",
114                 "category": "房产小区;商务楼宇",
115                 "location": {
116                     "lat": 39.984112,
117                     "lng": 116.307587
118                 },
119                 "ad_info": {
120                     "adcode": "110108",
121                     "province": "北京市",
122                     "city": "北京市",
123                     "district": "海淀区"
124                 },
125                 "_distance": 9.7,
126                 "_dir_desc": ""
127             },
128             {
129                 "id": "2845372667492951071",
130                 "title": "中国技术交易大厦A座",
131                 "address": "北京市海淀区北四环西路66号中国技术交易大厦",
132                 "category": "房产小区;商务楼宇",
133                 "location": {
134                     "lat": 39.984112,
135                     "lng": 116.307587
136                 },
137                 "ad_info": {
138                     "adcode": "110108",
139                     "province": "北京市",
140                     "city": "北京市",
141                     "district": "海淀区"
142                 },
143                 "_distance": 9.7,
144                 "_dir_desc": ""
145             },
146             {
147                 "id": "12017569646070509084",
148                 "title": "中关村SOHOA区",
149                 "address": "北京市海淀区海淀北二街8号中关村SOHO",
150                 "category": "房产小区;商务楼宇",
151                 "location": {
152                     "lat": 39.983452,
153                     "lng": 116.310143
154                 },
155                 "ad_info": {
156                     "adcode": "110108",
157                     "province": "北京市",
158                     "city": "北京市",
159                     "district": "海淀区"
160                 },
161                 "_distance": 239.6,
162                 "_dir_desc": "西"
163             },
164             {
165                 "id": "206863847875503767",
166                 "title": "中关村SOHOB区",
167                 "address": "北京市海淀区海淀北二街8号",
168                 "category": "房产小区;商务楼宇",
169                 "location": {
170                     "lat": 39.983452,
171                     "lng": 116.310143
172                 },
173                 "ad_info": {
174                     "adcode": "110108",
175                     "province": "北京市",
176                     "city": "北京市",
177                     "district": "海淀区"
178                 },
179                 "_distance": 239.6,
180                 "_dir_desc": "西"
181             },
182             {
183                 "id": "2586789338541507151",
184                 "title": "大恒科技大厦南座",
185                 "address": "北京市海淀区苏州街3号",
186                 "category": "房产小区;商务楼宇",
187                 "location": {
188                     "lat": 39.9827,
189                     "lng": 116.305359
190                 },
191                 "ad_info": {
192                     "adcode": "110108",
193                     "province": "北京市",
194                     "city": "北京市",
195                     "district": "海淀区"
196                 },
197                 "_distance": 243.2,
198                 "_dir_desc": "东北"
199             },
200             {
201                 "id": "10411172112248966185",
202                 "title": "大恒科技大厦北座",
203                 "address": "北京市海淀区苏州街3号",
204                 "category": "房产小区;商务楼宇",
205                 "location": {
206                     "lat": 39.982422,
207                     "lng": 116.305313
208                 },
209                 "ad_info": {
210                     "adcode": "110108",
211                     "province": "北京市",
212                     "city": "北京市",
213                     "district": "海淀区"
214                 },
215                 "_distance": 267.5,
216                 "_dir_desc": "东北"
217             },
218             {
219                 "id": "3467897955375836486",
220                 "title": "西屋国际A座",
221                 "address": "北京市海淀区苏州街12号",
222                 "category": "房产小区;住宅区;住宅小区",
223                 "location": {
224                     "lat": 39.98093,
225                     "lng": 116.30658
226                 },
227                 "ad_info": {
228                     "adcode": "110108",
229                     "province": "北京市",
230                     "city": "北京市",
231                     "district": "海淀区"
232                 },
233                 "_distance": 367.1,
234                 "_dir_desc": "东北"
235             },
236             {
237                 "id": "10159988224873792278",
238                 "title": "西屋国际F座",
239                 "address": "北京市海淀区苏州街12号",
240                 "category": "房产小区;住宅区;住宅小区",
241                 "location": {
242                     "lat": 39.980793,
243                     "lng": 116.307381
244                 },
245                 "ad_info": {
246                     "adcode": "110108",
247                     "province": "北京市",
248                     "city": "北京市",
249                     "district": "海淀区"
250                 },
251                 "_distance": 374.2,
252                 "_dir_desc": "东北"
253             },
254             {
255                 "id": "1833965334134367830",
256                 "title": "西屋国际B座",
257                 "address": "北京市海淀区苏州街12号",
258                 "category": "房产小区;住宅区;住宅小区",
259                 "location": {
260                     "lat": 39.980759,
261                     "lng": 116.306427
262                 },
263                 "ad_info": {
264                     "adcode": "110108",
265                     "province": "北京市",
266                     "city": "北京市",
267                     "district": "海淀区"
268                 },
269                 "_distance": 388.6,
270                 "_dir_desc": "东北"
271             }
272         ]
273     }
274 }
View Code

 

      以上就是返回的参数信息,具体的参数介绍:http://lbs.qq.com/webservice_v1/guide-gcoder.html

     下面呢,就写一下如何发送ajxa请求,当然这个请求是jsonp的跨域请求。

     

 1      var data={
 2           location:"39.984154,116.307490",
 3               /*换成自己申请的key*/
 4           key:"OB4BZ-D4W3U-B7VVO-4PJWW-6TKDJ-WPB77",
 5           get_poi:0    
 6         }
 7     var url="http://apis.map.qq.com/ws/geocoder/v1/?";
 8     data.output="jsonp";  
 9     $.ajax({
10         type:"get",
11         dataType:'jsonp',
12         data:data,
13         jsonp:"callback",
14         jsonpCallback:"QQmap",
15         url:url,
16         success:function(json){
17             /*json对象转为文本 var aToStr=JSON.stringify(a);*/
18             var toStr = JSON.stringify(json);
19             toStr=getFormatJsonStrFromString(toStr);
20             /*调用业务处理程序*/
21             suggestion_example&&suggestion_example($show,url_list,toStr);
22         },
23         error : function(err){alert("服务端错误,请刷新浏览器后重试")}
24 
25 }

     这样在跨域得到的数据就可以在ajax请求的【json】中获取了。

posted on 2016-03-28 14:31  沐浴春风  阅读(70662)  评论(0编辑  收藏  举报