Client-side feature queries are useful in situations where the application should deliver immediate results in response to user input. With queries on the LayerView there is no round-trip to the server. In this sample users can draw a polygon, polyline or point geometry which is then used as the spatial geometry parameter in the query.
Before running the query on the the SceneLayerView we define what statistics we want to receive on the matching features. This is achieved assigning a StatisticDefinition array to outStatistics and calling queryFeatures on the SceneLayerView:
Use dark colors for code blocksCopy
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
const query = sceneLayerView.createQuery();
query.geometry = sketchGeometry;
query.outStatistics = [
...
{
onStatisticField:
"CASE WHEN (yearCompleted >= '1975' AND yearCompleted <= '1999') THEN 1 ELSE 0 END",
outStatisticFieldName: "year_1975",
statisticType: "sum"
},
...
];
sceneLayerView.queryFeatures(query).then((response) => {
console.log("Statistics", response.features[0].attributes)
});
The polygon, polyline or point used for the query is drawn using the SketchViewModel. We define the SketchViewModel by passing in the view and a GraphicsLayer where the polygon, polyline or point is drawn. Optionally we can set a symbol for the polygon, polyline or point:
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
26
27
// use SketchViewModel to draw polygons that are used to query
const sketchViewModel = new SketchViewModel({
layer: graphicsLayer,
view: view,
polygonSymbol: {
type: "polygon-3d",
symbolLayers: [
{
type: "fill",
material: {
color: [255, 255, 255, 0.8]
},
outline: {
color: [211, 132, 80, 0.7],
size: "10px"
}
}
]
}
});
sketchViewModel.on("create", (event) => {
if (event.state === "complete") {
sketchGeometry = event.graphic.geometry;
performQuery();
}
});