Http Get the LatLng from url and add it with marker to the map . note: the lat and long is changing to track object

Appflow
1

fetchplane() {
return new Promise(resolve => {
this.http.get(‘http://api.open-notify.org/iss-now.json’
).subscribe(data=>{
this.droneMarker(data);
}, err => { console.log(err); });
}); }
//end section
// add marker plane for the plane
droneMarker(data) {

  let Newlat = Number(data.iss_position.latitude) ;
  let Newlng = Number(data.iss_position.longitude);
  var loc = new google.maps.LatLng(Newlat, Newlng);
  console.log(loc);
  var map= new google.maps.Map(document.getElementById('map'));
  var dMarker = new google.maps.Marker({
    position: loc,
    map: this.map,
    icon: {
      url: 'assets/markers/drone_location.png',
      scaledSize: new google.maps.Size(80, 80),

    }  });

}

// add the google map with geolocation plugin
ionViewDidLoad(){
this.loadMap();
this.fetchplane();
// this.droneMarker();
}
loadMap()
{
this.geolocation.getCurrentPosition().then ((position)=> {
var latlong = new google.maps.LatLng(position.coords.latitude , position.coords.longitude);
var loptions = {
center: latlong,
zoom:1,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
const map= new google.maps.Map(this.mapElement.nativeElement, loptions);
this.addmarker(latlong, map);

}, (error) =>{
  console.log(error);
});

}
addmarker(position, map) {
return new google.maps.Marker({
position,
map,

});

}

2

it is always get the lat and lon in consol but is not in the map