﻿ How do I merge polygons (latitude & longitude)?

# How do I merge polygons (latitude & longitude)?

I have polygons defined on a map with latitude & longitude as the coordinate system. I want to merge all overlapping polygons.

From this question Question

I found this software: Software

I downloaded the code an it works great for Cartesian coordinates. But, I have no idea how to utilize it for latitude & longitude.

Whats the best way to approach this problem?

For example here are the polygons I want to merge:

``````        var polyA = new List<GpsLocation>();
var pA1 = new GpsLocation(0, 0);
var pA2 = GpsHelper.CreateLocationBasedOnBearingDistance(pA1, 5, 100);
var pA3 = GpsHelper.CreateLocationBasedOnBearingDistance(pA2, 95, 100);
var pA4 = GpsHelper.CreateLocationBasedOnBearingDistance(pA3, 185, 100);

var polyB = new List<GpsLocation>();

var pB1 = GpsHelper.CreateLocationBasedOnBearingDistance(pA1, 95, 50);
var pB2 = GpsHelper.CreateLocationBasedOnBearingDistance(pB1, 5, 100);
var pB3 = GpsHelper.CreateLocationBasedOnBearingDistance(pB2, 95, 100);
var pB4 = GpsHelper.CreateLocationBasedOnBearingDistance(pB3, 185, 100);
``````

You can use the JSTS library

proof of concept fiddle

code snippet:

``````var googleMaps2JSTS = function(boundaries) {
var coordinates = [];
for (var i = 0; i < boundaries.getLength(); i++) {
coordinates.push(new jsts.geom.Coordinate(
boundaries.getAt(i).lat(), boundaries.getAt(i).lng()));
}
return coordinates;
};
var coordArray = geometry.getCoordinates();
GMcoords = [];
for (var i = 0; i < coordArray.length; i++) {
}
return GMcoords;
}

function initialize() {
document.getElementById("map_canvas"), {
zoom: 13,
});
// map: map,
paths: [polyPath1]
});
for (var i = 0; i < polyPath1.length; i++) {
}
// map: map,
paths: [polyPath2]
});
for (var i = 0; i < polyPath2.length; i++) {
}
map.fitBounds(bounds);
var geometryFactory = new jsts.geom.GeometryFactory();
JSTSpoly1.normalize();
JSTSpoly2.normalize();

var JSTSpolyUnion = JSTSpoly1.union(JSTSpoly2);

map: map,
paths: outputPath,
strokeColor: '#0000FF',
strokeOpacity: 0.3,
strokeWeight: 2,
fillColor: '#0000FF',
fillOpacity: 0.8
});
}

var polyPath1 = [{
lat: 51.510291630150256,
lng: -0.18530845642089844
}, {
lat: 51.51045188624856,
lng: -0.171661376953125
}, {
lat: 51.50227810647597,
lng: -0.17131805419921875
}, {
lat: 51.5019575362143,
lng: -0.18479347229003906
}, {
lat: 51.510291630150256,
lng: -0.18530845642089844
}];
var polyPath2 = [{
lat: 51.51600708249261,
lng: -0.17844200134277344
}, {
lat: 51.50746034612787,
lng: -0.17844200134277344
}, {
lat: 51.507353501776365,
lng: -0.16393661499023438
}, {
lat: 51.51611390655047,
lng: -0.1641082763671875
}, {
lat: 51.51600708249261,
lng: -0.17844200134277344
}];``````
``````html,
body,
#map_canvas {
height: 100%;
width: 100%;
margin: 0px;
``````<script src=""></script>