select features within a distance

sundussabbah · ‎05-04-2015

Hello,

I have a map with feature layer and I want to press a button and it's event display only the features around the current location within specific radius

I want to :

define the current location

display features that exist around the current location with a specific radius

please help me, how could I do this??

thanks alot

TomSellsted · ‎05-04-2015

Greetings Sundus,

Here is a sample script from ESRI's page that queries using geometry. In this sample, it uses and extent, but you could easily reference the new geometry engine to create a buffer too.

https://developers.arcgis.com/javascript/jssamples/query_deferred_list.html

The specific bit of code that queries by geometry is:

        app.map.on("click", executeQueries);

        function executeQueries(e) {
          var parcels, buildings, promises, 
            qGeom, point, pxWidth, padding;

          // create an extent from the mapPoint that was clicked
          // this is used to return features within 3 pixels of the click point
          point = e.mapPoint;
          pxWidth = app.map.extent.getWidth() / app.map.width;
          padding = 3 * pxWidth;
          qGeom = new Extent({
            "xmin": point.x - padding,
            "ymin": point.y - padding,
            "xmax": point.x + padding,
            "ymax": point.y + padding,
            "spatialReference": point.spatialReference
          });

          // use the extent for the query geometry
          app.qParcels.geometry = app.qBuildings.geometry = qGeom;
          
          parcels = app.qtParcels.execute(app.qParcels);
          buildings = app.qtBuildings.execute(app.qBuildings);
          console.log("deferreds: ", parcels, buildings);
          promises = all([parcels, buildings]);
          promises.then(handleQueryResults);
          console.log("created d list");
        }

Here is a reference to the buffer geometry engine code.

esri/geometry/geometryEngine | API Reference | ArcGIS API for JavaScript

Regards,

Tom

sundussabbah · ‎05-04-2015

it does not work or I did'nt understant it well

I have this code:

var circleSymb = new SimpleFillSymbol(SimpleFillSymbol.STYLE_NULL,
   new SimpleLineSymbol(
SimpleLineSymbol.STYLE_SHORTDASHDOTDOT,
   new Color([105, 105, 105]),2), new Color([255, 255, 0, 0.25]));

   var circle = new Circle({
center: [long,lat], // coords for the current location
geodesic: true,
radius: radius, // radius for the area whic I want to display features
radiusUnit: 9036 // unit "kilometer"
});

and this code, it does'nt work, and I did'nt know how to apply circle object with it:

var geometries = graphicsUtils.getGeometries(lyrFeature.graphics);
var bufferedGeometries = geometryEngine.geodesicBuffer(geometries, radius, 9036, true);
array.forEach(bufferedGeometries,function(geometry){
map.graphics.add(new Graphic(geometry,circleSymb));
});

TomSellsted · ‎05-05-2015

Sundus,

Of course you can just use a circle and no buffer needed to query as well. It would go something like this:

        map.on("click", executeQueries);


        function executeQueries(e) {
          var parcels, qGeom, point;

          point = e.mapPoint;
          var qGeom = new Circle(point,{
            "radius": 100,
            "spatialReference":point.spatialReference
           });

          // use the circle for the query geometry
          qParcels.geometry = qGeom;
          
          parcels = qtParcels.execute(qParcels, handleQueryResults);
         
        }

I am using a circle for the query geometry instead of an extent. You can change the radius to whatever you would appropriate for your query.

Regards,

Tom

TomSellsted · ‎05-05-2015

Sundus,

I put together a quick jsfiddle for you to be able to see the complete javascript. You can view it at:

Edit fiddle - JSFiddle

Regards,

Tom

sundussabbah · ‎05-05-2015

I wrote the code like this

query = new Query();
query.where = condition;
query.returnGeometry = true;

if(search != false){
var qGeom = new Circle({
center: [longitude,latitude],
geodesic: true,
radius: radius,
radiusUnit: 9036
});
var circleSymb = new SimpleFillSymbol(SimpleFillSymbol.STYLE_NULL,
new SimpleLineSymbol(
SimpleLineSymbol.STYLE_SHORTDASHDOTDOT,
new Color([105, 105, 105]),2), new Color([255, 255, 0, 0.25]));

mapMain.graphics.clear();
mapMain.infoWindow.hide();
var graphic = new Graphic(circle, circleSymb);
mapMain.graphics.add(graphic);

query.geometry = qGeom;
}

query.outFields = ["*"];

