简介
sygic-custom-url
是一个可以将自定义的地理位置信息转换成 Sygic 导航 APP 可以识别的 URL 格式的 npm 包。通过该包,你可以在你的前端项目中实现从你的页面跳转到 Sygic 导航 APP 并自动导航至指定位置的功能。
安装
在你的项目中安装 sygic-custom-url
前,请确保已正确配置了 npm 和 Node 环境。安装命令如下:
npm install sygic-custom-url --save
使用
在你的前端项目中,可以通过以下代码使用 sygic-custom-url
:
import { getSygicCustomUrl } from 'sygic-custom-url'; const { lat, lng } = { lat: 37.7749, lng: -122.4194 }; // 你要进行导航的目标地点的经纬度信息 const sygicUrl = getSygicCustomUrl(lat, lng); window.open(sygicUrl);
在上述代码中,通过调用 getSygicCustomUrl
函数可以获取到指定目标地点的 Sygic 导航 APP 可识别的 URL 字符串,然后将其通过 window.open
函数打开,即可跳转至 Sygic 导航 APP 并启动导航功能。
参数说明
getSygicCustomUrl
函数有两个必备参数:lat
和 lng
,分别表示要进行导航的目标地点的纬度和经度信息,类型为 Number。此外,该函数还有四个可选参数:
zoom
:地图缩放级别,默认值为 15。sourceLat
和sourceLng
:出发点的纬度和经度信息,默认为空。sourceName
:出发点名称,默认为空。
示例
假设你现在正在开发一个旅游类的 web 应用,用户可以自由浏览并添加感兴趣的景点到自己的行程表上。在该应用中,你想为用户提供一个一键导航的功能,让他们可以在点击某个景点后直接跳转到 Sygic 导航 APP 并启动导航功能。你可以按照以下步骤完成该功能的实现:
- 在用户点击某个景点时,获取该景点的经纬度信息。
- 将经纬度信息传入
getSygicCustomUrl
函数中,获取到 Sygic 导航 URL 字符串,并使用window.open
函数打开。 - 为了让用户能够在返回应用时接着浏览景点列表,你可以在
getSygicCustomUrl
函数中传入当前用户位置的经纬度信息作为出发点。
以下是实现上述功能的示例代码:
-- -------------------- ---- ------- --------- ----- ------ ------ ------------------- ------- ------ ------------- ---- --- ------------------ ------------------- -------------------------------- --- ------------------ -------------------- ------------------------------ --- ------------------ ------------------ ---------------------------- ----- ------- ---------------------------------------------------------------- -------- ----- ---- - ----------------------------- ----- - ---- ------- ---- ------ - - - ---- -------- ---- --------- -- -------- ------------------- - ----- - -------- - ---- ---- ---- - - - ---------- ----- -------- - ---------------------- ---- --- ------- ------- -------- ----------- ---------------------- - ------------------------------ ----------------- --------- ------- -------
在上述代码中,在每个景点列表项标签中,你可以添加 data-lat
、data-lng
、data-name
属性来存储该景点的经纬度和名称信息。通过在 JS 中获取这些信息,再传入 getSygicCustomUrl
函数中,即可生成 Sygic 导航 URL 字符串,并通过 window.open
函数在新窗口中打开。
注意事项
使用 Sygic 导航 APP 进行导航需要 APP 已经安装在用户的手机上。如果用户手机中没有安装 Sygic 导航 APP,通过上述方法在 web 应用中打开 Sygic 导航 URL 会无法完成跳转和导航功能的启动。因此,对于该功能的使用限制需要在应用中进行充分提示和解释。
来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/600562f581e8991b448e0b5d