Learn how to execute a SQL query to access polygon features in a feature service .
A feature service hosted in ArcGIS can contain a large number of features . To access a subset of the features, you can execute a SQL or spatial query, or both at the same time. Your query can return the attributes, geometry , or both attributes and geometry for each record. SQL and spatial queries are useful when a feature layer is very large and you just want to access a subset of the data.
In this tutorial, you perform server-side SQL queries to return a subset of the features from the LA County Parcels feature service . The feature service contains over 2.4 million features. The resulting features are displayed as a Geo
Prerequisites You need an ArcGIS Developer or ArcGIS Online account to access the developer dashboard and create an API key .
Steps Create a new pen To get started, either complete the Display a scene tutorial or use this pen . Set the API key To access location services , you need an API key or OAuth 2.0 access token . To learn how to create and scope your key, visit the Create an API key tutorial.
Go to your dashboard to get an API key. The API key must be scoped to access the services used in this tutorial.
In CodePen , update api to use your key. Update cesium to use your Cesium ion access token .
Use dark colors for code blocks
Change line Change line
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
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
const apiKey = "YOUR_API_KEY" ;
Cesium.ArcGisMapService.defaultAccessToken = apiKey;
const cesiumAccessToken = "YOUR_CESIUM_ACCESS_TOKEN" ;
Cesium.Ion.defaultAccessToken = cesiumAccessToken;
const arcGisImagery = Cesium.ArcGisMapServerImageryProvider.fromBasemapType(Cesium.ArcGisBaseMapType.SATELLITE);
const viewer = new Cesium.Viewer( "cesiumContainer" , {
baseLayer : Cesium.ImageryLayer.fromProviderAsync(arcGisImagery),
});
Add references to ArcGIS REST JS In the <head> element, reference the feature-servicerequest
Use dark colors for code blocks
Add line. Add line.
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
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
< script src = "https://cesium.com/downloads/cesiumjs/releases/1.107/Build/Cesium/Cesium.js" > </ script >
< link href = "https://cesium.com/downloads/cesiumjs/releases/1.107/Build/Cesium/Widgets/widgets.css" rel = "stylesheet" >
< script src = "https://unpkg.com/@esri/arcgis-rest-request@4.0.0/dist/bundled/request.umd.js" > </ script >
< script src = "https://unpkg.com/@esri/arcgis-rest-feature-service@4.0.0/dist/bundled/feature-service.umd.js" > </ script >
In the <body>, create an arcgisfeature service .
Use dark colors for code blocks
Add line.
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
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
const apiKey = "YOUR_API_KEY" ;
Cesium.ArcGisMapService.defaultAccessToken = apiKey;
const authentication = arcgisRest.ApiKeyManager.fromKey(apiKey);
Create a query selector ArcGIS feature layers support a standard SQL query where clause. Use a drop-down <select> element to provide a list of SQL queries for the LA County Parcels feature layer.
Create a <select> HTML element that allows the user to select different SQL queries. Construct each SQL query based on the values of attributes in the LA County Parcels layer, such as Use and Tax.
Expand
Use dark colors for code blocks
Add line. Add line. Add line. Add line. Add line. Add line. Add line. Add line. Add line. Add line. Add line.
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
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
< body >
< div id = "cesiumContainer" > </ div >
< select id = "query-select" >
< option value = "" > Choose a WHERE clause... </ option >
< option value = "UseType = 'Residential'" > UseType = 'Residential' </ option >
< option value = "UseType = 'Government'" > UseType = 'Government' </ option >
< option value = "UseType = 'Irrigated Farm'" > UseType = 'Irrigated Farm' </ option >
< option value = "TaxRateArea = 10853" > TaxRateArea = 10853 </ option >
< option value = "TaxRateArea = 10860" selected > TaxRateArea = 10860 </ option >
< option value = "TaxRateArea = 08637" > TaxRateArea = 08637 </ option >
< option value = "Roll_LandValue > 1000000" > Roll_LandValue > 1000000 </ option >
< option value = "Roll_LandValue < 1000000" > Roll_LandValue < 1000000 </ option >
</ select >
< script >
Style the <select> element so that it displays properly in your application.
Expand
Use dark colors for code blocks
Add line. Add line. Add line. Add line. Add line. Add line. Add line. Add line.
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
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
< style >
html , body , #cesiumContainer {
width : 100% ;
height : 100% ;
padding : 0px ;
margin : 0px ;
}
#query-select {
position : absolute;
top : 8px ;
left : 8px ;
padding : 4px 8px ;
font-size : 16px ;
border-radius : 0 ;
}
</ style >
Query the parcel layer When the user selects a SQL query, use the ArcGIS REST JS query
Copy the URL of the LA County Parcels feature layer. Define a new perform function that takes a SQL query string as input.
Expand
Use dark colors for code blocks
Add line. Add line. Add line. Add line. Add line. Add line.
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
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
const layerName = "LA_County_Parcels" ;
const layerURL = "https://services3.arcgis.com/GVgbJbqm8hXASVYi/arcgis/rest/services/" +layerName+ "/FeatureServer/0" ;
function performQuery ( whereClause ) {
}
Query the feature layer using the querywhere paramater as well as your authentication object. Format results as geojson.
Expand
Use dark colors for code blocks
Add line. Add line. Add line. Add line. Add line. Add line. Add line. Add line. Add line.
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
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
const layerName = "LA_County_Parcels" ;
const layerURL = "https://services3.arcgis.com/GVgbJbqm8hXASVYi/arcgis/rest/services/" +layerName+ "/FeatureServer/0" ;
function performQuery ( whereClause ) {
arcgisRest.queryFeatures({
url : layerURL,
authentication,
f : "geojson" ,
returnGeometry : true ,
where : whereClause,
})
}
Add an event listener to your <select> HTML element. When the selected value changes, call the perform function.
Expand
Use dark colors for code blocks
Add line. Add line. Add line. Add line. Add line. Add line. Add line. Add line. Add line.
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
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
const layerName = "LA_County_Parcels" ;
const layerURL = "https://services3.arcgis.com/GVgbJbqm8hXASVYi/arcgis/rest/services/" +layerName+ "/FeatureServer/0" ;
function performQuery ( whereClause ) {
arcgisRest.queryFeatures({
url : layerURL,
authentication,
f : "geojson" ,
returnGeometry : true ,
where : whereClause,
})
}
const select = document .getElementById( "query-select" );
select.addEventListener( "change" , () => {
if (select.value !== "" ) {
const whereClause = select.value;
performQuery(whereClause);
}
});
Set the query extent The set of features returned by ArcGIS REST JS may not be visible from the current camera position. Add the camera position to the REST request as a geometry object to only return features that intersect the current viewable extent.
Limit to returned features The maximum number of features returned by a query for hosted feature layers is 2000. To return more, you need to check if the request exceeded the maximum feature amount with exceeded, then use the result parameter to make multiple requests with the appropriate offset values. To learn more, visit the REST API documentation .
Calculate the current viewable extent using the compute
Expand
Use dark colors for code blocks
Add line. Add line. Add line. Add line. Add line. Add line. Add line. Add line.
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
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
function performQuery ( whereClause ) {
const rect = viewer.camera.computeViewRectangle();
const boundsRadian = [rect.east,rect.south,rect.west,rect.north];
const boundsDegree = [];
for (coordinate of boundsRadian) {
boundsDegree.push(Cesium.Math.toDegrees(coordinate));
}
arcgisRest.queryFeatures({
url : layerURL,
authentication,
f : "geojson" ,
returnGeometry : true ,
where : whereClause,
})
}
Set the geometry parameter of your query to the extent, and specify the geometry type as esrispatial intersection to only return features that overlap with the extent.
Expand
Use dark colors for code blocks
Add line. Add line. Add line. Add line.
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
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
arcgisRest.queryFeatures({
url : layerURL,
authentication,
f : "geojson" ,
returnGeometry : true ,
where : whereClause,
geometry : boundsDegree,
geometryType : "esriGeometryEnvelope" ,
spatialRel : "esriSpatialRelIntersects" ,
inSR : 4326 ,
})
Display results After you perform a SQL query, add the resulting features to the scene as GeoJSON.
Add the service response service to the scene as a Geo
Expand
Use dark colors for code blocks
Add line. Add line. Add line. Add line. Add line. Add line. Add line. Add line. Add line. Add line.
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
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
arcgisRest.queryFeatures({
url : layerURL,
authentication,
f : "geojson" ,
returnGeometry : true ,
where : whereClause,
geometry : boundsDegree,
geometryType : "esriGeometryEnvelope" ,
spatialRel : "esriSpatialRelIntersects" ,
inSR : 4326 ,
})
.then( ( response ) => {
console .log(response)
Cesium.GeoJsonDataSource.load(response,{
outline : true ,
}).then( ( data )=> {
viewer.dataSources.add(data);
})
})
In the event listener, remove all previous query results by calling data
Expand
Use dark colors for code blocks
Add line.
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
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
const select = document .getElementById( "query-select" );
select.addEventListener( "change" , () => {
viewer.dataSources.removeAll();
if (select.value !== "" ) {
const whereClause = select.value;
performQuery(whereClause);
}
});
Run the app In CodePen , run your code to display the map.
When the scene loads, you should be able to use the query selector to display parcels. Click on a parcel to show a pop-up with the feature's attributes.
What's next? Learn how to use additional ArcGIS location services in these tutorials:
