Skip to content

This sample demonstrates how to run aggregate spatial statistics on a FeatureLayer to compute the convex hull of grouped features when using groupByFieldsForStatistics is used. Each statistics group is represented by a convex hull, the smallest area containing all features in that group.

The map shows the National Forest System (NFS) lands symbolized by regions. The data was downloaded from the U.S. Forest Service website.

How it works

When the application starts, it performs two one‑time queries against all features in the layer, using the full resolution geometries to ensure accuracy. The results are stored for later use for map and chart interactions.

1. Aggregated Statistics Query

  • This query calculates the:
    • Count of forests and total acreage, grouped by region.
    • Convex hull geometry for each region — the smallest polygon containing all forests in that region.
  • This query is used to show the number of forests and total acres in each region as the user hovers over the chart.
Use dark colors for code blocksCopy
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
// Define the statistics to compute for each region
const consumeStatsByRegion = {
  onStatisticField: statsField,
  outStatisticFieldName: "totalAcresStatsField",
  statisticType: "sum",
};

const forestsInRegion = {
  onStatisticField: "OBJECTID",
  outStatisticFieldName: "forestCountStatsField",
  statisticType: "count",
};

const aggregatedConvex = {
  statisticType: "convex-hull-aggregate",
  outStatisticFieldName: "aggregateConvexHull",
};

const query = layer.createQuery();
query.groupByFieldsForStatistics = [groupField];
query.orderByFields = [`${groupField} desc`];
query.outStatistics = [consumeStatsByRegion, forestsInRegion, aggregatedConvex];

// Execute the statistics query to use for chart and region data
const statsResults = await querySource.queryFeatures(query);

2. Top Features Query

  • Executes a TopFeaturesQuery to identify the largest forest in each region.
  • Used when the user toggles Highlight largest forest in region in the UI.
Use dark colors for code blocksCopy
1
2
3
4
5
6
7
8
9
10
11
12
13
// TopFeatureQuery parameter to get the largest forest in each region
const topFeatureQuery = {
  topFilter: {
    topCount: 1,
    groupByFields: [groupField],
    orderByFields:  [`${statsField} desc`],
  },
  returnGeometry: true,
  returnGeometry: true,
  cacheHint: true,
  outFields: ["*"]
};
const topQueryResult = await layer.queryTopFeatures(topFeatureQuery);

Then, a chart is created to show the total acres of forests in each region. Users can hover over the chart to see the forest region on the map. The convex hull representing the smallest area containing all forests in that region will be added to the map and a featureEffect will be applied to the layer view to highlight forests in the selected region.

Your browser is no longer supported. Please upgrade your browser for the best experience. See our browser deprecation post for more details.