Zoom to layer option in MapLayer

[Muqit_Zoarder]

Dear all, i have 25 layers in a MapService which are from different parts of a country. I have created a ArcGIS Javascript API application to view the all 25 map layer together and also the feature informtation by click event. Now the problem is i want to add "zoom to layer" option in each layer. Because the whole dataset is belogns to a country scale and i cannot even see all te layers now in the map extent. So I want to add a option in each layer , like the arcGIS online, if i click on zoom to layer then the particular layer extent will come. Please help me out from this problem.

Thanking you

Regards

[DavidBlanchard]

You can retrieve a features extent by using the Feature Layer's queryExtent method. This will return the full extent of the feature layer, which you can then use to set the extent of the map using its setExtent method.

Your code would look something like this:

function zoomToLayer(featureLayer) {
    query = new Query();
    query.where = featureLayer.getDefinitionExpression() || "1=1";
    featureLayer.queryExtent(query).then(
        function(result) {
            map.setExtent(result.extent);
        },
        function(error) {
            console.error("Failed to get query extent", error);
        }
    )
}

[Muqit_Zoarder]

Please see my code: and please see the attached image, i want to get the zoom to option for each layer

var map, operational;

require(["dojo/_base/connect",

"dojo/dom", "dojo/parser", "dojo/on", "dojo/_base/Color",

"esri/IdentityManager",

"esri/map",

"esri/InfoTemplate",

"esri/geometry/Extent",

"esri/dijit/Measurement",

"esri/layers/FeatureLayer",

"esri/layers/ArcGISTiledMapServiceLayer",

"esri/layers/ArcGISDynamicMapServiceLayer",

"esri/symbols/SimpleFillSymbol",

"esri/symbols/SimpleLineSymbol",

"esri/renderers/ClassBreaksRenderer",

"agsjs/dijit/TOC",

"esri/dijit/BasemapGallery",

"esri/arcgis/utils",

"esri/tasks/IdentifyTask",

"esri/tasks/IdentifyParameters",

"esri/tasks/QueryTask",

"esri/dijit/Popup",

"esri/dijit/HomeButton",

"esri/dijit/Geocoder",

"dojo/_base/array",

"esri/Color",

"dojo/dom-construct",

"esri/dijit/Scalebar",

"dijit/layout/BorderContainer",

"dijit/layout/ContentPane",

"dijit/TitlePane",

"dojo/fx", "dojo/domReady!"],

function init(connect, dom, parser, on, Color, IdentityManager, Map, InfoTemplate, Extent, Measurement, FeatureLayer, ArcGISTiledMapServiceLayer,

ArcGISDynamicMapServiceLayer, SimpleFillSymbol, SimpleLineSymbol, ClassBreaksRenderer, TOC, BasemapGallery, arcgisUtils,

IdentifyTask, IdentifyParameters, QueryTask, Popup, HomeButton, Geocoder, arrayUtils, Color, domConstruct) {

  parser.parse();

  map = new Map("mapDiv", {

  center: [11.8802278, 51.3902768 ] ,

  zoom: 17,

  basemap: "satellite",

  //slider: false

  });

  var geocoder = new Geocoder({

  map: map

  }, "search");

  geocoder.startup();

  var basemapGallery = new BasemapGallery({

  showArcGISBasemaps: true,

  map: map

  }, "basemapGallery");

  basemapGallery.startup();

  basemapGallery.on("error", function (msg) {

  console.log("basemap gallery error: ", msg);

  });

  var scalebar = new esri.dijit.Scalebar({ map: map, scalebarUnit: "dual" });

  var home = new HomeButton({

  map: map

  }, "HomeButton");

  home.startup();

  var measurement = new Measurement({

  map: map

  }, dom.byId("measurementDiv"));

  measurement.startup();

  operational = "https://192.168.224.13/arcgis/rest/services/LTFE_Sites_DEUTSCHLAND/MapServer";

  var operationalLayer = new esri.layers.ArcGISDynamicMapServiceLayer(operational, { id: 'Dynamic' }

  );

  map.addLayers([operationalLayer]);

  // Add Table of Contents Start 

  map.on('layers-add-result', function (evt) {

  try {

  var toc = new TOC({

  map: map,

  layerInfos: [{

  layer: operationalLayer,

  title: "LTFE Sites"

  }]

  }, "legendDiv");

  toc.startup();

  toc.on("load", function () {

  console.log("TOC loaded");

  });

  }

  catch (e) { console.error(e.message); }

  });

  functionMode = true;

  on(map, "click", function (evt) {

  if (functionMode == true) {

  executeIdentifyTask(evt);

  } else {

  return;

  }

  });

  identifyTask = new IdentifyTask(operational);

  identifyParams = new IdentifyParameters();

  identifyParams.tolerance = 3;

  identifyParams.returnGeometry = true;

  identifyParams.layerIds = operationalLayer.visibleLayers;

  identifyParams.layerOption = IdentifyParameters.LAYER_OPTION_ALL;

  identifyParams.width = map.width;

  identifyParams.height = map.height;

  function executeIdentifyTask(evt) {

  identifyParams.geometry = evt.mapPoint;

  identifyParams.mapExtent = map.extent;

  identifyParams.layerIds = operationalLayer.visibleLayers;

  var deferred = identifyTask.execute(identifyParams);

  deferred.addCallback(function (response) {

  return dojo.map(response, function (result) {

  var feature = result.feature;

  feature.attributes.layerName = result.layerName;

  var template = new InfoTemplate("", "${*}");

  feature.setInfoTemplate(template);

  return feature;

  });

  });

  map.infoWindow.setFeatures([deferred]);

  map.infoWindow.show(evt.mapPoint);

  }

});