Assign position to googlemap

Ionic Framework ionic-v3
1

I need help to assign position to a map… i’m new on ionic… :blush:
This is my code:

 loadMap() {
    Environment.setEnv({
      // api key for server
      'API_KEY_FOR_BROWSER_RELEASE': 'my key',

      // api key for local development
      'API_KEY_FOR_BROWSER_DEBUG': 'my key'
    });

    this.geolocation.getCurrentPosition().then((resp) => {
      this.geoInfo.resp=JSON.stringify(resp);
      console.log('Latitude: ',resp.coords.latitude); // i see right value
      console.log('Longitude: ',resp.coords.longitude); // i see right value
      this.lat = (resp.coords.latitude);
      this.lng =(resp.coords.longitude);
      console.log('Lat1: ',this.lat); // i see right value
      console.log('Lng1: ',this.lng); // i see right value
      }).catch((error) => {
      console.log('Error getting location', error);
      this.geoInfo.resp='Error getting location';
    });

    console.log('Lat2: ',this.lat); // i see undefined value
    console.log('Lng2: ',this.lng); // i see undefined value

    this.map = GoogleMaps.create('map_canvas', {
      camera: {
        target: {
          lat: this.lat, // wrong value..
          lng: this.lng
        },
        zoom: 18,
        tilt: 30
      }
    });


  }

how can i assign right values for target ?
thanks for help
MM

2

Try this…

    this.geolocation.getCurrentPosition().then((resp) => {
      this.geoInfo.resp=JSON.stringify(resp);
      console.log('Latitude: ',resp.coords.latitude); // i see right value
      console.log('Longitude: ',resp.coords.longitude); // i see right value
      this.lat = (resp.coords.latitude);
      this.lng =(resp.coords.longitude);
      console.log('Lat1: ',this.lat); // i see right value
      console.log('Lng1: ',this.lng); // i see right value
      }).catch((error) => {
      console.log('Error getting location', error);
      this.geoInfo.resp='Error getting location';

    this.map = GoogleMaps.create('map_canvas', {
      camera: {
        target: {
          lat: this.lat, // wrong value..
          lng: this.lng
        },
        zoom: 18,
        tilt: 30
      }
    });

    console.log('Lat2: ',this.lat); // i see undefined value
    console.log('Lng2: ',this.lng); // i see undefined value

    });
3

No, still does’nt works i need to set inside GoogleMaps.create

4

As @disak answered, your code is wrong.

getCurrentPosition() works as asynchronous.
It means your code works like this:

setTimeout(() => {
  this.lat = 22;
  this.lng = 33;
}, 1000); 

this.map = GoogleMaps.create('map_canvas', {
      camera: {
        target: {
          lat: this.lat, // wrong value..
          lng: this.lng
        },
        zoom: 18,
        tilt: 30
      }
});