使用 Nearby Search(新)API 改进本地搜索

在本文档中,您将了解如何使用 附近搜索(新)API 构建 简单且经济实惠的

本地探索体验。

本地探索体验会在用户搜索酒店或房地产时,向用户显示您指定位置附近的主要景点。它通常包含一个互动式地图,以及一个包含地点选择器和照片库的额外面板。您将看到不同的 Google Maps Platform 产品和功能,以通过互动性来提升体验。

本地发现示例

使用场景

现在,我们来了解一下本地探索集成中的哪些元素可以提升用户价值:

  • 探索 \- 通过显示各种类型的相关地点,让用户了解单个位置周围的情况。

  • 互动性 - 让用户能够选择地点并动态刷新

    与该地点相关的数据。

  • 可视化 - 提供地点评价、照片

    以及步行时间和距离,以便用户快速了解是否符合自己的需求。

参考架构

alt_text

本地探索

您可以通过多种方式打造本地探索体验。以下集成是一个自定义示例 ,展示了如何利用知名的 Google Maps Platform API 以及一些令人兴奋的新功能来打造用户体验。如果您 希望采用模板化方法进行本地探索,可以使用 Web 组件

示例应用

示例演示

在下表中,您将看到示例应用分解为多个步骤,以及使用 Google Maps Platform API 的技术实现说明。

1. 使用自动补全功能搜索地点搜索地点

  • 加载 Maps JavaScript API
  • 地点自动补全 查询或在地图上选择地点。

自动补全示例

2. 使用 附近搜索(新)API 显示本地景点

  • 按热门程度排名(更相关的结果)或按距离排名。
  • includedTypesexcludedTypes;如果您是酒店,则可以排除“住宿”类型,并且仅包含合适的类型,例如:“餐厅、咖啡馆、公园、旅游景点”。
  • 利用 includedPrimaryTypesexcludedPrimaryTypes 可以更好地控制结果。
  • `locationRestriction`,以避免结果数量不足或地点太远;如果结果为零,请先扩大圆形 / 矩形的大小,然后再显示结果。

附近的地点示例

预订酒店 时请求数据字段的查询示例:

  • 基本信息(displayNametypesopeningHoursformattedAddress
  • 联系方式(websiteUrinationalPhoneNumberinternationalPhoneNumber
  • 首选信息(reviewspriceLeveluserRatingCount
 { "includedTypes": ["restaurant","cafe","park"], "excludedTypes":
["lodging","convenience_store"], "includedPrimaryTypes":
["restaurant","tourist_attraction","airport"], "excludedPrimaryTypes":
["lodging"], "maxResultCount": 20, "locationRestriction": { "circle": {
"center": { "latitude": 37.7937, "longitude": -122.3965 }, "radius": 500.0 } } }

搜索房地产 时请求数据字段的查询示例:

  • 基本信息(displayNametypesopeningHoursformattedAddress
 { "includedTypes": ["school","transport","bus","convenience_store"],
"excludedTypes": ["lodging"], "includedPrimaryTypes":
["restaurant","tourist_attraction","airport"], "excludedPrimaryTypes":
["lodging"], "maxResultCount": 20, "locationRestriction": { "circle": {
"center": { "latitude": 37.7937, "longitude": -122.3965 }, "radius": 500.0 } } }

3. 使用动态地图和 Directions API 添加互动性

  • 通过查询 Directions API 获取最新的路段和步骤 。 * 在下一部分中使用时间。

示例路线

4. 在互动时显示地点的详细信息

  1. 说明displayNametypesratinguserRatingCountpriceLevel

    时间:来自之前的 Directions API 查询。

  2. 评价: reviews[i].authorreviews[i].ratingreviews[i].text

  3. 图片:在附近搜索(新)API 的无限制预览版期间,您必须使用地点详情查询place.id以获取photo_reference,然后在体验中一次查询一个

地点详情

查询次数和相关费用

总结

本地探索体验是提升用户价值的强大方式。此演示实现具有许多功能,您在 Google Maps Platform 上创建此类体验时可能会包含这些功能,并利用 附近搜索(新)API 的特殊功能。

后续步骤

建议进一步阅读以下内容:

贡献者

主要作者:

Thomas Anglaret | Google Maps Platform 解决方案工程师