http://i-doctor.sakura.ne.jp/web/doku.php?id=00.ionic4:10.ionic4とcapacitorでgps取得

tab1.page.html

<ion-header>
  <ion-toolbar>
    <ion-title>
      GPS
    </ion-title>
  </ion-toolbar>
</ion-header>

<ion-content>
  <ion-card class="welcome-card">
    <img src="/assets/shapes.svg" alt="" />
    <ion-card-header>
      <ion-card-subtitle>Get Started</ion-card-subtitle>
      <ion-card-title>Capacitor Geolocation</ion-card-title>
    </ion-card-header>
    <ion-card-content>
      <ion-item>Latitude: {{ latitude }}</ion-item>
      <ion-item>Longitude: {{ longitude }}</ion-item>
    </ion-card-content>
  </ion-card>

  <ion-button expand="full" (click)="add_to_home()" *ngIf="showBtn">
    Install
  </ion-button>
</ion-content>

tab1.page.ts

import { Component } from '@angular/core';
import { Geolocation } from '@capacitor/core';

@Component({
  selector: 'app-tab1',
  templateUrl: 'tab1.page.html',
  styleUrls: ['tab1.page.scss']
})
export class Tab1Page {
  latitude: number;
  longitude: number;

  showBtn = false;
  deferredPrompt;

  ngOnInit() {
    this.showBtn = true;
    window.addEventListener('beforeinstallprompt', e => {
      // Prevent Chrome 67 and earlier from automatically showing the prompt
      e.preventDefault();
      // Stash the event so it can be triggered later on the button event.
      this.deferredPrompt = e;

      // Update UI by showing a button to notify the user they can add to home screen
      this.showBtn = true;
    });

    // button click event to show the promt

    window.addEventListener('appinstalled', event => {
      alert('installed');
    });

    if (window.matchMedia('(display-mode: standalone)').matches) {
      alert('display-mode is standalone');
    }
  }

  add_to_home() {
    // debugger;
    // hide our user interface that shows our button
    // Show the prompt
    this.deferredPrompt.prompt();
    // Wait for the user to respond to the prompt
    this.deferredPrompt.userChoice.then(choiceResult => {
      if (choiceResult.outcome === 'accepted') {
        alert('User accepted the prompt');
      } else {
        alert('User dismissed the prompt');
      }
      this.deferredPrompt = null;
    });
  }

  constructor() {
    this.getLocation();
  }

  async getLocation() {
    const position = await Geolocation.getCurrentPosition();
    this.latitude = position.coords.latitude;
    this.longitude = position.coords.longitude;
  }
}