I have been working on a selection toolset. So far, I can select a feature layer using a variety of draw tools. What I am wanting to do is toggle between the NEW, ADD, and SUBSTRACT selection mode. Right now, the tool set is built to select NEW features as shown in the application below. I am looking for some suggestions on how I can achieve this functionality. What would be the best approach? I appreciate any assistance or feedback. Thanks.<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=7, IE=9, IE=10">
<!--The viewport meta tag is used to improve the presentation and behavior of the samples
on iOS devices-->
<meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">
<title>Layer in a map service - [ON-DEMAND]</title>
<link rel="stylesheet" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.5/js/dojo/dijit/themes/claro/claro.css">
<link rel="stylesheet" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.5/js/esri/css/esri.css" />
<script>var dojoConfig = { parseOnLoad:true };</script>
<script src="http://serverapi.arcgisonline.com/jsapi/arcgis/3.5/"></script>
<script>
dojo.require("esri.map");
dojo.require("esri.layers.FeatureLayer");
var map, selectionToolbar, featureLayer;
// FUNCTION INITIALIZE
function init() {
map = new esri.Map("map", {
basemap: "streets",
center: [-97.395, 37.537],
zoom: 11
});
// CONNECT MAP WITH SELECTION TOOLBAR
dojo.connect(map, "onLoad", initSelectToolbar);
// FEATURE LAYER SELECTION COLOR
var FeatureLayerSelectionSymbol = new esri.symbol.SimpleFillSymbol().setColor(new dojo.Color([0,255,197,0.75]));
FeatureLayerSelectionSymbol.setOutline(new esri.symbol.SimpleLineSymbol("solid", new dojo.Color([0,230,169]), 2));
// FEATURE LAYER DEFINITION
featureLayer = new esri.layers.FeatureLayer("http://sampleserver3.arcgisonline.com/ArcGIS/rest/services/Petroleum/KSPetro/MapServer/1",{
mode: esri.layers.FeatureLayer.MODE_ONDEMAND,
outFields: ["*"]
});
// FEATURE LAYER SET SELECTION SYMBOL
featureLayer.setSelectionSymbol(FeatureLayerSelectionSymbol);
// ADD FEATURE LAYER TO MAP
map.addLayer(featureLayer);
}
// SELECTION TOOLBAR
function initSelectToolbar(map) {
selectionToolbar = new esri.toolbars.Draw(map);
var selectQuery = new esri.tasks.Query();
dojo.connect(selectionToolbar, "onDrawEnd", function(geometry) {
//hook up the button click events
dojo.connect(dojo.byId("drawPoint"),"click", function(){
selectionToolbar.activate(esri.toolbars.Draw.POINT);
});
dojo.connect(dojo.byId("drawPolyline"),"click", function(){
selectionToolbar.activate(esri.toolbars.Draw.POLYLINE);
});
dojo.connect(dojo.byId("drawFreehandPolyline"),"click", function(){
selectionToolbar.activate(esri.toolbars.Draw.FREEHAND_POLYLINE);
});
dojo.connect(dojo.byId("drawPolygon"),"click", function(){
selectionToolbar.activate(esri.toolbars.Draw.POLYGON);
});
dojo.connect(dojo.byId("drawFreehandPolygon"),"click", function(){
selectionToolbar.activate(esri.toolbars.Draw.FREEHAND_POLYGON);
});
dojo.connect(dojo.byId("drawLine"),"click", function(){
selectionToolbar.activate(esri.toolbars.Draw.LINE);
});
selectionToolbar.deactivate();
selectQuery.geometry = geometry;
var newSelection = featureLayer.selectFeatures(selectQuery, esri.layers.FeatureLayer.SELECTION_NEW);
//var addSelection = featureLayer.selectFeatures(selectQuery, esri.layers.FeatureLayer.SELECTION_ADD);
//var removeSelection = featureLayer.selectFeatures(selectQuery, esri.layers.FeatureLayer.SELECTION_SUBTRACT);
});
}
dojo.ready(init);
</script>
</head>
<body class="claro">
<button data-dojo-type="dijit.form.DropDownButton" id="selectionoptions" data-dojo-props="value:'options'">
<span>Selection Options</span>
<div data-dojo-type="dijit.Menu" id="selectionoptionsMenu">
<div id="newSelection" data-dojo-type="dijit.CheckedMenuItem" data-dojo-props="checked:'true'">New Selection</div>
<div id="addSelection" data-dojo-type="dijit.CheckedMenuItem" data-dojo-props="checked:'true'">Add Selection</div>
<div id="substractSelection" data-dojo-type="dijit.CheckedMenuItem" data-dojo-props="checked:'true'">Subtract Selection</div>
</div>
</button>
<button data-dojo-type="dijit.form.Button" id="drawrectangle" onClick="selectionToolbar.activate(esri.toolbars.Draw.EXTENT);">Select By Rectangle</button>
<button data-dojo-type="dijit.form.Button" id="drawPoint">Select By Point</button>
<button data-dojo-type="dijit.form.Button" id="drawPolyline">Select By Polyline</button>
<button data-dojo-type="dijit.form.Button" id="drawFreehandPolyline">Select By Freehand Polyline</button>
<button data-dojo-type="dijit.form.Button" id="drawPolygon">Select By Polygon</button>
<button data-dojo-type="dijit.form.Button" id="drawFreehandPolygon">Select By Freehand Polygon</button>
<button data-dojo-type="dijit.form.Button" id="drawLine">Select By Line</button>
<button data-dojo-type="dijit.form.Button" onClick="featureLayer.clearSelection();">Clear Selection</button><br>
<div id="map" style="position: relative; width:1000px; height:800px; border:1px solid #000;"></div>
<span id="messages"></span>
</body>
</html>
