npm 包 sygic-custom-url 使用教程

阅读时长 5 分钟读完

简介

sygic-custom-url 是一个可以将自定义的地理位置信息转换成 Sygic 导航 APP 可以识别的 URL 格式的 npm 包。通过该包,你可以在你的前端项目中实现从你的页面跳转到 Sygic 导航 APP 并自动导航至指定位置的功能。

安装

在你的项目中安装 sygic-custom-url 前,请确保已正确配置了 npm 和 Node 环境。安装命令如下:

使用

在你的前端项目中,可以通过以下代码使用 sygic-custom-url

在上述代码中,通过调用 getSygicCustomUrl 函数可以获取到指定目标地点的 Sygic 导航 APP 可识别的 URL 字符串,然后将其通过 window.open 函数打开,即可跳转至 Sygic 导航 APP 并启动导航功能。

参数说明

getSygicCustomUrl 函数有两个必备参数:latlng,分别表示要进行导航的目标地点的纬度和经度信息,类型为 Number。此外,该函数还有四个可选参数:

  • zoom:地图缩放级别,默认值为 15。
  • sourceLatsourceLng:出发点的纬度和经度信息,默认为空。
  • sourceName:出发点名称,默认为空。

示例

假设你现在正在开发一个旅游类的 web 应用,用户可以自由浏览并添加感兴趣的景点到自己的行程表上。在该应用中,你想为用户提供一个一键导航的功能,让他们可以在点击某个景点后直接跳转到 Sygic 导航 APP 并启动导航功能。你可以按照以下步骤完成该功能的实现:

  1. 在用户点击某个景点时,获取该景点的经纬度信息。
  2. 将经纬度信息传入 getSygicCustomUrl 函数中,获取到 Sygic 导航 URL 字符串,并使用 window.open 函数打开。
  3. 为了让用户能够在返回应用时接着浏览景点列表,你可以在 getSygicCustomUrl 函数中传入当前用户位置的经纬度信息作为出发点。

以下是实现上述功能的示例代码:

-- -------------------- ---- -------
--------- -----
------
  ------
    -------------------
  -------
  ------
    -------------
    ----
      --- ------------------ ------------------- --------------------------------
      --- ------------------ -------------------- ------------------------------
      --- ------------------ ------------------ ----------------------------
    -----
    ------- ----------------------------------------------------------------
    --------
      ----- ---- - -----------------------------
      ----- - ---- ------- ---- ------ - - - ---- -------- ---- --------- --
      -------- ------------------- -
        ----- - -------- - ---- ---- ---- - - - ----------
        ----- -------- - ---------------------- ---- --- ------- ------- -------- -----------
        ----------------------
      -
      ------------------------------ -----------------
    ---------
  -------
-------

在上述代码中,在每个景点列表项标签中,你可以添加 data-latdata-lngdata-name 属性来存储该景点的经纬度和名称信息。通过在 JS 中获取这些信息,再传入 getSygicCustomUrl 函数中,即可生成 Sygic 导航 URL 字符串,并通过 window.open 函数在新窗口中打开。

注意事项

使用 Sygic 导航 APP 进行导航需要 APP 已经安装在用户的手机上。如果用户手机中没有安装 Sygic 导航 APP,通过上述方法在 web 应用中打开 Sygic 导航 URL 会无法完成跳转和导航功能的启动。因此,对于该功能的使用限制需要在应用中进行充分提示和解释。

来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/600562f581e8991b448e0b5d

纠错
反馈