Leaflet.js Tips, Step 3 (markers and fitBounds)

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <link rel="stylesheet" href="https://cdn.leafletjs.com/leaflet-0.7/leaflet.css" />
    <script src="https://cdnjs.cloudflare.com/ajax/libs/leaflet/0.7.3/leaflet.min.js"></script>
    <script src='https://api.tiles.mapbox.com/mapbox.js/v1.6.4/mapbox.js'></script>
    
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
    <style type="text/css">
    #map {
        width: 600px;
        height: 400px;
    }
    </style>
</head>

var map = L.map('map')
        .addLayer(mapboxTiles)
        .setView([42.444508, -76.499491], 12);

var promise = $.getJSON("businesses.json");
    promise.then(function(data) {

// THIS IS NEW
        var allbusinesses = L.geoJson(data);
        allbusinesses.addTo(map);

// THIS IS NEW
        map.fitBounds(allbusinesses.getBounds(), {
            padding: [50, 50]
        });
    });
    </script>
</body>
</html>

Modified http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.js to a secure url

https://cdn.leafletjs.com/leaflet-0.7.3/leaflet.js

https://api.tiles.mapbox.com/mapbox.js/v1.6.4/mapbox.js

https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js