I am just trying to display a map with counties and national parks. see code below.
dojo.require("dijit.dijit"); // optimize: load dijit layer
dojo.require("dijit.layout.BorderContainer");
dojo.require("dijit.layout.ContentPane");
dojo.require("esri.map");
dojo.require("dijit.layout.AccordionContainer");
dojo.require("dojo.fx");// needed if use jsapi 3.0 or 3.2
dojo.require("agsjs.dijit.TOC");
dojo.require("esri.utils");
dojo.require("esri.layers.FeatureLayer");
dojo.require("esri.tasks.geometry");
dojo.require("esri.dijit.Scalebar");
dojo.require("esri.graphic");
var countyLayer;
var parkLayer;
var trailsLayer;
var trailsFeatureLayer;
var parkBoundsLayer;
var map;
function init() {
esri.config.defaults.io.timeout = 300000;
//map = null;
map = new esri.Map("mapDiv", { extent: esri.geometry.geographicToWebMercator(new esri.geometry.Extent(-105.5,37.4,-97.1,42.8, new esri.SpatialReference({wkid:4326}))) });
var initBaseMap = new esri.layers.ArcGISTiledMapServiceLayer("https://server.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer/");
map.addLayer(initBaseMap);
var query = new esri.tasks.Query();
query.returnGeometry = true;
query.where = "(STATE = '08' AND COUNTY = '013') OR (STATE = '08' AND COUNTY = '069') OR (STATE = '08' AND COUNTY = '123') OR (STATE = '56' AND COUNTY = '001') OR (STATE = '56' AND COUNTY = '021')";
parkLayer = new esri.layers.ArcGISDynamicMapServiceLayer("https://insidemapservices.nps.gov/arcgis/rest/services/NPSUnits/MapServer", {
id: 'parkLayer',
opacity: 1.0
});
trailsLayer = new esri.layers.ArcGISDynamicMapServiceLayer("https://insidemapservices.nps.gov/arcgis/rest/services/NPSNationalTrails/MapServer", {
id: 'trailsLayer',
opacity: 1.0
});
var countiesSelectionSymbol = new esri.symbol.SimpleFillSymbol().setColor(new dojo.Color([82, 132, 250, 0.2]));
countiesSelectionSymbol.setOutline(new esri.symbol.SimpleLineSymbol("solid", new dojo.Color("blue"), 2));
countyLayer = new esri.layers.FeatureLayer("https://insidemapservices.nps.gov/arcgis/rest/services/USCounties2000/MapServer/0", {
outFields: ["*"],
mode: esri.layers.FeatureLayer.MODE_SELECTION
});
countyLayer.setSelectionSymbol(countiesSelectionSymbol);
map.addLayer(countyLayer);
parkBoundsLayer = new esri.layers.FeatureLayer("https://insidemapservices.nps.gov/arcgis/rest/services/NPSUnits/MapServer/0", {
outFields: ["*"],
mode: esri.layers.FeatureLayer.MODE_SELECTION
});
var parkBoundsSelectionSymbol = new esri.symbol.SimpleFillSymbol().setColor(new dojo.Color([250, 50, 2, 0.5]));
parkBoundsSelectionSymbol.setOutline(new esri.symbol.SimpleLineSymbol("solid", new dojo.Color("red"), 3));
parkBoundsLayer.setSelectionSymbol(parkBoundsSelectionSymbol);
map.addLayer(parkBoundsLayer);
trailsFeatureLayer = new esri.layers.FeatureLayer("https://insidemapservices.nps.gov/arcgis/rest/services/NPSNationalTrails/MapServer/0", {
outFields: ["*"],
mode: esri.layers.FeatureLayer.MODE_SELECTION
});
var trailsFeatureSelectionSymbol = new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_DASH, new dojo.Color([102, 0, 204]), 3);
trailsFeatureLayer.setSelectionSymbol(trailsFeatureSelectionSymbol);
map.addLayer(trailsFeatureLayer);
countyLayer.queryFeatures(query, function (featureSet) {
selectCounties(query);
if (featureSet.features.length > 0 && featureSet.features[0].geometry.type === "polygon") {
dojo.forEach(featureSet.features, function (feature) {
selectParks(feature.geometry);
selectTrails(feature.geometry);
});
}
}, function () { });
dojo.connect(map, 'onLayersAddResult', function () {
var toc = new agsjs.dijit.TOC(
{
map: map,
layerInfos: [
{
layer: parkLayer,
title: "NPS Parks"
},
{
layer: trailsLayer,
title: "NPS - DOI Trails"
}
]
},
'tocDiv'
);
toc.startup();
});
map.addLayers([trailsLayer, parkLayer]);
}
dojo.ready(init);
function selectCounties(query) {
var deferred;
deferred = countyLayer.selectFeatures(query, esri.layers.FeatureLayer.SELECTION_NEW, function (features) {
//Zoom map to entire extent of counties
map.setExtent(esri.graphicsExtent(features).expand(2));
});
return deferred;
}
function selectParks(polygon) {
var query = new esri.tasks.Query();
query.geometry = polygon.getExtent();
query.spatialRelationship = esri.tasks.Query.SPATIAL_REL_INTERSECTS;
parkBoundsLayer.selectFeatures(query, esri.layers.FeatureLayer.SELECTION_ADD, showParkNames(), function () { });
}
function showParkNames(features) {
dojo.forEach(features, function (feature) {
var featureText = features.attributes.UNIT_TYPE + ' - ' + feature.attributes.PARKNAME + ' (' + feature.attributes.UNIT_CODE + ') ';
dojo.create("li", { innerHTML: featureText }, dojo.byId("parks"));
});
}
function selectTrails(polygon) {
var query = new esri.tasks.Query();
query.geometry = polygon.getExtent();
query.spatialRelationship = esri.tasks.Query.SPATIAL_REL_INTERSECTS;
trailsFeatureLayer.selectFeatures(query, esri.layers.FeatureLayer.SELECTION_ADD, showTrailNames(), function () { });
}
function showTrailNames(features) {
dojo.forEach(features, function (feature) {
var featureText = feature.attributes.NationalTrailDesignation;
dojo.create("li", { innerHTML: featureText }, dojo.byId("parks"));
});
}
