0

acabo de realizar mi primer app con ionic, el mismo comprende geolocalización y cálculo de distancias mediante las google apis, de momento funciona, el problema es que se tarda demasiado en renderizar la grilla (ion-list) cuando modifico los (ion-items) dentro de la promesa resultante del método GetDistanceMatrix.

Espero que alguien con más experiencia sepa indicarme que estoy realizando mal.

Este es el código:

let me = this;
this.geolocation.getCurrentPosition().then(value =>{
let position = value;

  for(let x = 0; x < me.packages.length; x++){
    console.log('Iteration');
    let service = new google.maps.DistanceMatrixService();
    service.getDistanceMatrix({
      origins: [new google.maps.LatLng(position.coords.latitude, position.coords.longitude)],
      destinations: [new google.maps.LatLng(me.packages[x].packageOriginLatitude, me.packages[x].packageOriginLongitude)],
      travelMode: 'DRIVING',
      unitSystem: google.maps.UnitSystem.METRIC,
      avoidHighways: false,
      avoidTolls: false
    }, (response, status) => {
      if (status == 'OK') {

        let json_response = JSON.stringify(response);
        let googleMtr : googleMatrix = JSON.parse(json_response);            
        for(let i = 0; i < googleMtr.rows[0].elements.length; i++){
          me.packages[x].packageDistanceKms = googleMtr.rows[0].elements[i].distance.text;
        }
        console.log('Element updated package: '+x+' distance: '+me.packages[x].packageDistanceKms);
      }
      if (x == me.packages.length -1)
        me.loadfinished = true;

      me.packageCollection = me.packages.slice(0);

    });

1 respuesta 1

0

Posteo la resolución por si hay algún interesado, el desempeño de la lista mejoró al reorganizar el código y 'envolver' el callback de getDistanceMatrix como una Promise.

/*  ------------------------------------- Metodos asincronicos -----------------------------------  */



async getPosition() {
  let position = await this.geolocation.getCurrentPosition();
  return position;
}

/*  ------------------------------------- Metodos asincronicos -----------------------------------  */

  async calculateDistance(){

    let position = await this.getPosition();
    let service = new google.maps.DistanceMatrixService();
    let parameters : any;
    for(let i  = 0; i < this.packages.length; i++){
      parameters = {
        origins: [new google.maps.LatLng(position.coords.latitude, position.coords.longitude)],
        destinations: [new google.maps.LatLng(this.packages[i].packageOriginLatitude, this.packages[i].packageOriginLongitude)],
        travelMode: 'DRIVING',
        unitSystem: google.maps.UnitSystem.METRIC,
        avoidHighways: false,
        avoidTolls: false
      };

      let prom = new Promise((resolve, reject) => {
        service.getDistanceMatrix(parameters , (response, status) => {
        if (status == 'OK') {
          let json_response = JSON.stringify(response);
          let googleMtr : googleMatrix = JSON.parse(json_response);
          let text = '';
          for(let i = 0; i < googleMtr.rows[0].elements.length; i++)
            text = googleMtr.rows[0].elements[i].distance.text;
          resolve(text);
        }
        });
      });

      prom.then(data => {
        this.packages[i].packageDistanceKms = data;
      });

    }
    this.loadfinished = true;

  }

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.