Building footprints - constricting zoom extents
Generally, for building footprints, we estimate that tilesets need to be generated between zoom 13 and zoom 15. We have chosen a value of 13 for minzoom
based on the following considerations and assumptions:
- It is reasonable to have about 50,000 features in a tile
- A building lot is approximately 5,000 square feet
- A single map tile at zoom 13 should be about 50,000 * 5,000, which is 250,000,000 square feet.
Thus, at zoom 13, it's likely that a tile could contain all building footprints without dropping any features. Any zoom level lower than that (z0-z12
) would drop features because the density of data exceeds the feature capacity of a single tile.
We can conclude that an appropriate value for maxzoom
is 15 because it is a one foot resolution on the ground.
Below is an ideal recipe for building footprints.
{
"version": 1,
"layers": {
"building_footprints": {
"source": "mapbox://tileset-source/{username}/building-footprints",
"minzoom": 13,
"maxzoom": 15
}
}
}
US Building Footprints
The US building footprints dataset from Microsoft data can be used to create a tileset that contains building footprints, in this example, we'll be pulling data from Rhode Island.
The map on the left is the building footprints tileset generated with a minzoom
of 10
and maxzoom
of 15
. The map on the right is the building footprints tileset generated with the sample recipe above (minzoom
of 13
and maxzoom
of 15
). If you zoom out, you'll see that the footprint data on the right disappears at zoom 13 and the building data on the left disappears at zoom 10. This is because of the differing minzoom
values of the right versus left tileset. You can see that it is not beneficial to view the building footprint data at zoom 10, thus the optimal minzoom
is 13.
Using the Tilesets CLI to generate a tileset
This section describes how to use the Tilesets CLI to generate a tileset.
- Download the data you'll use to create the tileset:
- Create a tileset source named
building-footprints
with the data you downloaded
tilesets upload-source username building-footprints ~/your/local/path/RhodeIsland.ldgeojson
- Create your recipe as a local JSON file (for example
building-footprints-recipe.json
) with yourbuilding-footprints
tileset source
{
"version": 1,
"layers": {
"building_footprints": {
"source": "mapbox://tileset-source/username/building-footprints",
"minzoom": 13,
"maxzoom": 15
}
}
}
- Create a tileset with the id
username.building-footprints-zoom
using your recipe and name it"building footprints"
. This will be an empty tileset to start, until you publish it.
tilesets create username.building-footprints-zoom --recipe ~/your/local/path/building-footprints-recipe.json --name "building footprints"
- Now you're ready to publish your tileset and start processing your data
tilesets publish username.building-footprints-zoom
Preview your tileset
- You can now add your new tileset to a map style to visualize its data. Below is an example of how to add the
username.building-footprints-zoom
tileset as a vector tile source to a Mapbox GL JS map style.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Building footprints - constricting zoom extents</title>
<meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no">
<link href="https://api.mapbox.com/mapbox-gl-js/v3.5.1/mapbox-gl.css" rel="stylesheet">
<script src="https://api.mapbox.com/mapbox-gl-js/v3.5.1/mapbox-gl.js"></script>
<style>
body { margin: 0; padding: 0; }
#map { position: absolute; top: 0; bottom: 0; width: 100%; }
</style>
</head>
<body>
<div id="map"></div>
<script>
// TO MAKE THE MAP APPEAR YOU MUST
// ADD YOUR ACCESS TOKEN FROM
// https://account.mapbox.com
mapboxgl.accessToken = 'YOUR_MAPBOX_ACCESS_TOKEN';
const map = new mapboxgl.Map({
container: 'map',
style: 'mapbox://styles/mapbox/light-v10',
zoom: 14,
center: [-71.4935, 41.5852]
});
map.on('load', () => {
// Add a source using the tileset you created.
map.addSource('my-building-footprints', {
type: 'vector',
url: 'mapbox://examples.building-footprints-zoom'
});
// Use the source to add a layer to the map.
map.addLayer({
'id': 'buildings-i1',
'type': 'line',
'source': 'my-building-footprints',
'source-layer': 'building_footprints',
'layout': {
'line-join': 'round',
'line-cap': 'round'
},
'paint': {
'line-color': '#ff69b4',
'line-width': 1
}
});
});
</script>
</body>
</html>
Recipe options used
Field | Description | Data type |
---|---|---|
** source** | The source data to use for this layer. Tileset sources are created with the Create a tileset source endpoint of Mapbox Tiling Service (MTS). | String |
minzoom | Specify the minimum zoom at which the data in your tileset will be available. A value of 13 here ensures that the buildings will be visible when a user has zoomed in significantly. | Integer |
maxzoom | Specify the maximum zoom at which the data your tileset will be tiled. Your map can be viewed past this zoom level because of overzooming, but the data at zoom levels greater than the maxzoom will be less precise. A value of 15 here ensures that the buildings will be visible when a user has zoomed in significantly. | Integer |