根据搜索放置谷歌地图标记

Question

我正在尝试实施 Google 地图。 第一部分是将地图居中到一个特定的地址，效果很好。

我的下一个问题是，我必须根据对商店名称的搜索，在地图上为商店放置一个标记。标记可能应该连接到搜索结果，以便在单击时显示信息气泡。如何着手和做到这一点，我完全无能为力。

Answer 1

您的步骤对我来说似乎没问题，我假设搜索商店名称转到您的服务器并且您返回一些带有商店名称和地址的结果，然后您使用 Google Geocoding API 和获取 lat/lng 坐标并将标记放在地图上，以下是我可能会使用的步骤：

• 创建地图
• 以特定地址为中心
• 搜索商店
• 如果结果具有与之关联的地理编码，则只需使用它来放置标记。
• 如果结果没有 lat/lng，则向 Google Geocoding API 发出请求以获取 lat/lng 坐标。放置标记后，将接收到的地理编码存储到您的数据库中（通过使用一些后台 Ajax 请求）。

Google Geocoding API best practices 建议您应该存储地理编码，这样您就不必每次都查询 Google 的服务器。为此，您需要修改您的后端，以便它还存储地理编码以及商店详细信息，并且在搜索结果中您可以返回地理编码（如果有）。

附带说明，您可以使用GMaps JavaScript 库来轻松操作地图。

更新

上述解决方案在您修改后的场景中完美运行。让我重新表述一下流程：

1. 当通过商店名称搜索时，后端会返回一个商店列表（我猜这应该很容易）
2. 如果结果不为空，则循环遍历列表并查看它们是否都有关联的 lat/lng 值。
3. 如果您没有找到记录的 lat/lng 值，则向 Google 的服务器发出地理编码请求，传递商店的地址（您至少需要有商店的地址，否则您无法获得 lat /lng 来自 Google 的值）作为参数。如果记录具有 lat/lng 值，则继续在地图上放置一个标记。
4. 收到来自 Geocode API 的响应后，请继续使用提供的地图库 API 在地图上放置一个标记。对于 GMaps，它是 map.addMarker({...})。
5. 一旦所有的请求都完成了，那么您可以考虑优化一下前面的建议，您可以将接收到的地理编码存储在您自己的服务器中，这样您就不必一次又一次地获取它们。

要实现上述步骤，您需要熟悉 Maps JS 库以及 JavaScript 和 Ajax/JSONP。请记住，您的所有地理编码请求（我认为是 JSONP）都是异步的，只有在您可以使用响应时（通常在回调中）才应该调用标记放置代码。 GMaps 库示例非常容易上手。我希望这个解释应该足以解决您的问题，如果它对您有帮助，那么您可以考虑将其标记为答案。