Sort list by geolocation

[Johnbran]

I have a list that loads json data into a datastore from my server. The json contains a list of shops and their latitude and longitude. I have written the javascript to get the user's location and find the closest shop. The problem is how do I sort the list with the closet being first. The data from the server doesn't calculate the distance the app does. How can I insert the calculation results in to the datastore and then have the list display the sorted list by closest distance?

Thanks

[b0hne]

Hi there,

i'm having exactly the same problem. Did you solve it? If so, how ?
I have absolutely no clue how to get the calculated distance to the store...

[Johnbran]

Hey,

This is how I solved the problem. I added another string to the store called 'dist'. Even though the server would never send that information, I created it just to store the information. I then used google API to calculate the distance (there are plenty of examples online. Just make sure you use the latest API). After google returned the distance I added it to the store.Using something like this...

var record= Location.stores.PropertiesRaw.getAt(j);
record.set('dist',rtndDist);


Then I added a this code to sort the store by distance...

Location.stores.PropertiesRaw.sort([


{
property : 'dist',
direction: 'ASC'
}
]);

The list box will automatically refresh itself to show the list by distance. You can turn off the 'auto load' of the store so you can have greater control of when the list shows the results.

I hope this helps.

John

[b0hne]

Thanks for the snippet!
I've tried to solve the problem with a quite similar approach, but i didn't get it working.
Sencha is kinda cool but a bit hard to understand... until now i developed my mobile apps with jQuery mobile, which is quite different

I'll let you know if it worked!

Simon

[b0hne]

Hey,

so lets say i've got the following: (mostly taken from a sencha example)

Here is my model and my store (with local data for demonstation purposes):

Ext.regModel('Filiale', {
fields: ['firstName', 'lastName']
});


ListStore = new Ext.data.Store({
model: 'Filiale',
sorters: 'firstName',
getGroupString : function(record) {
return record.get('firstName')[0];
},
data: [
{ firstName: "Domino", lastName: "Derval" },
{ firstName: "Elektra", lastName: "King" },
{ firstName: "Fiona", lastName: "Volpe" },
{ firstName: "Xenia", lastName: "Onatopp" }
]
});

With

I added another string to the store called 'dist'.

you mean like add a new empty field to the data array like: { firstName: "Domino", lastName: "Derval", dist: ""} ??


This is the List i want to display the results in:

listPanel = new Ext.List({
title: 'ListStore',
id: 'disclosurelist',
store: ListStore,
itemTpl: '<div class="contact">{firstName},{lastName}}</div>',
grouped: true

});

And then i've got a function addMarker(data) which is used to get the calculated distance from my current position. The calculation is working and i get the distance from google. But i don't exactly know how to get this working.

Thanks in advance!!!!

Simon

[nagwww]

Hi,
I am still having an issue with the sorting by GeoLocation. I am able to calculate the distance but not able to Sort the NestedList by Distance.

tks, nag

[akpotosufredrick]

what error appears?