Question

Can someone help me fill in the blanks with native JavaScript?

function getHeading(lat1, lon1, lat2, lon2) {
    // Do cool things with math here

    return heading; // Should be a number between 0 and 360
}

I’ve been messing around with this for a long time and can’t seem to get my code to work right.

Answer 1

There is a very good JavaScript implementation by Chris Veness at Calculate distance, bearing and more between Latitude/Longitude points under the Bearings heading.

You may prefer augmenting Google’s LatLng prototype with a getHeading method, as follows (using the v3 API):

Number.prototype.toRad = function() {
   return this * Math.PI / 180;
}

Number.prototype.toDeg = function() {
   return this * 180 / Math.PI;
}

google.maps.LatLng.prototype.getHeading = function(point) {
   var lat1 = this.lat().toRad(), lat2 = point.lat().toRad();
   var dLon = (point.lng() - this.lng()).toRad();

   var y = Math.sin(dLon) * Math.cos(lat2);
   var x = Math.cos(lat1) * Math.sin(lat2) -
           Math.sin(lat1) * Math.cos(lat2) * Math.cos(dLon);

   var brng = Math.atan2(y, x);

   return ((brng.toDeg() + 360) % 360);
}

Which then can be used like this:

var pointA = new google.maps.LatLng(40.70, -74.00);
var pointB = new google.maps.LatLng(40.70, -75.00);

pointA.getHeading(pointB);   // Returns 270 degrees

Otherwise if you prefer a global function instead of augmenting Google’s LatLng, you can do it as follows:

function getHeading(lat1, lon1, lat2, lon2) {
    var lat1 = lat1 * Math.PI / 180;
    var lat2 = lat2 * Math.PI / 180;
    var dLon = (lon2 - lon1) * Math.PI / 180;

    var y = Math.sin(dLon) * Math.cos(lat2);
    var x = Math.cos(lat1) * Math.sin(lat2) -
            Math.sin(lat1) * Math.cos(lat2) * Math.cos(dLon);

    var brng = Math.atan2(y, x);

    return (((brng * 180 / Math.PI) + 360) % 360);
}

Usage:

getHeading(40.70, -74.00, 40.70, -75.00);    // Returns 270 degrees