4

I am trying to calculate the area of the intersection between two triangles. I found out the JSTS Topology Suite has a Geometry class which a method intersection(). I tried it on JSFiddle and on my local computer but i am getting an Uncaught TypeError: undefined is not a function. There is also an example from JSTS. Here you can see the code. My code looks the same in JSFiddle:

var union = triangleCoords.union(secondTriangleCoords);
var intersection = triangleCoords.intersection(secondTriangleCoords);
console.log('Intersection ' + intersection);
google.maps.geometry.spherical.computeArea(intersection);

Is there a conversion that i should do also?

xmux
  • 708
  • 2
  • 12
  • 28
  • 1
    The jsts library doesn't add a union method to the Google Maps Polygon class. – geocodezip Sep 25 '14 at 13:04
  • The answer to this question [Google Maps Polygons self intersecting detection](http://stackoverflow.com/questions/25017463/google-maps-polygons-self-intersecting-detection/25019306#25019306) might be relevant. – geocodezip Sep 25 '14 at 13:06

1 Answers1

8

The general answer is you need to convert the google.maps.Polygon objects into jsts.geom.Geometry objects, then run the union. If you want to display the result on a Google Maps Javascript API v3 map, then you need to convert the returned jsts.geom.Geometry object back into a google.maps.Polygon.

This code (from this question) converts a path into a jstsPolygon:

var coordinates = googleMaps2JTS(googlePolygonPath);
var geometryFactory = new jsts.geom.GeometryFactory();
var shell = geometryFactory.createLinearRing(coordinates);
var jstsPolygon = geometryFactory.createPolygon(shell);

Something like this:

var geometryFactory = new jsts.geom.GeometryFactory();

var trito = bermudaTriangle.getPath();
var tritoCoor = googleMaps2JTS(trito);
var shell = geometryFactory.createLinearRing(tritoCoor);

var trito2 = secondBermuda.getPath();
var tritoCoor2 = googleMaps2JTS(trito2);
var shell2 = geometryFactory.createLinearRing(tritoCoor2);

var jstsPolygon = geometryFactory.createPolygon(shell);
var jstsPolygon2 = geometryFactory.createPolygon(shell2);

var intersection = jstsPolygon.intersection(jstsPolygon2);

jsfiddle

To use the computeArea method on the result, though, you need to convert it back into an array or an MVCArray of google.maps.LatLng objects (computeArea(path:Array.|MVCArray., radius?:number))

Or you could use the [jsts.geom.Polygon.getArea] (http://bjornharrtell.github.io/jsts/doc/api/symbols/jsts.geom.Polygon.html#getArea) method.

working fiddle with area of triangles, union and intersection using the jsts method.

Code to convert the results back to google.maps.LatLng and google.maps.Polygon objects:

var jsts2googleMaps = function (geometry) {
  var coordArray = geometry.getCoordinates();
  GMcoords = [];
  for (var i = 0; i < coordArray.length; i++) {
    GMcoords.push(new google.maps.LatLng(coordArray[i].x, coordArray[i].y));
  }
  return GMcoords;
}

var intersectionGMArray = jsts2googleMaps(intersection);

Then to get the area:

var intersectionGMarea = google.maps.geometry.spherical.computeArea(intersectionGMArray);

working fiddle

Community
  • 1
  • 1
geocodezip
  • 158,664
  • 13
  • 220
  • 245
  • Thank you very much! this is great! But i still don't get [Area Method from JSTS](http://bjornharrtell.github.io/jsts/doc/api/symbols/jsts.geom.Polygon.html#getArea), what is it returning? In the documentation only mentioned that 'Returns the area of this Polygon'. And can you please merge [with this question](http://stackoverflow.com/questions/24504068/how-to-show-the-intersecting-area-of-two-polygons-on-google-maps), i think they are the same Thanks – xmux Sep 26 '14 at 07:46
  • The best I can tell (and I agree it isn't clear), the getArea method of JSTS returns the 2 dimensional area (so if you give it Lat/Lng coordinates the units would be degree^2, not but so useful), which is why I added the translation back to Google Maps objects in my answer, as the functions there return meters and square meters. – geocodezip Sep 26 '14 at 14:01