4.0beta using Query task to return graphics and zoom to the graphics

selvarajkrishnan1 — Thu, 13 Aug 2015 07:27:04 GMT

Dear Friends,

I'm facing difficulty in 4.0beta version 3D Screenview to query some features using Query task and features should be zoomed the feature extent.

Anyone can help in this..

Thank you in advance.

Re: 4.0beta using Query task to return graphics and zoom to the graphics

TimWitt2 — Thu, 13 Aug 2015 12:33:43 GMT

Looking here: Map | API Reference | ArcGIS API for JavaScript

I don't think the zoomt to extent method is implemented yet.

Re: 4.0beta using Query task to return graphics and zoom to the graphics

KristianEkenes — Sat, 11 Dec 2021 20:19:49 GMT

Hi Selvaraj,

Could you be a little more specific with your issue? Are you having trouble with QueryTask, zooming to a feature's extent in general? Or only in the SceneView (you get it to work in MapView)?

I was able to query features using this sample as a base. Here is my sample app in a jsbin: JS Bin - Collaborative JavaScript Debugging

Here are the highlights:

QueryTask - This module essentially works the same as it does in 3.x. The main difference is that it returns a Promise instead of a Deferred, so to get the features you need to use .then(). This also allows you to chain multiple functions, which makes your code easier to read. If you're not familiar with using Promises, I encourage to you read the Working with Promises page in our SDK.

ZoomTo - This can easily be done using the animateTo() method on the view. You can animate to a point, geometry, graphic, ViewPoint, and camera (only in SceneView). In my sample app, I passed in the first graphic returned from the query. You are supposed to be able to animate to an array of graphics or geometries, but I wasn't getting that to work properly in my app. That may be a bug, so I'll look in to it.

Here are the main lines of code you should focus on:

//Set base parameters of query
    var q = new Query({
      distance: 150,  //get features within 150ft of mouse click
      units: "feet",
      returnGeometry: true,
      spatialRelationship: "esriSpatialRelIntersects",
      outFields: ["*"]
    });
    
    view.then(function(){
      view.on("click", qFeatures);
    });
    
    //Executes a query task based on mouse click
    function qFeatures(evt){
      q.geometry = evt.mapPoint;
      
      var qTask = new QueryTask({
        url: featureLayer.url
      });
      
      qTask.execute(q).then(function(response){
        return response.features;
      }).then(highlightGraphics).then(zoomTo);  //chain functions
    }
    
    var highlight = new SimpleMarkerSymbol({
      color: "yellow",
      size: 8,
      outline: new SimpleLineSymbol({
        color: "red",
        width: 8
      })
    });
    
    //highlight queried features
    function highlightGraphics(graphics){
      resultLayer.clear();
      graphics.forEach(function(item, i){
        item.symbol = highlight;
      });
      resultLayer.add(graphics);
      return graphics;
    }
    
    //animateTo those features - This acts like a zoomToExtent method
    function zoomTo(features){
        view.animateTo({
          target: features[0],  //you should be able to pass the entire array here
          scale: 1200
        });
    }

Does this help? This sample should work in a SceneView as well; although the FeatureLayer rendering doesn't perform great at the moment, but you still should be able to observe the animation to the graphics.

topic 4.0beta using Query task to return graphics and zoom to the graphics in ArcGIS JavaScript Maps SDK Questions

4.0beta using Query task to return graphics and zoom to the graphics

Re: 4.0beta using Query task to return graphics and zoom to the graphics

Re: 4.0beta using Query task to return graphics and zoom to the graphics