Basic Querying in FeatureLayer | ArcGIS API for JavaScript 4.24

The FeatureLayer has many methods used to perform queries on its data. The queryFeatures() method allows the user to query features in the FeatureLayer based on ... ArcGISAPIforJavaScriptSampleCodeOverviewSampleCodeAPIReferenceShowcaseBlogMenuGetstartedLatestsamplesMappingandviewsLayersFeatureLayerIntrotoFeatureLayerCreatedfromarrayofgraphicsCreatedfromashapefileAddorremovegraphicsfromaFeatureLayerHighlightpointfeaturesFilterfeaturesbyattributesApplyeffectstofeaturesBasicqueryingonFeatureLayerCreatelayerfromportalitemSceneLayerBuildingSceneLayerCSVandGeoJSONRasterlayersElevationLayerIntegratedMeshLayerVoxelLayerMediaLayerMapImageLayerOGCLayersPointCloudLayerVectorTileLayerRouteLayerSubtypeGroupLayerCustomlayersOthertiledlayersLivefeedsQueryLayer(server-side)BasicqueryingonFeatureLayerQuerytopfeaturesQueryfeaturespaginationQueryattachmentsQueryrelatedfeaturesQueryforextentoffeaturesLayerView(client-side)EditingLabelsDrawVisualizationPopupsGraphicsRoutingSearchTimeAnalysisWidgetsOtherNavigationMenuBasicQueryinginFeatureLayerExploreinthesandboxOpeninCodePenViewliveThissampledemonstrateshowtoqueryonaFeatureLayerthroughcrimedatainSanFranciscobyusingthequeryFeatures()method.ThisallowstheusertosetthequeryparametersandshowstheresponseofthequerythroughthecorrespondingPopup.HowitworksWhentheapplicationstarts,theUIdisplaysqueryoptions,eitherabasicqueryorquerybydistance.Thequeryiscalledbasedonwheretheuserclicksonthemap.Afteralocationisclickedintheapplication,thisfunctioniscalled.TheFeatureLayerhasmanymethodsusedtoperformqueriesonitsdata.ThequeryFeatures()methodallowstheusertoqueryfeaturesintheFeatureLayerbasedonaninputqueryobject.ThismethodreturnsaFeatureSetPromisewhichcanbeaccessedusing.then().UsedarkcolorsforcodeblocksCopy                    1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 functionqueryFeatures(screenPoint){ constpoint=view.toMap(screenPoint); layer.queryFeatures({ //queryobject geometry:point, spatialRelationship:"intersects", returnGeometry:false, outFields:["*"], }) .then((featureSet)=>{ //setgraphiclocationtomousepointerandaddtomapview pointGraphic.geometry=point; view.graphics.add(pointGraphic); //openpopupofqueryresult view.popup.open({ location:point, features:featureSet.features }); }); }Iftheuserselects'QueryByDistance',twoparameters,distanceandunits,areaddedtothequeryobjectthatistheinputforlayer.queryFeatures(),returninganyiteminthefeaturethatiswithin0.5milesfromwheretheuserclickedonthemap.Thefirstfeaturethatishighlightedwillnotnecessarilybethesameasthefeatureoriginallyclickedon,buteachfeatureresultingfromthequerycanbeviewedbyclickingthroughthearrowsatthebottomofthepopup.UsedarkcolorsforcodeblocksCopy         1 2 3 4 5 6 7 8 9 layer.queryFeatures({ geometry:point, //distanceandunitswillbenullifbasicqueryselected distance:0.5, units:"miles", spatialRelationship:"intersects", returnGeometry:false, outFields:["*"], })SeealsoQueryfeaturesfromaFeatureLayer.2DMapViewqueryFeaturesFeatureLayerQuery4.12Wasthispagehelpful?YesNoYourbrowserisnolongersupported.Pleaseupgradeyourbrowserforthebestexperience.Seeourbrowserdeprecationpostformoredetails.