Calculating area of a polygon drawn on google map

Question

I am looking for an accurate algorithm or a service to calculate surface area on earth where points are calculated on the basis of GPS Coordinates.

I am using Google Map Api version 3 and are drawing polygons based on recorded coordinates but I don't think the standard ways of calculating area of the polygon will take into account of slopes(hills). Do I need to work on contours for such thing?

Are there any third party services may be ArcGis or some other that takes into account of slopes as well.

Answer 1

Yes, this is definitely possible. There is a quick tutorial with example code here:

https://web.archive.org/web/20130301120148/http://geojason.info/demos/line-length-polygon-area-google-maps-v3

The relevant part is this:

google.maps.geometry.spherical.computeArea(yourPolygon.getPath());

Official documentation:

http://code.google.com/apis/maps/documentation/javascript/reference.html#spherical

Answer 2

Brad's answer

google.maps.geometry.spherical.computeArea(yourPolygon.getPath());

is correct, but beware, it only applies for polygons which do not self-intersect. When the polygon starts to self-intersect, things are going horribly wrong. You can try it with the link Brad gave http://geojason.info/demos/line-length-polygon-area-google-maps-v3/ . Just draw 4-5 intersecting lines and start playing with the vertices. The area calculation will definitely seem wrong.

If you're not convinced, here is an example:

   var map;

    google.maps.visualRefresh = true;

    google.maps.event.addDomListener(window, 'load', initialize);

    function initialize() {
        var mapOptions = {
            center : new google.maps.LatLng(55.874, -4.287),
            zoom : 16,
            mapTypeId : google.maps.MapTypeId.ROADMAP
        };
        map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions)

        drawExample();
    }

    function drawExample() {
        var pathLeft = [new google.maps.LatLng(55.874, -4.292),
            new google.maps.LatLng(55.875, -4.292),
            new google.maps.LatLng(55.875, -4.290),
            new google.maps.LatLng(55.876, -4.290),
            new google.maps.LatLng(55.876, -4.291),
            new google.maps.LatLng(55.874, -4.291)]

        var polygonLeft = new google.maps.Polygon({
            path : pathLeft,
            map: map
        });

        var areaLeft = google.maps.geometry.spherical.computeArea(polygonLeft.getPath());

        var pathRight = [new google.maps.LatLng(55.874, -4.282),
            new google.maps.LatLng(55.875, -4.282),
            new google.maps.LatLng(55.875, -4.280),
            new google.maps.LatLng(55.8753, -4.2807),
            new google.maps.LatLng(55.876, -4.281),
            new google.maps.LatLng(55.874, -4.281)]

        var polygonRight = new google.maps.Polygon({
            path : pathRight,
            map: map
        });

        var areaRight = google.maps.geometry.spherical.computeArea(polygonRight.getPath());

        console.log("areaLeft: " + areaLeft + "\nareaRight: " + areaRight);
    }

The bug report http://code.google.com/p/gmaps-api-issues/issues/detail?id=5624&colspec=ID%20Type%20Status%20Introduced%20Fixed%20Summary%20Stars%20ApiType%20Internal&start=700#makechanges