Tutorials
Einige nützliche Hilfen und Code-Schnipsel, die ich immer wieder benötige und deshalb hier für alle sammle.
Javascript: Standorte in der Nähe aus einer Liste ermitteln
Für ein Projekt brauchte ich letztens die 3 dichtesten Standorte von meinem Standort aus gesehen. Da die neuen Browser ja alle ca einen Standort mitliefern kann man dies relativ einfach umsetzen. Falls der Browser zu alt ist, oder der Benutzer nicht den Standort preisgeben möchte, so kann man beispielsweise hier(http://ipinfodb.com/ip_location_api_json.php) einen ungefähren Standort via IP bekommen.
Natürlich braucht man vorher eine Liste, die schon Latitude und Longitude-Werte enthält. Meine Beispielliste hat folgendes Format:
Beispielswerte
var standorte = [
['50.9235887','6.9649457', 'Köln'],
['XX','XX', 'Musterstadt'], ...
];
$(function(){
// Load the 3 closest
if (navigator.geolocation) {
// get position by browser
navigator.geolocation.getCurrentPosition(getClosest,getbyIp);
} else {
// if browser to old, or user disallow, get position by ip
getbyIp();
}
});
function getClosest(position){
centerPos = [position.coords.latitude,position.coords.longitude]
var list = [], xs, xy;
for(var i = 0; i<standorte.length;i++) {
xs = 0;
ys = 0;
xs = centerPos[0] - standorte[i][0];
xs = xs * xs;
ys = centerPos[1] - standorte[i][1];
ys = ys * ys;
list.push( [ Math.sqrt( xs + ys ), standorte[i][2] ] );
});
// Now sort by distance
list.sort( function( a, b ){
return a[0] - b[0];
});
// get first 3 items
list = list.slice(0,3);
// Log the list and do whatever you want with it!
console.log(list);
}
function getbyIp() {
$.ajax({
url: 'http://api.ipinfodb.com/v3/ip-city/?key=deineigenerapikey&format=json',
dataType: 'jsonp',
success: function(data){
console.log(data);
var pos = {
'coords': {
'latitude':data.latitude,
'longitude': data.longitude
}
}
getClosest(pos);
}
});
}
Was macht der Code?
Als erstes wird oben überprüft, ob der Browser die Position unterstützt.
- Ist das nicht der Fall, wird die Position nach Ip angeschaut. (getbyIp())
- Wenn der Browser es kann wird je nachdem ob der User seine Positionsabfrage bestätigt oder ablehnt direkt die getClosest-Funktion aufgerufen, oder es wird wieder die Ip-Position benutzt.
In der getbyIp-Funktion werden nur die derzeitigen Lat,Lon nach Ip geholt auch danach ebenfalls die getClosest-Funktion aufgerufen
getClosest-Funktion macht dann Folgendes:
- Es werden die Abstände der derzeitigen Position, zur Position in unserem Standorte-Array errechnet und in das Array List gespeichert (mit Name)
- Danach wird die Liste nach Werten sortiert (je kleiner der Wert, desto näher)
- Schon hat man eine sortierte Liste und kann via array.slice sich beliebig viele Standorte herauspicken und diese dann wie man möchte benutzen
Das wars auch schon!
Kommentare
Es gibt noch keine Kommentare. Sei der Erste!
Hinterlasse einen Kommentar