Zoom to extent of all features

Note: Support for 3D on mobile devices may vary, view the system requirements for more information.

It can be convenient and useful for users to zoom to the extent of all features in a FeatureLayer once an app loads, when a layer is added to the map, or when a layer's definitionExpression is updated.

The FeatureLayer API provides a method called queryExtent(), which allows you to calculate the full extent of features at runtime that statisfy a given query. If no query parameters are set, then the method queries for the extent of all features in the layer according to its definitionExpression.

// When the layer is loaded, query for the extent
// of all features in the layer. Then set the view's
// extent to the returned extent of all features.
//
// This method will work for all FeatureLayers, even
// those without a saved `fullExtent` on the service.

layer.then(function(){
  return layer.queryExtent();
}).then(function(response){
  view.goTo(response.extent);
});

Note that when working with client-side FeatureLayers, you will need to call queryExtent() on the FeatureLayerView to see the expected behavior.

view.whenLayerView(layer).then(function(layerView){
  layerView.watch("updating", function(val){
    // wait for the layer view to finish updating
    if(!val){
      layerView.queryExtent().then(function(response){
        // go to the extent of all the graphics in the layer view
        view.goTo(response.extent);
      });
    }
  });
});

The FeatureLayer has a fullExtent property that contains an extent object saved to the feature service. Since some FeatureLayers are created from client-side features, other services, or feature services that don't contain an accurate fullExtent of the data, using the fullExtent to zoom to all features in the layer can be unreliable in some cases. The queryExtent() method is more reliable when working with layers that either don't have a fullExtent, or the fullExtent doesn't accurately reflect the extent of the data.

// using the fullExtent can be unreliable and inconsistent across layers
// depending on the service and how the data was created
layer.then(function(){
  view.goTo(layer.fullExtent);
});