Question

我正在开发一个非常小的HTML5 / javascript网站，由Android / iphone等设备的移动浏览器打开。我正在使用HTML5的地理位置来获取当前位置，但是一旦我有了，我想要导航到某个目的地。我想出的最好的是用户点击类似于以下链接的链接

https://maps.google.com/maps?saddr=london&daddr=paris

然而，这不会打开导航应用程序，它只是切换到移动谷歌地图网站。有没有办法使用HTML5 / javascript打开导航（GPS）应用程序？像这样：

navigate:London to Paris

Answer 1

您可以使用地理位置链接在Android上打开导航应用。不幸的是，iOS不支持此功能。但一般情况下你必须记住，你不能直接控制在设备上处理这个链接的方式，因为我说iOS什么都不做，甚至可能显示无效的链接错误，并且可能有Android设备也不支持此功能。请记住，您无法确定它是否可以在任何地方工作，因此您的网站不应该依赖于此功能，它应该只是支持此功能的设备的额外可用性。

1）在原生地图应用中显示位置

使用地理位置链接，您可以指定如下位置：

geo:longitude,laditude

或者像这样：

geo:street+address

您还可以搜索这样的地址：

geo:?q=street+address

您还可以像这样定义缩放级别：

geo:street+address?z=3

还可以组合多个参数，如下所示：

geo:?q=street+address&z=15

但请注意，这不会按预期工作。在这种情况下，在谷歌地图中，它以定义的缩放级别开始，然后开始搜索并放大目标。

Here是一些Android文档。

2）在Google地图中打开路线

您还可以使用以下链接显示两个位置之间的路线：

http://maps.google.com/maps?saddr=street+adress&daddr=street+address

坐标也适用于此：

http://maps.google.com/maps?saddr=50,10&daddr=50,20

您可以再次使用它：

<a href="http://maps.google.com/maps?saddr=New+York&daddr=San+Francisco">Route New York --> San Francisco</a>

3）立即开始导航

使用此选项，链接将打开到某个位置的路径，设备不仅会显示路线，还会立即开始导航：

google.navigation:q=street+address

您也可以使用坐标：

google.navigation:q=50,10

您可以这样使用它：

<a href="google.navigation:q=San+Francisco">Navigation to San Francisco</a>

4）测试

我使用以下HTML测试了运行Android 4.4（KitKat）的Nexus 5上的所有内容：

<!DOCTYPE html>
<html>

<head>
  <title>Geo Link Test</title>
</head>

<body>
  <p><a href="geo:50,10">Location 50/10</a></p>
  <p><a href="geo:Vienna">Location Vienna</a></p>
  <p><a href="geo:?z=5&q=New+York">Zoom 5, Search for New York</a></p>
  <p><a href="geo:?q=San+Francisco&z=15">Zoom 15, Search for San Francisco</a></p>
  <p><a href="google.navigation:q=San+Francisco">Navigation to San Francisco</a></p>
  <p><a href="google.navigation:q=50,10">Navigation to 50/10</a></p>
  <p><a href="http://maps.google.com/maps?saddr=New+York&daddr=San+Francisco">Route New York --> San Francisco</a></p>
  <p><a href="http://maps.google.com/maps?saddr=50,10&daddr=50,20">Route 50/10 --> 50/20</a></p>
</body>

</html>

Answer 2

经过大量的链接测试后，我已经为我解决了这个问题：

<a href="http://maps.google.com/maps?q=loc: <lat>,<lng>&navigate=yes">nav</a>

这个正在打开用户导航应用程序选择菜单，它会传递您想要导航到的绳索。

享受

Answer 3

自从这个问题首次发布和回答以来，截至2017年10月，Google开发了一个名为Maps URL的API。

这是一个用于启动Google地图的通用跨平台网址。

https://www.google.com/maps/dir/?api=1是可能包含导航的地图的端点。

您添加以下参数：

原产地：&origin=new+york
目的地：&destination=san+fransisco
导航：&dir_action=navigate

如果省略原点，它将检测设备的位置，这可能更适合导航：

https://www.google.com/maps/dir/?api=1&destination=san+fransisco&dir_action=navigate

这不会立即打开导航，但会将您带到谷歌地图，该地图将在页面上显示导航图标，并为用户提供使用该应用程序的选项（如果他们没有，则下载它它）。这似乎是一个很好的解决方案。我刚刚在浏览器，Google Pixel和我的iPhone上测试了它，它在每个移动设备上的工作方式都相同。

查看其余文档以获取更多有用的功能：https://developers.google.com/maps/documentation/urls/guide

有没有办法从移动浏览器调用导航？

3 个答案:

1）在原生地图应用中显示位置

2）在Google地图中打开路线

3）立即开始导航

4）测试