搜索地址

字数统计: 708 字
阅读时长: 约 1 分钟
当前版本: 4.29

了解如何使用搜索微件和地理编码服务查找地址或地点。

搜索地址

地理编码是将地址或地点文本转换为位置的过程。地理编码服务可以搜索地址或地点并执行反向地理编码。使用 Search 微件访问地理编码服务并执行交互式搜索。

在本教程中，我们使用 Search 微件来搜索地址和位置。

步骤 ​

创建新 Pen ​

  1. 要开始使用，请完成显示地图教程 。

添加模块 ​

  1. 在 require 语句中，添加 Search 模块。

    更多内容

    GeoScene Maps SDK for JavaScript 提供有 AMD 模块和 ES 模块，但本教程基于 AMD。AMD require 函数使用引用来确定加载哪些模块 - 例如，您可以指定 "geoscene/Map" 来加载 Map 模块。加载模块后，它们将作为参数 (例如，Map) 传递给回调函数，以便在应用程序中使用。保持模块引用和回调参数的顺序相同是很重要的。有关不同类型模块的更多信息，请访问工具指南主题。

    js
    require([
    "geoscene/config",
    "geoscene/Map",
    "geoscene/views/MapView",

    "geoscene/widgets/Search"

], function(geosceneConfig, Map, MapView, Search) {

添加搜索微件 ​

Search 微件是一个可见控件，允许您以交互方式搜索地址和地点。它会在您键入时提供建议，并允许您选择结果。当您选择结果时，它将缩放到该位置并显示一个具有地址信息的弹出窗口。默认情况下，微件使用 locator 和 source 以访问地理编码服务。

  1. 创建 Search 微件。将 view 属性设置为 view。

    js
        const view = new MapView({
        container: "viewDiv",
        map: map,
        center: [-122.3321,47.6062],
        zoom: 12
    });

    const search = new Search({ //Add Search widget
        view: view
    });

  2. 将微件添加至视图的右上角。在 DefaultUI 中了解有关将 UI 组件添加到 view 的更多信息。

    js
        const search = new Search({ //Add Search widget
        view: view
    });

    view.ui.add(search, "top-right"); //Add to the map

运行应用程序 ​

在 CodePen 中，运行代码以显示地图。

可以尝试搜索位置。

下一步是什么？ ​

要了解如何使用其他API 功能，请参阅以下教程：