<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=7" /> <title>UW Libraries Aerial Photo Finder</title> <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/2.8/js/dojo/dijit/themes/tundra/tundra.css"> <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/2.8/js/dojo/dojox/grid/resources/TundraGrid.css"> <link rel="stylesheet" type="text/css" href="css/aerials.css" /> <script type="text/javascript"> var djConfig = { parseOnLoad: true }; </script> <script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=2.8"> </script> <script type="text/javascript"> dojo.require("dijit.dijit"); // optimize: load dijit layer dojo.require("dijit.layout.BorderContainer"); dojo.require("dijit.layout.ContentPane"); dojo.require("dijit.layout.AccordionContainer"); dojo.require("dijit.form.Button"); dojo.require("dijit.form.CheckBox"); dojo.require("esri.map"); dojo.require("esri.toolbars.draw"); dojo.require("esri.layers.FeatureLayer"); dojo.require("esri.tasks.query"); dojo.require("dojox.grid.DataGrid"); dojo.require("dojo.data.ItemFileReadStore"); dojo.require("esri.dijit.Popup"); var map, toolbar; var aerialsLayer; var layerList = []; function init() { //function init sets up the map with initial extent set to the Washington state borders adds the toolbar for the selection tool var initialExtent = new esri.geometry.Extent({ "xmin": -13888062, "ymin": 5779365, "xmax": -12794704, "ymax": 6237988, "spatialReference": { "wkid": 102100 } }); map = new esri.Map("map", { extent: initialExtent }); dojo.connect(map, 'onLoad', function (map) { //initialize the toolbar toolBar = new esri.toolbars.Draw(map); dojo.connect(toolBar, "onDrawEnd", onDrawEnd); //resize the map when the browser resizes dojo.connect(dijit.byId('map'), 'resize', map, map.resize); }); var basemapUrl = "http://server.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer"; var featureLayerUrl = "http://wagda.lib.washington.edu/rest/services/WAGDA_Aerials/MapServer/0"; var basemap = new esri.layers.ArcGISTiledMapServiceLayer(basemapUrl); var content = "<b>Project Name</b>: ${prjname}" + "<br><b>Title</b>: ${title}" + "<br><b>Author</b>: ${author}"; var infoTemplate = new esri.InfoTemplate("${FIELD_NAME}", content); //the infoTemplate sets up the pop up box aerialsLayer = new esri.layers.FeatureLayer(featureLayerUrl, { mode: esri.layers.FeatureLayer.MODE_SELECTION, infoTemplate: infoTemplate, outFields: ["title", "prjname", "author", "objectid_1", "pdf", "indexmap", "scale", "date_", "color", "subject", "note_", "desc_", "rasterurl"] }); aerialsLayer.setSelectionSymbol(new esri.symbol.SimpleFillSymbol().setColor(new dojo.Color([160, 214, 238, 0.25]))); map.addLayer(basemap); map.addLayer(aerialsLayer); } function onDrawEnd(extent) { //function onDrawEnd sets up the selection tool and sends results to datagrid toolBar.deactivate(); //select features within the draw extent var query = new esri.tasks.Query(); query.geometry = extent; aerialsLayer.selectFeatures(query, esri.layers.FeatureLayer.SELECTION_NEW, function (features, selectionMethod) { //adds selected features to the grid var items = dojo.map(features, function (feature) { return feature.attributes; }); var data = { identifier: "objectid_1", items: items }; var store = new dojo.data.ItemFileReadStore({ data: data }); grid.setStore(store); grid.setSortIndex(3); }); } function clearGrid() { //function clearGrid clears the datagrid and the aerialsLayer features var emptyCells = { items: "" }; var emptyStore = new dojo.data.ItemFileReadStore({ data: emptyCells }); grid.setStore(emptyStore); removeLayer(); } function makeRasterButton(rid) { //datagrid formatter for raster button var rasterButtonCheckboxHandler = function () { if (rBtn.checked === true) { addRaster(rid); } else { removeRaster(rid); } }; var rBtn = new dijit.form.CheckBox({ name: "checkBox", value: "On", checked: false, onClick: rasterButtonCheckboxHandler }); return rBtn; } function addRaster(rid) { //adds raster to map var params = new esri.layers.ImageServiceParameters(); params.noData = 0; var rasterUrl = rid; var raster = new esri.layers.ArcGISImageServiceLayer(rasterUrl, { id: rid, imageServiceParameters: params, "opacity": .70 }) //alert(rid); map.addLayer(raster); layerList.push({ layer:rid }); alert(layerList[0]); } function removeRaster(rid) { //removes raster from map var rasterLayer = map.getLayer(rid); map.removeLayer(rasterLayer); } //show map on load dojo.addOnLoad(init); </script> </head> <body class="tundra"> <div id="mainWindow" dojotype="dijit.layout.BorderContainer" design="headline" gutters="false" style="width:100%; height:100%;"> <div id="header" dojotype="dijit.layout.ContentPane" region="top">UW Libraries Aerial Photography</div> <div id="map" dojotype="dijit.layout.ContentPane" region="center"></div> <div dojotype="dijit.layout.ContentPane" id="leftPane" style="width:140px;height:100%" region="left" splitter="false"> <div dojoType="dijit.layout.AccordionContainer"> <div dojoType="dijit.layout.ContentPane" id="toolPane" title="Tools" selected="true"> <div id="toolDiv"></div>To select features by drawing a rectangle, click select and draw a box on the map. To clear selection, click Clear.</br> <button dojoType="dijit.form.Button" onClick="toolBar.activate(esri.toolbars.Draw.EXTENT);">Select</button> <button dojoType="dijit.form.Button" onClick="toolBar.deactivate();aerialsLayer.clearSelection();clearGrid();">Clear</button> </br>To select features by using a text search, enter the text in the box.</div> <div dojoType="dijit.layout.ContentPane" title="About">Description <div id="about" style="padding: 2px 2px;"></div> </div> </div> </div> <div id="footer" dojotype="dijit.layout.ContentPane" region="bottom" style="height:150px"> <table dojotype="dojox.grid.DataGrid" jsid="grid" id="grid" style="width:100%;height:100%;" selectionMode="none"> <thead> <tr> <th field="rasterurl" formatter="makeRasterButton" width="50px">On/Off</th> <th field="title" width="75px">Title</th> </tr> </thead> </table> </div> </div> </body> </html>
Solved! Go to Solution.
function RemoveAllLayers() { for (var j = 0; j < map.layerIds.length; j++) { var layer = map.getLayer(map.layerIds); if (layer.url.indexOf('basemap') == -1) { map.removeLayer(layer); } } }
function RemoveAllLayers() { for (var j = 0; j < map.layerIds.length; j++) { var layer = map.getLayer(map.layerIds); if (layer.url.indexOf('basemap') == -1) { map.removeLayer(layer); } } }
function removeAllLayers() { var mapLayers = map.layerIds.length for (var j = mapLayers-1; j >=0; j--){ var layer = map.getLayer(map.layerIds); if (layer.id !== 'layer0') {map.removeLayer(layer);} } }