通过过滤按最接近的地理位置对数据进行排序

Question

I am trying to locate correct building where someone is using my application in. Right now i have managed to do a pretty bad filtering and i need to improve it.

What my goal is with filtering to return the closest building to the person using the application, so filter it as good as possible without creating errors when moving around in the same building.

My fetch returns an api JSON array that looks like this:

{
"data": [
{
  "id": 1,
  "city": "CITY",
  "building_name": "Building 1",
  "building_address": "Address 123",
  "latitude":  "57.7052809",
  "longitude": "16.9367817"
},
{
  "id": 2,
  "city": "CITY",
  "building_name": "Building 2",
  "building_address": "Address 456",
  "latitude":  "35.7054509",
  "longitude": "16.9366141"
}
],
}

This is my code

fetch('http://localhost:8888/api/buildings')
.then(response => response.json())
.then(data => {

  userCoordinates = {
    latitude:  35.7053509,
    longitude: 16.9362301
  }


  const returnedBuilding = Object.entries(data.data).map(([inst, key]) => key)
  .filter(thing => (thing.latitude > userCoordinates.latitude - .5 &&
     thing.latitude < userCoordinates.latitude + .5) &&
      (thing.longitude > userCoordinates.longitude -.5 &&
       thing.longitude < userCoordinates.longitude + .5));

       console.log(returnedBuilding);

})

Answer 1

Use 'distance' between two points to find the closest. You can't guarantee the user's building but you can guarantee which one is closest with respect to user's co-ordinate.

var keys = Object.entries(data.data).map(([inst, key]) => key);
var returnedBuilding = 
  keys.reduce((prevCord, thing) => {
    var dist = getDistance(userCoordinates.latitude, userCoordinates.longitude, thing.latitude, thing.longitude);
    var prevDist = getDistance(userCoordinates.latitude, userCoordinates.longitude, prevCord.latitude, prevCord.longitude);
    return dist < prevDist? thing : prevCord;
}, keys[0]);

Below is the getDistance function, I referred from this post . However you can write your own, a simpler one as you are dealing with small distances only (I assume).

function getDistance(lat1, lon1, lat2, lon2) 
{
  var R = 6371; // km
  var dLat = toRad(lat2-lat1);
  var dLon = toRad(lon2-lon1);
  var lat1 = toRad(lat1);
  var lat2 = toRad(lat2);

  var a = Math.sin(dLat/2) * Math.sin(dLat/2) +
    Math.sin(dLon/2) * Math.sin(dLon/2) * Math.cos(lat1) * Math.cos(lat2); 
  var c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1-a)); 
  var d = R * c;
  return d;
}

// Converts numeric degrees to radians
function toRad(Value) 
{
    return Value * Math.PI / 180;
}

Answer 2

You could use a haversine formula to determine which building is the closest.

The haversine formula determines the great-circle distance between two points on a sphere given their longitudes and latitudes. tl;dr, you can do this to find the distance between yourself and the buildings and then accurately determine which is the closest.

Here's another article from SO about using it in javascript: Using the Haversine Formula in Javascript

Answer 3

You could loop through each building and find the closest one based on distance

var closestBuilding = building[0];
var closestDistance = distanceFrom(user, building);
building.forEach(function(building) {
  var distanceFrom = distanceFrom(user, building);
  if(closestDistance > distanceFrom){
    closestBuilding = building;
    closestDistance = distanceFrom;
  } 
})
console.log(closestBuilding);

function distanceFrom(user, building) { /* your distance code */ }

Answer 4

I would highly recommend looking into changing your data model to utilize GeoJSON points stored in a mongoDB database. That will allow you to leverage mongoDB's powerful built in geospatial queries . Using your existing data model above as a starting point, your new data model could look something like this:

{
  "id": 1,
  "city": "CITY",
  "building_name": "Building 1",
  "building_address": "Address 123",
  "location": {
    "type": "Point",
    "coordinates": [ // IMPORTANT: note the order is longitude, latitude
      16.9367817, // longitude
      57.7052809, // latitude
    ]
  }
}

The location property in the object above is the GeoJSON point. Now, rather than fetching every location from your database and doing the calculation yourself in the client, you would query your buildings database for the closest buildings to the user's location. Assuming user coordinates are latitude: 35.7053509 , longitude: 16.9362301 , your query could look something like this (via a GET request):

http://localhost:8888/api/buildings?lat=35.7053509&lng=16.9362301&maxDistance=2000

The mongoDB documentation provides examples for how to handle geospatial queries. This example is taken from the documentation, and is how your api would process the request:

// If you're using express.js, pull the params off the query object
const { lat, lng, maxDistance } = req.query;
const buildings = db.buildings.find(
  {
    location:
      {
        $near:
          {
            $geometry: { type: "Point", coordinates: [lng, lat] },
            $maxDistance: maxDistance
          }
      }
  }
)
  .then(buildings => res.json({ buildings })) // respond to the client
  .catch(err => console.log(err)) // do something with the error

The response from your server would be a list of all buildings within the specified maxDistance , sorted by distance from the user's location (closest to furthest). MongoDB geospatial queries are incredibly fast and performant. You could even slice the first result from the db.find operation and return a single building from your api if your client only wants a single result.

Hope this makes sense and helps! Might seem a little daunting at first if you haven't worked with mongoDB and/or geoJSON objects, but trust me, this will make your life SO much easier. Another little gotcha can occur when your are setting up your database and collection. You need to make sure to add an index the buildings collection to support geospatial queries. From the documentation:

db.buildings.createIndex( { location: "2dsphere" } )

Then create your collection and add your building documents to it.

Feel free follow up if you need any clarification. I'd suggest reading through mongoDB's documentation and search for more examples online.