Ionic 3 - 使用 Google Maps / Apple Maps 應用程序無需導航即可打開地理定位

Question

在適用於Android和iOS Ionic 3應用程序中，我需要使用Google Maps （如果已安裝）或Apple Maps打開特定的地理位置。 我發現Launch Navigator 的功能幾乎相同。

1. 有沒有辦法讓我選擇不導航到指定位置而只使用Launch Navigator顯示marker ？
2. 如果沒有，是否還有其他選擇可以使這成為可能？

Answer 1

我有同樣的問題，這就是我想出的。 有三個重要步驟

1. 檢查用戶是在 iOS 還是 Android 上
   • 需要包括 Platform import { Platform } from 'ionic-angular';
2. 如果他們在 iOS 上檢查谷歌地圖
   • 我正在使用 LaunchNavigator 檢查應用程序
     import { LaunchNavigator, LaunchNavigatorOptions } from '@ionic-native/launch-navigator';
3. 使用我們的 GPS 參數打開相應的應用程序
   • 要打開外部應用程序，我們需要應用程序內瀏覽器
     import { InAppBrowser } from '@ionic-native/in-app-browser';

那么我們就擁有了在 iOS 上打開谷歌地圖所需的一切（如果有的話），沒有導航

if (this.platform.is('ios')) {
      //try google maps first
      this.launchNavigator.isAppAvailable(this.launchNavigator.APP.GOOGLE_MAPS).then(
        response => {
          if(response) {
              window.open('comgooglemaps://?q=' + lat + ',' + lng + '(' + marker_name + ')', '_system');
          }
          else {
              window.open('maps://?q=' + lat + ',' + lng, '_system');
          }
        },
        failure => {
          //check failed;
        }
      );
}
else if (this.platform.is('android')) {
      window.open('geo://' + lat + ',' + lng + '?q=' + lat + ',' + lng + '(' + marker_name + ')', '_system');
}

Answer 2

試試這個，它讓用戶選擇要打開的應用程序導航（位智或地圖或...），並在給定的緯度和經度上添加標記：

  import { Platform } from '@ionic/angular';

...

  constructor(
    public platform: Platform
  ) {
  }

  public openMapsApp(lat: number, lng: number) {
    const geocoords = lat + ',' + lng;

    if (
      this.platform.is('ios')
      && this.platform.is('iphone')
      && this.platform.is('ipad')
    ) {
      window.open('maps://?q=' + geocoords, '_system');
      return;
    }
    
    if (this.platform.is('desktop')) {
      window.open('https://www.google.com/maps?q=' + geocoords);
      return;
    }

    const label = encodeURI('7 East Street'); // encode the label!
    window.open('geo:' + geocoords + '?q=' + geocoords + '(' + label + ')', '_system');

  }