自动完成Google Maps API - 直接JSON调用

时间:2012-08-18 16:56:04

标签: jquery autocomplete google-places-api

我正在尝试开发一个使用Google Places API的jQuery移动应用程序。基本上我正在做的是在jQuery移动页面上添加一个输入,然后将其连接到Google Places以自动填充地址,并可能获取该地址的坐标。

我在modifying the demos available here取得了初步成功,它在“地方资料库”中使用了Google自己的自动填充功能。但是,从UI的角度来看,在移动设备上,这种实现方式不起作用 - 您实际上需要点击相对较小的结果,而点击手机上的返回按钮不会选择第一个结果。

输入:http://www.raymondcamden.com/index.cfm/2012/3/27/Example-of-Autocomplete-in-jQuery-Mobile

完全符合我的需求,只是我现在尝试使用自动填充API通过Google Places API返回返回的数据。请参阅我正在使用的示例API调用:

https://maps.googleapis.com/maps/api/place/autocomplete/json?input=Amoeba&types=establishment&sensor=true&key=myKeyHERE

然而,这不会返回任何GEO信息 - 只是地址。我需要使用不同的方法或电话吗?使用本机(Places Library) implementation,我可以访问大量数据,它不需要API密钥,也不需要在边界内工作。不确定重新geoCoding结果集是否是最好的方法。

2 个答案:

答案 0 :(得分:1)

我发现在执行上述操作后需要另一个调用,'reference'字段在初始JSON响应中返回。我可以将结果缓存为我唯一需要的地理位置。虽然您的建议肯定被认为是另一种可能的解决方案,但我更喜欢对UI行为进行额外的控制,即使它是以额外的API请求为代价的。

无论如何,为了回答一个不错的建议,已经给了你一些荣誉。

https://developers.google.com/places/documentation/#PlaceDetailsRequests

https://maps.googleapis.com/maps/api/place/details/json?reference=CmRYAAAAciqGsTRX1mXRvuXSH2ErwW-jCINE1aLiwP64MCWDN5vkXvXoQGPKldMfmdGyqWSpm7BEYCgDm-iv7Kc2PF7QA7brMAwBbAcqMr5i1f4PwTpaovIZjysCEZTry8Ez30wpEhCNCXpynextCld2EBsDkRKsGhSLayuRyFsex6JA6NPh9dyupoTH3g&sensor=true&key=[yourKey]

答案 1 :(得分:0)

您无法在javascript中执行跨域json请求,因此点击/ json端点将无效。

你应该做的是回到原来的想法,然后设置自动填充建议的样式,使其更具移动性。

.pac-container is the class for the suggest area
.pac-item is the class for each item in the suggest area