Skip to content

Commit 7d347f0

Browse files
committed
Added sample that loads any feature service by REST endpoint
1 parent 43b218e commit 7d347f0

File tree

3 files changed

+130
-0
lines changed

3 files changed

+130
-0
lines changed

css/examples.css

+1
Original file line numberDiff line numberDiff line change
@@ -612,6 +612,7 @@ input,
612612
textarea,
613613
.uneditable-input {
614614
margin-left: 0;
615+
margin-bottom: 4px;
615616
}
616617

617618
input[disabled],

html/cloud/get_feature_service.html

+128
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,128 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
5+
<meta http-equiv="X-UA-Compatible" content="IE=7,IE=9">
6+
<meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">
7+
<title>Get Feature Service</title>
8+
<link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.3/js/esri/css/esri.css">
9+
<link rel="stylesheet" href="../../css/examples.css">
10+
<!-- Load the library references for ArcGIS API for JavaScript -->
11+
<script src="http://serverapi.arcgisonline.com/jsapi/arcgis/3.3compact"></script>
12+
<script>
13+
dojo.require("esri.map");
14+
dojo.require("esri.layers.graphics");
15+
dojo.require("esri.layers.FeatureLayer");
16+
dojo.require("esri.dijit.Popup");
17+
dojo.require("esri.tasks.geometry");
18+
19+
var featureLayer, oldFeatureLayer;
20+
var geometryService;
21+
22+
function init() {
23+
var options = {
24+
basemap: "gray",
25+
center: [-28,40],
26+
zoom: 3,
27+
infoWindow: new esri.dijit.Popup(null, dojo.create("div")) // Define a popup
28+
}
29+
// Create map
30+
map = new esri.Map("mapDiv", options);
31+
geometryService = new esri.tasks.GeometryService("http://tasks.arcgisonline.com/ArcGIS/rest/services/Geometry/GeometryServer");
32+
// Zoom to layer
33+
dojo.connect(map, "onLayerAddResult", layerAdded);
34+
// Listen for map update events
35+
dojo.connect(map,"onUpdateStart",function(){
36+
setStyle("progress", "progress");
37+
});
38+
dojo.connect(map,"onUpdateEnd",function(){
39+
setStyle("progress", "progress hidden");
40+
});
41+
}
42+
43+
// Listen for enter key
44+
function addService_onKeyPress(e) {
45+
if (e.keyCode == 13 || e.keyCode == "13") {
46+
addFeatureService();
47+
}
48+
}
49+
50+
function addFeatureService() {
51+
// Create a feature layer to get feature service
52+
setStyle("progress", "progress");
53+
removeFeatureService();
54+
var infoTemplate = new esri.InfoTemplate("Fields", "");
55+
var url = document.getElementById("featureServiceUrl").value.trim();
56+
featureLayer = new esri.layers.FeatureLayer(url, {
57+
mode: esri.layers.FeatureLayer.MODE_ONDEMAND,
58+
outFields: ["*"],
59+
opacity: .80,
60+
infoTemplate: infoTemplate
61+
});
62+
map.addLayer(featureLayer);
63+
}
64+
65+
function removeFeatureService() {
66+
setStyle("progress", "progress hidden");
67+
if (featureLayer) {
68+
map.removeLayer(featureLayer);
69+
map.infoWindow.hide();
70+
}
71+
}
72+
73+
function layerAdded(layer, error) {
74+
if (featureLayer) {
75+
if (typeof error == 'undefined') {
76+
zoomToLayer(featureLayer);
77+
} else {
78+
setStyle("progress", "progress hidden");
79+
alert("Feature service could not be loaded. Check URL.");
80+
}
81+
document.getElementById("featureServiceUrl").value = layer.url;
82+
}
83+
}
84+
85+
function zoomToLayer(layer) {
86+
var params = new esri.tasks.ProjectParameters();
87+
params.geometries = [layer.fullExtent];
88+
params.outSR = map.spatialReference;
89+
geometryService.project(params, function(geometries) {
90+
map.setExtent(geometries[0]);
91+
});
92+
}
93+
94+
function setMessage(msg) {
95+
var element = document.getElementById("userMessage");
96+
element.innerHTML = msg;
97+
}
98+
99+
function setStyle(elementName, className) {
100+
var element = document.getElementById(elementName);
101+
if (element)
102+
element.className = className;
103+
}
104+
105+
dojo.addOnLoad(init);
106+
</script>
107+
</head>
108+
<body>
109+
<div class="panel">
110+
<div class="titlearea"><span id="titleMessage" class="title-message">Get Feature Service</span></div>
111+
<div class="controls">
112+
<div class="buttons">
113+
ArcGIS REST endpoint URL:
114+
<textarea id="featureServiceUrl" rows="3"
115+
placeholder="http://services.arcgis.com/oKgs2tbjK6zwTdvi/arcgis/rest/services/Major_World_Cities/FeatureServer/0"
116+
value="http://services.arcgis.com/oKgs2tbjK6zwTdvi/arcgis/rest/services/Major_World_Cities/FeatureServer/0"
117+
onkeypress="addService_onKeyPress(event);">http://services.arcgis.com/oKgs2tbjK6zwTdvi/arcgis/rest/services/Major_World_Cities/FeatureServer/0
118+
</textarea>
119+
<button class="btn btn-primary" onclick="addFeatureService();">Add</button>
120+
<button class="btn" onclick="removeFeatureService();">Remove</button>
121+
</div>
122+
</div>
123+
<div class="message"><span id="userMessage" class="user-message"></span></div>
124+
</div>
125+
<div id="mapDiv"></div>
126+
<div id="progress" class="progress hidden"></div>
127+
</body>
128+
</html>

index.html

+1
Original file line numberDiff line numberDiff line change
@@ -29,6 +29,7 @@
2929
<li><a href='html/directions/directions.html')><button class="btn btn-extra-wide">Directions</button></a></li>
3030
<li><a href='html/drivetime/drivetime.html')><button class="btn btn-extra-wide">Drive Time</button></a></li>
3131
<li><a href='html/cloud/cloud_sql.html')><button class="btn btn-extra-wide">Cloud SQL</button></a></li>
32+
<li><a href='html/cloud/get_feature_service.html')><button class="btn btn-extra-wide">Get Feature Service</button></a></li>
3233
</ul>
3334
</div>
3435
</div>

0 commit comments

Comments
 (0)