I am looking for a way to add two variables together into a string.
My two variables are
var defExp = "SUB_REGION='East North Central'"; var defExp2 = "STATE_NAME IN( 'New York', 'New Jersey', 'Delaware')";
I need them to stay separate until they are in:
states.setDefinitionExpression(defExp OR defExp2);
I know this works:
var defExp = "SUB_REGION='East North Central' OR STATE_NAME IN( 'New York', 'New Jersey', 'Delaware')";
states.setDefinitionExpression(defExp);
But I need two separate variables.
Thank you
Solved! Go to Solution.
Rickey,
OK use this then:
defArr = []; if(defExp !== ""){ defArr.push(defExp); } if(defExp2 !== ""){ defArr.push(defExp2); } if(defExp3 !== ""){ defArr.push(defExp3); } states.setDefinitionExpression(defArr.join(" AND "));
Maybe I'm missing something, but wouldn't this work?
states.setDefinitionExpression(defExp + " and " + defExp2);
I have tried that but then it says defExp2 is not defined.
Have you tried this?
var where = defExp + " and " + defExp2
states.setDefinitionExpression(where);
If you get the same error, then you may have a scoping problem (defExpr2 is out of scope).
What I am really trying to do is change this JSFiddle so that this works:
on(node, "click", function (e) { switch (e.srcElement.value) { case "EastCoast": this.defExp = " SUB_REGION='East North Central' AND STATE_NAME IN( 'New York', 'New Jersey', 'Delaware')"; break; case "ENCentral": defExp = "SUB_REGION='East North Central'"; break; case "Pacific": this.defExp2 ="SUB_REGION='Pacific'"; break; case "Clear": defExp = ""; break; case "SQMI": defExp2 = "SQMI>20000"; break; case "AVE_FAM_SZ": defExp2 = "AVE_FAM_SZ<3"; break; case "PopMil": defExp2 = "POP2007>1000000"; break; } states.setDefinitionExpression(defExp + " and " + defExp2); });
Rickey,
Here is your fiddle code now working the best I can determine you are wanting it to work like:
<!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>Feature Layer - display results as an InfoWindow onHover</title> <link rel="stylesheet" href="http://js.arcgis.com/3.6/js/dojo/dijit/themes/tundra/tundra.css"> <link rel="stylesheet" href="http://js.arcgis.com/3.6/js/esri/css/esri.css"> <style> html, body, #mapDiv { padding:0; margin:0; height:100%; } #mapDiv { position: relative; } #buttons { background: #fff; box-shadow: 0 0 5px #888; left: 1em; padding: 0.5em; position: absolute; top: 1em; z-index: 40; } </style> <script src="http://js.arcgis.com/3.6/"></script> <script> var map, dialog; require([ "esri/map", "esri/layers/FeatureLayer", "esri/symbols/SimpleFillSymbol", "esri/symbols/SimpleLineSymbol", "esri/renderers/SimpleRenderer", "dojo/query", "dojo/on" ], function( Map, FeatureLayer, SimpleFillSymbol, SimpleLineSymbol, SimpleRenderer, query, on ) { map = new Map("mapDiv", { basemap: "streets", center: [-80.94, 33.646], zoom: 6, slider: false }); var states = new FeatureLayer("http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Demographics/ESRI_Census_USA/MapServer/5", { mode: FeatureLayer.MODE_SNAPSHOT, outFields: ["NAME", "POP2000", "POP2007", "POP00_SQMI", "POP07_SQMI", "AVE_FAM_SZ","SQMI","SUB_REGION", "STATE_NAME"] }); states.setDefinitionExpression("STATE_NAME = 'South Carolina'"); var symbol = new SimpleFillSymbol(); states.setRenderer(new SimpleRenderer(symbol)); map.addLayer(states); //setup click event for buttons query("input").forEach(function(node){ on(node, "click", function (e) { var defExp = states.getDefinitionExpression(), defExp2 = ""; switch (e.srcElement.value) { case "East Coast": defExp = "SUB_REGION LIKE '% Atlantic' AND STATE_NAME IN( 'New York', 'New Jersey', 'Delaware')"; break; case "East North Central": defExp = "SUB_REGION='East North Central'"; break; case "Pacific": defExp ="SUB_REGION='Pacific'"; break; case "Clear": defExp = ""; break; case "SQMI": defExp2 = "SQMI>20000"; break; case "AVE_FAM_SZ": defExp2 = "AVE_FAM_SZ<3"; break; case "PopMil": defExp2 = "POP2007>1000000"; break; } var fDefExpr = (defExp !== "") ? ((defExp2 !== "") ? defExp + " AND " + defExp2 : defExp) : ((defExp2 !== "") ? defExp2 : ""); states.setDefinitionExpression(fDefExpr); }); }); }); </script> </head> <body class="tundra"> <div id="mapDiv"> <div id="buttons"> <input type="button" value="East Coast"/> <input type="button" value = "East North Central"/> <input type="button" value = "Pacific"/> <input type="button" value="SQMI"/> <input type="button" value="AVE_FAM_SZ"/> <input type="button" value="PopMil"/> <input type="button" value="Clear"/> </div> </div> </body> </html>
I believe this will work. I am going to make the buttons drop lists that way two can be selected at once.
Rickey,
The way that I reworked your code you can select two as well. One from defExp and one from defExp2.
Robert,
How would I add a 3rd select-able option?
Rickey,
Can you give me some more information? Currently the sample uses two options that can be used together or independently.