移动html5启动手机的原生导航应用程序

Question

我正在开发一个phonegap/cordova应用程序.有没有办法在浏览器视图中打开手机的原生导航应用程序？或者是否有从html5应用程序打开本机地图应用程序的最佳做法？或者它们都是特定于平台的？

我已经阅读了以下适用于某些Android版本的一些地方

<a href="geo:some address here" />Navigate to here</a>

这适用于iOS

<a href="http://maps.apple.com/?daddr=San+Francisco,+CA&saddr=cupertino">Directions</a>

我很惊讶Phonegap没有实现这样的东西.

Answer 1

您可以使用神奇的"地图:"协议在iOS 5(谷歌地图)和iOS 6(Apple地图)上打开原生导航应用程序,例如 window.location = "maps:daddr=50.4,-4.5"

但要在Android上启动原生Google Navigator应用,您需要使用phonegap插件.我为了自己的目的写了这个.

更新 该插件现已针对Phonegap 3.x进行了更新,并支持Android,iOS和Windows Phone,包括选择在iOS上使用Google地图的选项.

该插件位于:https://github.com/dpa99c/phonegap-launch-navigator

Answer 2

插件很棒!感谢分享!我在我的应用程序中尝试过但不幸的是我有Phonegap版本3.x而你的插件只适用于Phonegap 2.x :(

所以为了让它在Phonegap 3.x上运行,我从你的github repo获得了插件并进行了一些更改,以便它适用于3.x

可以从我的github repo下载修改后的Phonegap 3.x PhoneNavigator插件:https: //github.com/viktor0710/PhoneNavigator-Phonegap-3.x.git

如何将其集成到您的Phonegap 3.x项目中:

1. 打开控制台窗口
2. 转到您的Phonegap应用程序根目录
3. 然后执行:phonegap local plugin add https://github.com/viktor0710/PhoneNavigator-Phonegap-3.x.git
4. 从您的应用程序中的repo(www/phonenavigator.js)复制"phonenavigator.js"(例如:yourapp/www)
5. 在你的应用程序中包含"phonenavigator.js":
6. 从你的应用程序中的repo(www/cordova.js)复制"cordova.js"(例如:yourapp/www)
7. 在你的应用程序中包含"cordova.js":

如何使用它:

//function declaration
function navigateTo (lat, lon, successFn, errorFn) {
    cordova.require('cordova/plugin/phonenavigator').doNavigate(lat, lon, successFn, errorFn);
}

//set lat and lon variables. Most probably read them from the UI
var latitude =  48.137607;
var longitude = 11.568569;

//call function
navigateTo(
    latitude,
    longitude,
    function(){
        console.log("Successfully opened navigator");
    },
    function(){
        console.log("Error opening navigator");
    }
);

Answer 3

如上所述,以下适用于Galaxy S4 Android(刚刚测试过),用于显示Google地图/导航应用并点亮:

<a href="geo:37.786971,-122.399677;u=35">Wikimedia Headquarters</a>

图片来源:http://en.wikipedia.org/wiki/Geo_URI#Example

另请在此处查看答案:https://stackoverflow.com/a/19765368/2728686

Answer 4

为了记录,如果有人通过像我一样在谷歌上找到这个帖子,它直接适用于我,使用Ionic框架,做两件事:

• 在你的应用程序的myapp.config(...)中添加

  $compileProvider.aHrefSanitizationWhitelist(/^\s*(https?|geo):/);
  

  (别忘了添加$ compileProvider作为依赖项)

• 在config.xml中,添加该行

  <access origin="geo:*" launch-external="yes"/>
  

就这样.