anshul raj
anshul raj

Reputation: 125

log the coordinates, update within sec. in Ionic

Here is my code which logs the location but the update time is 5sec and I want to reduce it to around 500ms. the app is working properly just want to reduce the time

  import { Component, NgZone } from '@angular/core';
import { Plugins } from '@capacitor/core';
const { Geolocation } = Plugins;
import { NativeGeocoder, NativeGeocoderResult, NativeGeocoderOptions } from '@ionic-native/native-geocoder/ngx';
@Component({
  selector: 'app-tab3',
  templateUrl: 'tab3.page.html',
  styleUrls: ['tab3.page.scss']
})
export class Tab3Page {
  public lat: any;
  public lng: any;
  points: any;
  wait: any;
  constructor(public ngZone: NgZone) { 
    this.points = [];
  }
  track() {
    this.wait = Geolocation.watchPosition({}, (position, err) => {
      this.ngZone.run(() => {
        this.lat = position.coords.latitude;
        this.lng = position.coords.longitude;
        let date = new Date().toLocaleTimeString();
        this.addNewLocation(position.coords.latitude, position.coords.longitude,date);
      })
    })
  }
  stopTracking() {
    Geolocation.clearWatch({ id: this.wait });
  }
  addNewLocation(lat, lng, time) {
    this.points.unshift({
      lat,
      lng,
      time,
    });
  }
}

Upvotes: 1

Views: 409

Answers (1)

Sergey Rudenko
Sergey Rudenko

Reputation: 9227

Please try to leverage the timeout option:

The PositionOptions.timeout property is a positive long value representing the maximum length of time (in milliseconds) the device is allowed to take in order to return a position. The default value is Infinity, meaning that getCurrentPosition() won't return until the position is available.

You can use it like so:

track() {
    this.wait = Geolocation.watchPosition({ enableHighAccuracy: false, timeout: 500, maximumAge: 0 }, (position, err) => {
      this.ngZone.run(() => {
        this.lat = position.coords.latitude;
        this.lng = position.coords.longitude;
        let date = new Date().toLocaleTimeString();
        this.addNewLocation(position.coords.latitude, position.coords.longitude,date);
      })
    })
  }

Capacitor docs also confirm this should work: https://capacitorjs.com/docs/apis/geolocation#type-162408

If the watchPosition method is not helping your use case you could try implementing your own "watch" method. Unfortunately I do not have access to an app with capacitor, but something like the below should get you on the right track:

import { Component, NgZone } from '@angular/core';
import { Plugins } from '@capacitor/core';
const { Geolocation } = Plugins;
import { NativeGeocoder, NativeGeocoderResult, NativeGeocoderOptions } from '@ionic-native/native-geocoder/ngx';
import { interval } from 'rxjs';
import { Subscription } from 'rxjs';
import { concatMap } from 'rxjs/operators';

@Component({
  selector: 'app-tab3',
  templateUrl: 'tab3.page.html',
  styleUrls: ['tab3.page.scss']
})
export class Tab3Page {

  private subscription: Subscription;

  constructor(public ngZone: NgZone) { 
  }

  track() {
    const interval500 = interval(500);
    this.subscription = interval500.pipe(
        concatMap(val => Geolocation.getCurrentPosition())
    ).subscribe(coordinates => console.log(coordinates));
  }

  stopTracking() {
    this.subscription.unsubscribe();
  }

}

Basically you ll need your own interval (500ms) and then calling getCurrentPosition method for each "tick" of the interval. Then unsubscribing duly.

This is really not recommended way as this will cause battery issues etc. Also the device might not be able to supply the geo data still if it has device level limitation on amount of updates.

Depending on the use case you might want to "approximate" geo data in between 5 second intervals instead.

Upvotes: 1

Related Questions