Leaflet JS中的父多边形

Question

I would like to wrap multiple polygons in a parent polygon. Example below:

Is this possible in Leaflet js? Assume I have an array of L.polygon objects.

Thank you

Answer 1

Short answer: no.

If you want to create an envelope for your polygones, then it is an algorithm problem that goes beyond the scope of leafletjs.

You can look at the answers of this question to start solving your problem.

EDIT: here is an example using Turfjs library (thanks to @IvanSanchez for the heads up and to @HudsonPH for the polygons).

// draw envelope
var points = {
  "type": "FeatureCollection",
  "features":
[
 // collect the points of your polygons
 turf.point([-104.05, 48.99]),
 // ...
]
};

var hull = turf.convex(points);
L.geoJson(hull).addTo(map);

Answer 2

You can have a group, but you need define all the coordinates more info: http://leafletjs.com/examples/geojson.html

    var states = [{
    "type": "Feature",
    "properties": {"party": "Republican"},
    "geometry": {
        "type": "Polygon",
        "coordinates": [[
            [-104.05, 48.99],
            [-97.22,  48.98],
            [-96.58,  45.94],
            [-104.03, 45.94],
            [-104.05, 48.99]
        ]]
    }
}, {
    "type": "Feature",
    "properties": {"party": "Democrat"},
    "geometry": {
        "type": "Polygon",
        "coordinates": [[
            [-109.05, 41.00],
            [-102.06, 40.99],
            [-102.03, 36.99],
            [-109.04, 36.99],
            [-109.05, 41.00]
        ]]
    }
}];

L.geoJson(states, {
    style: function(feature) {
        switch (feature.properties.party) {
            case 'Republican': return {color: "#ff0000"};
            case 'Democrat':   return {color: "#0000ff"};
        }
    }
}).addTo(map);