rsa
July 22, 2017, 3:54pm
1
In fallowing code I’m trying to access new geolocation of current device and speed of motion but I don’t know am i did it right or no, the output is attached also bellow Ho much is my speed?
@Component({
selector: 'page-page1',
templateUrl: 'page1.html'
})
export class Page1 {
public lat;
public lng;
public speed;
public watch: any;
constructor(public navCtrl: NavController, public Geolocation: Geolocation, public zone: NgZone,
public backgroundGeolocation: BackgroundGeolocation,
private deviceMotion: DeviceMotion
) {
this.startTracking();
}
startTracking() {
this.deviceMotion.getCurrentAcceleration().then(
(acceleration: DeviceMotionAccelerationData) => console.log(acceleration),
(error: any) => console.log(error)
);
var subscription = this.deviceMotion.watchAcceleration().subscribe((acceleration: DeviceMotionAccelerationData) => {
console.log(acceleration);
});
let config = {
desiredAccuracy: 0,
stationaryRadius: 20,
distanceFilter: 10,
debug: true,
interval: 2000
};
this.backgroundGeolocation.configure(config).subscribe((location) => {
console.log('BackgroundGeolocation: ' + location.latitude + ',' + location.longitude);
this.zone.run(() => {
this.lat = location.latitude;
this.lng = location.longitude;
this.speed = location.speed;
});
}, (err) => {
console.log(err);
});
this.backgroundGeolocation.start();
let options = {
frequency: 3000,
enableHighAccuracy: true
};
this.watch = this.Geolocation.watchPosition(options).filter((p: any) => p.code === undefined).subscribe((position: Geoposition) => {
console.log(position);
this.zone.run(() => {
this.lat = position.coords.latitude;
this.lng = position.coords.longitude;
});
});
}
stopTracking() {
console.log('stopTracking');
this.backgroundGeolocation.finish();
this.watch.unsubscribe();
}
}
kvnjo
March 28, 2018, 1:26am
2
is it work ? because i have tried it and nothing coming out…
rsa
March 28, 2018, 5:22pm
3
At that time that was working for me. I used to check with car speed it was about same meter per secconds i think.
kvnjo
April 4, 2018, 12:55am
4
Can i get the .TS file and the .html file ? because i had tried your code but it doesnt work on my laptop…
Please send the .TS file and the .html file to my email : jonathankevin88@gmail.com
rsa
April 7, 2018, 5:40pm
5
I don’t have them now but I used this link.
kvnjo
April 11, 2018, 2:12am
6
Hi…
I had succeed used your code on my device…
But the speed doesnt show on my device…(i will show it on my attach file
)
can u explain why ???
And where do u try the code ?? at the car, motorcycle, or just walking ??
rsa
April 11, 2018, 3:47am
7
I used the same code. speed is Meter / second and if you multiply ((speed *3600)/1000) you will get the Km/Hrs this is my code
**HTML:**
<ion-header>
<ion-navbar>
<button ion-button menuToggle>
<ion-icon name="menu"></ion-icon>
</button>
<ion-title>Home</ion-title>
</ion-navbar>
</ion-header>
<ion-content padding>
<ion-list>
<ion-item>
<ion-label color="primary">Latitued</ion-label>
<ion-label color="danger">{{lat}}</ion-label>
</ion-item>
<ion-item>
<ion-label color="primary">Longitued</ion-label>
<ion-label color="danger">{{lng}}</ion-label>
</ion-item>
<ion-item>
<ion-label color="primary" >Speed</ion-label>
<ion-label color="secondery" >{{speed}}</ion-label>
</ion-item>
</ion-list>
</ion-content>
home.ts
import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import { BackgroundGeolocation} from '@ionic-native/background-geolocation';
import { DeviceMotion, DeviceMotionAccelerationData } from '@ionic-native/device-motion';
import { NgZone } from '@angular/core';
import { Geolocation, Geoposition } from '@ionic-native/geolocation';
import 'rxjs/add/operator/filter';
@Component({
selector: 'page-home',
templateUrl: 'home.html'
})
export class HomePage {
public lat;
public lng;
public speed;
public watch: any;
public x;
constructor(public navCtrl: NavController, public Geolocation: Geolocation, public zone: NgZone,
public backgroundGeolocation: BackgroundGeolocation,
private deviceMotion: DeviceMotion
) {
this.startTracking();
}
startTracking() {
/*this.deviceMotion.getCurrentAcceleration().then(
(acceleration: DeviceMotionAccelerationData) => //console.log(acceleration)
this.x=0,
(error: any) => console.log(error)
);
var subscription = this.deviceMotion.watchAcceleration().subscribe((acceleration: DeviceMotionAccelerationData) => {
//console.log(acceleration);
});
*/
let config = {
desiredAccuracy: 0,
stationaryRadius: 5,
distanceFilter: 10,
debug: true,
interval: 1000
};
this.backgroundGeolocation.configure(config).subscribe((location) => {
//console.log('BackgroundGeolocation: ' + location.latitude + ',' + location.longitude);
// console.log(this.lat , this.lng, this.speed);
this.zone.run(() => {
this.lat = location.latitude;
this.lng = location.longitude;
this.speed = (location.speed * 3600)/1000 ; // can be speed * 3.6 and should be round for 2 decimal
});
}, (err) => {
console.log(err);
});
this.backgroundGeolocation.start();
let options = {
frequency: 1000,
enableHighAccuracy: true
};
this.watch = this.Geolocation.watchPosition(options).filter((p) => p.coords !== undefined)
.subscribe((position: Geoposition) => {
//console.log(position);
this.zone.run(() => {
this.lat = position.coords.latitude;
this.lng = position.coords.longitude;
});
});
}
stopTracking() {
console.log('stopTracking');
this.backgroundGeolocation.finish();
this.watch.unsubscribe();
}
}
kvnjo
April 12, 2018, 2:18am
8
Hi RSA…
I had tried your code and its work on my device but there’s one problem…
The speed just return Nan (Not a Number) ?
Do u know how to fix it ??
rsa
April 12, 2018, 6:28pm
9
I don’t saw this before. it is because of multiplying and dividing on starting moment, i guess you can solve it by using + oprator
:
this.speed = (+location.speed * 3600)/1000 ;
or
this.speed = Number.isNaN(location.speed * 3.6) ? 0 : (location.speed * 3.6);
kvnjo
April 18, 2018, 2:50am
10
Hi RSA,
Thanks a lot for your help. But the speed still not shown on my device. Even though i set the speed = location.speed, without the multiplication with 3.6. What should i do now…??
This my app.ts script…
import { Component } from ‘@angular /core’;
import { NavController } from ‘ionic-angular’;
import { NgZone } from ‘@angular /core’;
import { BackgroundGeolocation, BackgroundGeolocationConfig, BackgroundGeolocationResponse} from ‘@ionic-native /background-geolocation’;
// // import { DeviceMotion, DeviceMotionAccelerationData } from ‘@ionic-native /device-motion’;
import { Geolocation,Geoposition } from ‘@ionic-native /geolocation’;
import ‘rxjs/add/operator/filter’
@Component ({
selector: ‘page-home’,
templateUrl: ‘home.html’
})
export class HomePage {
public lat;
public lng;
public speed: number;
public watch: any;
constructor(public navCtrl: NavController, public Geolocation: Geolocation, public zone: NgZone, private backgroundGeolocation: BackgroundGeolocation) {
this.startTracking();
}
startTracking() {
/*this.deviceMotion.getCurrentAcceleration().then(
(acceleration: DeviceMotionAccelerationData) => //console.log (acceleration)
this.x=0,
(error: any) => console.log(error)
);
var subscription = this.deviceMotion.watchAcceleration().subscribe((acceleration: DeviceMotionAccelerationData) => {
//console.log (acceleration);
});
*/
const config: BackgroundGeolocationConfig = {
desiredAccuracy: 0,
stationaryRadius: 5,
distanceFilter: 10,
debug: true,
interval: 1000
};
this.backgroundGeolocation.configure(config)
.subscribe((location: BackgroundGeolocationResponse) => {
//console.log('BackgroundGeolocation: ' + location.latitude + ',' + location.longitude);
// console.log(this.lat , this.lng, this.speed);
console.log(“cekaja”);
this.lat = location.latitude;
this.lng = location.longitude;
this.speed = location.speed; // can be speed * 3.6 and should be round for 2 decimal
console.log("coba");
});
this.backgroundGeolocation.start();
this.backgroundGeolocation.stop();
let options = {
frequency: 1000,
enableHighAccuracy: true
};
this.watch = this.Geolocation.watchPosition(options).filter((p) => p.coords !== undefined)
.subscribe((position: Geoposition) => {
//console.log(position);
this.zone.run(() => {
this.lat = position.coords.latitude;
this.lng = position.coords.longitude;
this.speed = position.coords.speed;
console.log(position.coords.speed);
console.log("coba2");
});
});
}
// stopTracking() {
// console.log('stopTracking');
// this.backgroundGeolocation.finish();
// this.watch.unsubscribe();
// }
}
kvnjo
April 18, 2018, 3:53am
11
Hi RSA…
One question again. If i’m not moving what should the speed return ??
Is it 0 or doesnt show anything ??
Thanks…
rsa
April 18, 2018, 5:16am
12
If you set public speed = 0;
then should be zero at first.
For me speed is blank in beginning, after starting to moving it shows the moment speed (km/hrs) like cars.
kvnjo
April 25, 2018, 2:41am
13
Hi RSA…
Thank you for your help.Your code is already running on my device, but the app can’t run on all phones. I have tried the app in samsung galaxy a3 and the app doesnt running but the app running in asus zenfone. Does ionic not support all mobile phones ??
rsa
April 25, 2018, 3:57am
14
What was your problem? is that crash on starting? if it crash with can not fine index.html
you had to add some delay on loading in config.xml
<preference name="SplashScreenDelay" value="3000" />
to
<preference name="SplashScreenDelay" value="7000" />
also ionic use minimu sdk 19 you may use 16 like in same file.
<preference name="android-minSdkVersion" value="16" />
<preference name="android-targetSdkVersion" value="16" />
kvnjo
April 25, 2018, 4:22am
15
the problem is when i tried the app on my samsung speed feature does not want to appear while on my asus feature speed would appear…
Hi did you solve your problem?
Are you able to show the device speed using Background geolocation?
Thank you
Hi
I am getting the lat lng by geolocation.
But when I am trying to build the app I am getting error. Plz tell how to resolve
I see that folder not found. First try to delete and add again android project to cordova.
I did that many time. I also did uninstall/install npm, but still facing the same issue