离子2打开谷歌地图与2个位置的方向

时间:2017-10-14 16:43:27

标签: google-maps typescript ionic-framework ionic2 directions

当我点击按钮并显示来自源位置和目的地位置的路线时,我需要打开谷歌地图。通过搜索很多我找到了InAppBrowser的方法,但它不起作用。

以下是我找到的代码:

  this.geolocation.getCurrentPosition().then((data) => {
      let lat = data.coords.latitude;
      let lng = data.coords.longitude;
      let bro = new InAppBrowser;

      if (this.platform.is('ios')) {
        bro.create('geo://?q=&saddr=' + data.coords.latitude + ',' + data.coords.longitude + '&daddr=' + this.dataitem['lat'] + ',' + this.dataitem['lng'], '_system');
      };
      if (this.platform.is('android')) {
        bro.create('geo://?q=' + data.coords.latitude + ',' + data.coords.longitude + '&daddr=' + this.dataitem['lat'] + ',' + this.dataitem['lng'] + '', '_system');
      };
  }).catch((err) => {
      console.log(JSON.stringify(err));
  });

有人可以帮忙吗?

2 个答案:

答案 0 :(得分:4)

安装 Launch Navigator 插件:

  1. 安装Cordova和Ionic Native插件:
  2.   

    离子cordova插件添加   uk.co.workingedge.phonegap.plugin.launchnavigator

         

    npm install --save @ ionic-native / launch-navigator

    1. 将LaunchNavigator添加到 app.module.ts
    2. 将此代码添加到您的ts文件中:

      source: any = [22.303894, 70.802160] // source lat,long
      destination: any =  [23.022505, 72.571362] // dest lat,long
      
      navigate(){
      
      let options: LaunchNavigatorOptions = {
         start: this.source
      };
      
       this.launchnavigator.navigate(this.destination, options)
         .then(
          success => alert('Launched navigator'),
          error => alert('Error launching navigator: ' + error)
       );
      }
      
    3. 完成!

答案 1 :(得分:0)

使用此方法打开地图,确保已安装In App Browser插件。

let destination = latitude + ',' + longitude;

if(this.platform.is('ios')){
  window.open('maps://?q=' + destination, '_system');
} else {
 let label = encodeURI('My Label');
 window.open('geo:0,0?q=' + destination + '(' + label + ')', '_system');
}

Reference