query.orderByFields = [order];
queryTask.execute(query, showResults);

but the result is nothing.!!!

TomSellsted · ‎05-06-2015

Sundus,

It is hard to tell with the code fragment you posted, what is going on. I suspect that the latitude and longitude may not be passed to the function so there is no geometry to add to the query. Is a circle being drawn on the map in the place you are expecting?

From your previous post, you didn't want to expose your service URLs, so if you could post the code without them, I might have a better chance of seeing what is going on.

Regards,

Tom

sundussabbah · ‎05-06-2015

Hello,

it is the same query you helped me with. in the previous post, but now now I want to add a button (search) if it is pressed the query display only the features that exist around a point with specific readius ( the point is the current location of user) long & lat are for this point

this is the previous code you wrote :

<!DOCTYPE html>  
<html>  
  
  
<head>  
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">  
    <!--The viewport meta tag is used to improve the presentation and behavior of the samples  
      on iOS devices-->  
    <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">  
    <title>Query Musanda Project Details</title>  
  
  
    <script src="http://js.arcgis.com/3.13/"></script>  
    <script>  
        require([  
            "dojo/dom", "dojo/on",  
            "esri/tasks/query", "esri/tasks/QueryTask", "dojo/domReady!"  
        ], function(dom, on, Query, QueryTask) {  
  
  
  
  
            on(dom.byId("execute"), "click", execute);  
  
  
            function execute() {  
                queryTask = new QueryTask("URL to your Map Service");  
                //build query filter  
                query = new Query();  
                query.where = "ESRI_OID > 0";  
                query.returnGeometry = false;  
                query.outFields = ["*"];  
                query.spatialRelationship = Query.SPATIAL_REL_INTERSECTS;  
                queryTask.execute(query, showResults);  
            }  
  
  
            function showResults(results) {  
                var resultItems = [];  
                var resultCount = results.features.length;  
                for (var i = 0; i < resultCount; i++) {  
                    var featureAttributes = results.features.attributes;  
                    for (var attr in featureAttributes) {  
                        resultItems.push("<b>" + attr + ":</b>  " + featureAttributes[attr] + "<br>");  
                    }  
                    resultItems.push("<br>");  
                }  
                dom.byId("info").innerHTML = resultItems.join("");  
            }  
        });  
    </script>  
</head>  
  
  
<body>  
    Projects:  
    <input id="execute" type="button" value="Get Details">  
    <br />  
    <br />  
    <div id="info" style="padding:5px; margin:5px; background-color:#eee;">  
    </div>  
</body>  
  
  
</html>

and to do what I want (display within a radius) I wrote this code:

query = new Query();  
  query.where = condition;
  query.returnGeometry = true; 

 
 if(search != fals){   // to check if button is pressede
  var qGeom = new Circle({
  center: [longitude,latitude],  // longitude & latitude of current location ( obtained in another function) 
  geodesic: true,
  radius: radius,             // radius to search within ( it is global variable initialized early)
  radiusUnit: 9036
  });
  var circleSymb = new SimpleFillSymbol(SimpleFillSymbol.STYLE_NULL,
  new SimpleLineSymbol(
  SimpleLineSymbol.STYLE_SHORTDASHDOTDOT,
  new Color([105, 105, 105]),2), new Color([255, 255, 0, 0.25]));

  mapMain.graphics.clear();
  mapMain.infoWindow.hide();
  var graphic = new Graphic(circle, circleSymb);
  mapMain.graphics.add(graphic);

  query.geometry = qGeom;
  }
  
  query.outFields = ["*"];  
  
  query.orderByFields = [order];
  queryTask.execute(query, showResults);

it is not necessary to draw the circle , but when the query did'nt work , I tried to draw it to see what happens,

I hope my point is clear now, and thank you very much for keeping answer me

curtvprice · ‎05-06-2015

sundus sabbah, please try: Posting Code blocks in the new GeoNet

TomSellsted · ‎05-07-2015

Sundus,

This is the same code block that you provided me previously. Without the rest of your code, it is difficult for me to see where things may be going wrong for you.

A couple of suggestions. The circle may not have the right spatial reference and may not be selecting points as it is improperly located. This is why I suggest drawing the circle, Then you can see the circle and the points that are falling within it. If you are in debug mode, you can see what the values are for the lat/lon coordinates. This way, you will know if they have the proper values to place a circle as expected.

Regards,

Tom