1. #1
    Sencha User
    Join Date
    Sep 2011
    Posts
    18
    Vote Rating
    0
    andrea88v is on a distinguished road

      0  

    Default Unanswered: Set distance from a place in a NestedList by current position

    Unanswered: Set distance from a place in a NestedList by current position


    Hi, I’ve a Nested List retrieved from a json file. I use getItemTextTpl to show specific field of the elements.

    Each leaf element has longitude and latitude fields: i want to display the distance by the places from the current position.

    I’ve tried to retrieve current position inside getItemTextTpl method by creating a Geolocation object, but it doesn’t work. I couldn’t obtain longitude and latitude from that object outside locationupdate method.

    If i try to declare long and lat vars before creating Geolocation object and try to set them inside locationupdate method of Geolocation object, them aren’t set to the values that i retrieve from geo.getLatitude() and geo.getLongitude().

    What i want to do is to display in the last level (the level before detailCard) the distance by a place from current position retrieved by an Geolocation object.


    How could I do it?

  2. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,047
    Answers
    3493
    Vote Rating
    850
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    So you need to lat/long coords from within the locationupdate event but you can't? The reason is because the locationupdate event probably is firing before your nestedlist is created maybe?
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  3. #3
    Sencha User
    Join Date
    Sep 2011
    Posts
    18
    Vote Rating
    0
    andrea88v is on a distinguished road

      0  

    Default


    My code is:

    Code:
    ​var geo = Ext.create('Ext.util.Geolocation', {                                 
        autoUpdate: false,
        listeners: {
            locationupdate: function(geo) {
                calculateDistances(geo.getLatitude(), geo.getLongitude(), lat, lon, record);
            },
            locationerror: function(geo, bTimeout, bPermissionDenied, bLocationUnavailable, message) {
                if(bTimeout){
                    alert('Timeout occurred.');
                } else {
                    alert('Error occurred.');
                }
            }
        }
    });
    geo.updateLocation();
    My problem was to register Lat and Lon variables outside of the locationupdate method.


    Now I've changed something: I use Google "Distance Matrix Service" to calculate distances.

    A portion of the JS code is as follows:

    Code:
    function calculateDistances(lat1, lon1, lat2, lon2, record) {
      var service = new google.maps.DistanceMatrixService();
    	
    	var origin1 = new google.maps.LatLng(lat1, lon1);
    	var destinationB = new google.maps.LatLng(lat2, lon2);
      
    	service.getDistanceMatrix(
        {
          origins: [origin1],
          destinations: [destinationB],
          travelMode: google.maps.TravelMode.WALKING,
          unitSystem: google.maps.UnitSystem.METRIC,
          avoidHighways: false,
          avoidTolls: false
        }, callback);
    }
    
    
    function callback(response, status) {
      if (status != google.maps.DistanceMatrixStatus.OK) {
        alert('Error was: ' + status);
      } else {
        var origins = response.originAddresses;
        var destinations = response.destinationAddresses;
        deleteOverlays();
    
    
        for (var i = 0; i < origins.length; i++) {
          var results = response.rows[0].elements;
          for (var j = 0; j < results.length; j++) {
    		
    		var tempDist = results[0].distance.text;
    		
    		console.log(tempDist);
    		
          }
        }
      }
    }

    In callback function with console.log(tempDist), I can view in console the calculated distance.


    My problem now is that I can't return this value to calculateDistances method where I can access to a record and modify it with the calculated value

  4. #4
    Sencha Premium Member akpotosufredrick's Avatar
    Join Date
    Jan 2011
    Posts
    68
    Answers
    4
    Vote Rating
    0
    akpotosufredrick is on a distinguished road

      0  

    Default


    Quote Originally Posted by andrea88v View Post
    My code is:

    Code:
    ​var geo = Ext.create('Ext.util.Geolocation', {                                 
        autoUpdate: false,
        listeners: {
            locationupdate: function(geo) {
                calculateDistances(geo.getLatitude(), geo.getLongitude(), lat, lon, record);
            },
            locationerror: function(geo, bTimeout, bPermissionDenied, bLocationUnavailable, message) {
                if(bTimeout){
                    alert('Timeout occurred.');
                } else {
                    alert('Error occurred.');
                }
            }
        }
    });
    geo.updateLocation();
    My problem was to register Lat and Lon variables outside of the locationupdate method.


    Now I've changed something: I use Google "Distance Matrix Service" to calculate distances.

    A portion of the JS code is as follows:

    Code:
    function calculateDistances(lat1, lon1, lat2, lon2, record) {
      var service = new google.maps.DistanceMatrixService();
        
        var origin1 = new google.maps.LatLng(lat1, lon1);
        var destinationB = new google.maps.LatLng(lat2, lon2);
      
        service.getDistanceMatrix(
        {
          origins: [origin1],
          destinations: [destinationB],
          travelMode: google.maps.TravelMode.WALKING,
          unitSystem: google.maps.UnitSystem.METRIC,
          avoidHighways: false,
          avoidTolls: false
        }, callback);
    }
    
    
    function callback(response, status) {
      if (status != google.maps.DistanceMatrixStatus.OK) {
        alert('Error was: ' + status);
      } else {
        var origins = response.originAddresses;
        var destinations = response.destinationAddresses;
        deleteOverlays();
    
    
        for (var i = 0; i < origins.length; i++) {
          var results = response.rows[0].elements;
          for (var j = 0; j < results.length; j++) {
            
            var tempDist = results[0].distance.text;
            
            console.log(tempDist);
            
          }
        }
      }
    }

    In callback function with console.log(tempDist), I can view in console the calculated distance.


    My problem now is that I can't return this value to calculateDistances method where I can access to a record and modify it with the calculated value
    Have u solved it yet?