สำหรับการจัดการรูปทรงเรขาคณิตในฝั่งไคลเอ็นต์คุณสามารถใช้JSTS โทโพโลยีสวีท นี่คือตัวอย่างเล็ก ๆ น้อย ๆ ของฉันในการแก้ปัญหาของคุณ: สหภาพตัวอย่างเช่น รหัสแหล่งที่มา:
var reader = new jsts.io.WKTReader();
var a = reader.read('POLYGON((10 10, 100 10, 100 100, 10 100, 10 10))');
var b = reader.read('POLYGON((50 50, 200 50, 200 200, 50 200, 50 50))');
var union = a.union(b);
var parser = new jsts.io.OpenLayersParser();
union = parser.write(union);
var map = new OpenLayers.Map('map', {
maxExtent: new OpenLayers.Bounds(0, 0, 300, 300),
maxResolution: 100,
units: 'm',
controls: [new OpenLayers.Control.MousePosition(), new OpenLayers.Control.Navigation()]
});
var layer = new OpenLayers.Layer.Vector('test', {isBaseLayer: true});
map.addLayer(layer);
var unionOutput = new OpenLayers.Feature.Vector(union, null, { fillColor: 'green', fillOpacity: 1});
layer.addFeatures([unionOutput ]);
map.zoomToMaxExtent();