setBounds to two different featureGroups at once mapbox leaflet?

Question

I am working on a map where I have two feature layers.

var myFeatureGroup1 = L.featureGroup().addTo(map);
var myFeatureGroup2 = L.featureGroup().addTo(map);

I am setting bounds like:

map.fitBounds(myFeatureGroup1.getBounds());
map.fitBounds(myFeatureGroup2.getBounds());

But for obvious reasons, myFeatureGroup2 is set bounds on. Is ther a way by which I can fit bounds to multiple layerGroups? Like both of them at once? Is there a way I can merge them into a third layerGroup and fit bounds on it?

Answer 1

map.fitBounds(myFeatureGroup1.getBounds().extend(myFeatureGroup2.getBounds()));

See the LatLngBounds documentation, this is the first documented method.

Answer 2

How about using TurfJS to merge the two bounds together(convert them to geoJSON) first, then map.fitBounds(result).