Commit 3f537b5b authored by Ratnadeep Rajendra Kharade's avatar Ratnadeep Rajendra Kharade
Browse files

Added current location functionaity

parent acc6587e
......@@ -8,7 +8,6 @@
</ion-title>
</ion-toolbar>
</ion-header>
<div #map style="width: 100%; height: 100%" id="mapContainer"></div>
<ion-content>
<div #map style="width: 100%; height: 100%" id="mapContainer"></div>
</ion-content>
......@@ -8,6 +8,9 @@ declare var H: any;
})
export class HomePage {
private platform: any;
private map: any;
private currentLocation = {lat:0,lng:0};
@ViewChild("map", { static: false })
public mapElement: ElementRef;
public constructor(private geolocation: Geolocation) {
......@@ -15,29 +18,33 @@ export class HomePage {
'apikey': 'tiVTgBnPbgV1spie5U2MSy-obhD9r2sGiOCbBzFY2_k'
});
}
public ngOnInit() { }
public ngAfterViewInit() {
setTimeout(() => {
this.loadmap();
}, 1000);
window.addEventListener('resize', () => this.map.getViewPort().resize());
}
loadmap() {
// Obtain the default map types from the platform object
var defaultLayers = this.platform.createDefaultLayers();
this.map = new H.Map(
this.mapElement.nativeElement,
defaultLayers.vector.normal.map,
{
zoom: 16,
center: { lat: 40.757601, lng: -73.985328 },
pixelRatio: window.devicePixelRatio || 1
}
);
var behavior = new H.mapevents.Behavior(new H.mapevents.MapEvents(this.map));
var ui = H.ui.UI.createDefault(this.map, defaultLayers);
this.getLocation(this.map);
}
loadmap(){
// Obtain the default map types from the platform object
var defaultLayers = this.platform.createDefaultLayers();
let map = new H.Map(
this.mapElement.nativeElement,
defaultLayers.vector.normal.map,
{
zoom: 15,
center: { lat: 40.757601, lng: -73.985328 },
pixelRatio: window.devicePixelRatio || 1
}
);
var behavior = new H.mapevents.Behavior(new H.mapevents.MapEvents(map));
var ui = H.ui.UI.createDefault(map, defaultLayers);
this.getLocation(map);
}
getLocation(map) {
this.geolocation.getCurrentPosition(
......@@ -48,8 +55,8 @@ export class HomePage {
).then((resp) => {
let lat = resp.coords.latitude
let lng = resp.coords.longitude
console.log(lat);
console.log(lng);
this.currentLocation.lat = resp.coords.latitude;
this.currentLocation.lng = resp.coords.longitude;
this.moveMapToGiven(map, lat, lng);
}, er => {
alert('Can not retrieve Location')
......@@ -57,8 +64,15 @@ export class HomePage {
alert('Error getting location - ' + JSON.stringify(error))
});
}
moveMapToGiven(map, lat, lng) {
var icon = new H.map.Icon('../../../assets/images/icon_map_currentLocation.png');
// Create a marker using the previously instantiated icon:
var marker = new H.map.Marker({ lat: lat, lng: lng }, { icon: icon });
// Add the marker to the map:
map.addObject(marker);
map.setCenter({ lat: lat, lng: lng });
map.setZoom(14);
}
}
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment