This sample demonstrates how to query related features from a FeatureLayer by using the queryRelatedFeatures() method. Each hexagon on the map represents one or more major cities in the U.S. Clicking on a hexagon will trigger a query for its related features, which will be displayed in a table added to the view's UI.
How it works
A function calls queryObjectIds() whenever the user clicks on the map, which returns the objectId of the corresponding hexagon in the layer.
layer.queryObjectIds({
geometry: point,
spatialRelationship: "intersects",
returnGeometry: false,
outFields: ["*"]
})
We highlight the hexagon, then use the queryRelatedFeatures() method to query for the related features attached to this object id.
We get the attributes from the resulting FeatureSet and create a dgrid component that can hold the resulting data.
// get the attributes of the FeatureSetconst rows = relatedFeatureSet.features.map(function(feature) {
return feature.attributes;
});
if (!rows.length) { return; }
// create a new div for the grid of related features// append to queryResults div inside of the Feature widgetconst gridDiv = document.createElement("div")
const results = document.getElementById("queryResults");
results.appendChild(gridDiv);
// destroy current grid if existsif (grid) {
grid.destroy();
}
// create the grid to hold the results of the query grid = new Grid({
columns: Object.keys(rows[0]).map(function(fieldName) {
return {
label: fieldName,
field: fieldName,
sortable: true };
})
}, gridDiv);
// add the data to the grid grid.renderArray(rows);